88:I[903690,["/chat-static/_next/static/immutable/chunks/3im61c5a8fkcz.js","/chat-static/_next/static/immutable/chunks/1guyin7zoczci.js","/chat-static/_next/static/immutable/chunks/39rg-vyko_oef.js","/chat-static/_next/static/immutable/chunks/1sitju1_d7il0.js","/chat-static/_next/static/immutable/chunks/157bok9l8ft2k.js","/chat-static/_next/static/immutable/chunks/0wi_45vocl_-p.js","/chat-static/_next/static/immutable/chunks/3xk_70lpaq4rr.js","/chat-static/_next/static/immutable/chunks/0mwr0fog443j2.js","/chat-static/_next/static/immutable/chunks/01baumogimg6p.js","/chat-static/_next/static/immutable/chunks/3qqefvmwew4y9.js","/chat-static/_next/static/immutable/chunks/31bw9_yzlia2t.js","/chat-static/_next/static/immutable/chunks/0s_cw7e8300g7.js","/chat-static/_next/static/immutable/chunks/2obw3omjz3a42.js","/chat-static/_next/static/immutable/chunks/2cytw68p34q_e.js","/chat-static/_next/static/immutable/chunks/1znnlzfkj81j9.js","/chat-static/_next/static/immutable/chunks/3263tgpkly9nu.js","/chat-static/_next/static/immutable/chunks/0wnsukyi4k1ek.js","/chat-static/_next/static/immutable/chunks/0jv8_sp12utf0.js","/chat-static/_next/static/immutable/chunks/3knm8li7yvqyy.js","/chat-static/_next/static/immutable/chunks/022gnoebsh94r.js","/chat-static/_next/static/immutable/chunks/31kxnp_byhi43.js","/chat-static/_next/static/immutable/chunks/00hu8fdgh1j4v.js","/chat-static/_next/static/immutable/chunks/13kz2gfvgolzm.js","/chat-static/_next/static/immutable/chunks/3d5spne6o359m.js","/chat-static/_next/static/immutable/chunks/1e462i1ma5hqc.js","/chat-static/_next/static/immutable/chunks/2w2x4bf9lm3-y.js","/chat-static/_next/static/immutable/chunks/2uh_-aagfm1yq.js","/chat-static/_next/static/immutable/chunks/1m_firo4_gtz9.js","/chat-static/_next/static/immutable/chunks/3_3lqfmfv126f.js","/chat-static/_next/static/immutable/chunks/3wbu0v06tpqrr.js","/chat-static/_next/static/immutable/chunks/0m1kq5rn-0ww-.js","/chat-static/_next/static/immutable/chunks/3b31dkoetf3d7.js","/chat-static/_next/static/immutable/chunks/1vx8uudj0cz_4.js","/chat-static/_next/static/immutable/chunks/0p9rde4dp8mlf.js","/chat-static/_next/static/immutable/chunks/1urmgqflbxgxw.js","/chat-static/_next/static/immutable/chunks/0udaurr3r3784.js","/chat-static/_next/static/immutable/chunks/3m12kzoseic0s.js","/chat-static/_next/static/immutable/chunks/1tftl9086q6dm.js","/chat-static/_next/static/immutable/chunks/3io-u6yty6rrx.js","/chat-static/_next/static/immutable/chunks/08-__6bbjjmqq.js","/chat-static/_next/static/immutable/chunks/2jj-dsskzkkea.js","/chat-static/_next/static/immutable/chunks/1j5oudbzt39os.js","/chat-static/_next/static/immutable/chunks/3bi-_argycpwi.js","/chat-static/_next/static/immutable/chunks/3hu0_8f7tf9w8.js","/chat-static/_next/static/immutable/chunks/2lw3dfa252fnx.js","/chat-static/_next/static/immutable/chunks/0kuscvrfktvnt.js","/chat-static/_next/static/immutable/chunks/01enxheexz0xq.js","/chat-static/_next/static/immutable/chunks/2l3og29it_ib5.js","/chat-static/_next/static/immutable/chunks/1m5fp3kw0roaj.js","/chat-static/_next/static/immutable/chunks/0bxymcj1of6fi.js","/chat-static/_next/static/immutable/chunks/2svky_5tna12v.js","/chat-static/_next/static/immutable/chunks/0bli-y2vwpvug.js"],"ExplicitChatIdProvider"] 89:I[838238,["/chat-static/_next/static/immutable/chunks/3im61c5a8fkcz.js","/chat-static/_next/static/immutable/chunks/1guyin7zoczci.js","/chat-static/_next/static/immutable/chunks/39rg-vyko_oef.js","/chat-static/_next/static/immutable/chunks/1sitju1_d7il0.js","/chat-static/_next/static/immutable/chunks/157bok9l8ft2k.js","/chat-static/_next/static/immutable/chunks/0wi_45vocl_-p.js","/chat-static/_next/static/immutable/chunks/3xk_70lpaq4rr.js","/chat-static/_next/static/immutable/chunks/0mwr0fog443j2.js","/chat-static/_next/static/immutable/chunks/01baumogimg6p.js","/chat-static/_next/static/immutable/chunks/3qqefvmwew4y9.js","/chat-static/_next/static/immutable/chunks/31bw9_yzlia2t.js","/chat-static/_next/static/immutable/chunks/0s_cw7e8300g7.js","/chat-static/_next/static/immutable/chunks/2obw3omjz3a42.js","/chat-static/_next/static/immutable/chunks/2cytw68p34q_e.js","/chat-static/_next/static/immutable/chunks/1znnlzfkj81j9.js","/chat-static/_next/static/immutable/chunks/3263tgpkly9nu.js","/chat-static/_next/static/immutable/chunks/0wnsukyi4k1ek.js","/chat-static/_next/static/immutable/chunks/0jv8_sp12utf0.js","/chat-static/_next/static/immutable/chunks/3knm8li7yvqyy.js","/chat-static/_next/static/immutable/chunks/022gnoebsh94r.js","/chat-static/_next/static/immutable/chunks/31kxnp_byhi43.js","/chat-static/_next/static/immutable/chunks/00hu8fdgh1j4v.js","/chat-static/_next/static/immutable/chunks/13kz2gfvgolzm.js","/chat-static/_next/static/immutable/chunks/3d5spne6o359m.js","/chat-static/_next/static/immutable/chunks/1e462i1ma5hqc.js","/chat-static/_next/static/immutable/chunks/2w2x4bf9lm3-y.js","/chat-static/_next/static/immutable/chunks/2uh_-aagfm1yq.js","/chat-static/_next/static/immutable/chunks/1m_firo4_gtz9.js","/chat-static/_next/static/immutable/chunks/3_3lqfmfv126f.js","/chat-static/_next/static/immutable/chunks/3wbu0v06tpqrr.js","/chat-static/_next/static/immutable/chunks/0m1kq5rn-0ww-.js","/chat-static/_next/static/immutable/chunks/3b31dkoetf3d7.js","/chat-static/_next/static/immutable/chunks/1vx8uudj0cz_4.js","/chat-static/_next/static/immutable/chunks/0p9rde4dp8mlf.js","/chat-static/_next/static/immutable/chunks/1urmgqflbxgxw.js","/chat-static/_next/static/immutable/chunks/0udaurr3r3784.js","/chat-static/_next/static/immutable/chunks/3m12kzoseic0s.js","/chat-static/_next/static/immutable/chunks/1tftl9086q6dm.js","/chat-static/_next/static/immutable/chunks/3io-u6yty6rrx.js","/chat-static/_next/static/immutable/chunks/08-__6bbjjmqq.js","/chat-static/_next/static/immutable/chunks/2jj-dsskzkkea.js","/chat-static/_next/static/immutable/chunks/1j5oudbzt39os.js","/chat-static/_next/static/immutable/chunks/3bi-_argycpwi.js","/chat-static/_next/static/immutable/chunks/3hu0_8f7tf9w8.js","/chat-static/_next/static/immutable/chunks/2lw3dfa252fnx.js","/chat-static/_next/static/immutable/chunks/0kuscvrfktvnt.js","/chat-static/_next/static/immutable/chunks/01enxheexz0xq.js","/chat-static/_next/static/immutable/chunks/2l3og29it_ib5.js","/chat-static/_next/static/immutable/chunks/1m5fp3kw0roaj.js","/chat-static/_next/static/immutable/chunks/0bxymcj1of6fi.js","/chat-static/_next/static/immutable/chunks/2svky_5tna12v.js","/chat-static/_next/static/immutable/chunks/0bli-y2vwpvug.js"],"SWRDataProvider"] 8c:[] 8d:[["b_ypVdXp4fRBT",null],["b_qpvhGuZI7qx",null],["b_35tKRpMdmAB",null],["b_p1x6AV2TtEf",null],["b_YiFrqRedxkD",null]] 8e:[["b_ypVdXp4fRBT",{"templateVersionId":null,"templateCanonId":null}],["b_qpvhGuZI7qx",{"templateVersionId":null,"templateCanonId":null}],["b_35tKRpMdmAB",{"templateVersionId":null,"templateCanonId":null}],["b_p1x6AV2TtEf",{"templateVersionId":null,"templateCanonId":null}],["b_YiFrqRedxkD",{"templateVersionId":null,"templateCanonId":null}]] 8f:[["b_vqvDqxBReWw","$D2025-08-01T02:18:20.699Z"],["b_bwG7R7q14uo","$D2025-08-01T04:16:48.420Z"],["b_DzLPMiH3NAI","$D2025-08-21T01:59:14.077Z"],["b_GeAWS7nZ3vB","$D2025-08-21T02:00:59.517Z"],["b_w4OQjhROBIi","$D2025-08-21T02:01:05.054Z"],["b_im78CrhW9Lq","$D2025-08-21T02:02:14.231Z"],["b_B33i3lzEvYh","$D2025-08-21T02:12:44.218Z"],["b_Kdi5S5rZRLm","$D2025-08-21T02:20:36.445Z"],["b_ViFxR94bhAD","$D2025-08-21T02:23:11.232Z"],["b_RHTX4MbtDNp","$D2025-08-21T02:51:47.937Z"],["b_A7LUC9PAfna","$D2025-08-21T03:11:12.136Z"],["b_MRGCPKBsNNQ","$D2025-08-21T03:18:01.911Z"],["b_ZO0Eff4GoE7","$D2025-08-21T03:20:34.117Z"],["b_ebcxcBUv6R9","$D2025-08-21T03:51:28.676Z"],["b_LHpb0Jqjr5W","$D2025-08-21T03:58:15.282Z"],["b_lJYzIrBMqum","$D2025-08-26T02:37:10.176Z"],["b_vcNzBIh1I3J","$D2025-08-26T02:46:31.739Z"],["b_UgSQIazwHac","$D2025-08-26T02:53:12.014Z"],["b_dhmxt5hjUWP","$D2025-08-26T02:56:19.907Z"],["b_QezMcekGqlU","$D2025-08-26T03:08:48.057Z"],["b_sB6R3LZVIbO","$D2025-08-26T03:18:29.099Z"],["b_zBD7s4SHHZV","$D2025-08-26T03:22:40.263Z"],["b_R3miHHaepWX","$D2025-08-26T03:26:08.120Z"],["b_QjvhnZYTDwd","$D2025-08-26T03:38:06.763Z"],["b_61QjKJ4ZQ2K","$D2025-08-26T03:42:04.114Z"],["b_neli2el5cBr","$D2025-08-26T03:44:25.202Z"],["b_h52POXQGVzR","$D2025-08-26T03:47:17.991Z"],["b_eqacLucJsnt","$D2025-08-26T15:45:54.180Z"],["b_SBzy1wTVZ3n","$D2025-08-26T15:54:40.825Z"],["b_KrnzHd9Rk77","$D2025-08-26T20:27:29.143Z"],["b_3xpkEw0a1WC","$D2025-08-26T20:32:54.472Z"],["b_BgQDuTJvRmk","$D2025-08-26T20:34:07.027Z"],["b_9CpUUa2wCNu","$D2025-08-26T20:54:33.183Z"],["b_hEWU2W1GML6","$D2025-08-26T21:01:00.690Z"],["b_bXF53Xomuej","$D2025-08-26T21:11:16.088Z"],["b_LKJwX6peyVo","$D2025-08-26T21:21:43.174Z"],["b_DNhgH2QApv5","$D2025-08-26T21:56:24.956Z"],["b_fJg03LhnU4n","$D2025-08-26T22:02:43.131Z"],["b_sHu7MgD0E8a","$D2025-08-26T22:04:26.909Z"],["b_5RXkeReg8mg","$D2025-08-26T22:17:05.296Z"],["b_MeeSUIMHGGv","$D2025-08-26T22:21:47.242Z"],["b_Q8uAVslS2wd","$D2025-08-26T23:28:08.750Z"],["b_F8bpzktSfwq","$D2025-08-26T23:33:12.795Z"],["b_BEMTszIIN8g","$D2025-08-26T23:53:20.157Z"],["b_30fwIFcLbGE","$D2025-08-26T23:55:39.691Z"],["b_jKAJRaEWbfI","$D2025-08-26T23:56:59.392Z"],["b_NZ5M3jUGIj5","$D2025-08-27T00:01:44.857Z"],["b_3UaMLxBMPAk","$D2025-08-27T00:03:25.603Z"],["b_GjSXyRwHc98","$D2025-08-27T00:07:35.282Z"],["b_0rndl6o42vm","$D2025-08-27T00:11:07.719Z"],["b_QbTROLRGmy5","$D2025-08-27T00:16:34.240Z"],["b_dzr1ZYSqICK","$D2025-08-27T00:26:18.459Z"],["b_JvURXAcpbNS","$D2025-08-27T00:31:58.441Z"],["b_zmTt5g6xI1L","$D2025-08-27T00:35:06.737Z"],["b_ec9wqamiPlc","$D2025-08-27T01:01:07.696Z"],["b_b8EjgnvaGSM","$D2025-08-27T01:29:02.666Z"],["b_UvP0h7wtK6x","$D2025-08-27T01:34:45.161Z"],["b_6xX7oreW8z7","$D2025-08-27T01:35:20.146Z"],["b_vZ2VKu6rZWv","$D2025-08-27T02:06:50.867Z"],["b_eTkCA2oL10P","$D2025-08-27T02:07:29.890Z"],["b_WHYRKR6msXD","$D2025-08-27T02:08:37.892Z"],["b_m1htK4Yn5sa","$D2025-08-27T02:09:21.003Z"],["b_t5TTVbPoxFI","$D2025-08-27T02:09:46.923Z"],["b_uirNwKscRlz","$D2025-08-27T02:16:43.206Z"],["b_deZN6LBu4xo","$D2025-08-27T02:19:42.186Z"],["b_ro9Sia5xLws","$D2025-08-27T02:21:13.406Z"],["b_RFBkWEZznbB","$D2025-08-27T02:24:00.646Z"],["b_1ynOwruXnkX","$D2025-08-27T02:29:04.118Z"],["b_bSsiOEVqbPw","$D2025-08-27T02:33:30.642Z"],["b_wCPW61dmI2R","$D2025-08-27T02:35:36.410Z"],["b_VFBljzV49n1","$D2025-08-27T02:46:52.506Z"],["b_67zxp5BJCWS","$D2025-08-27T02:48:32.467Z"],["b_qxhZAYDFHK8","$D2025-08-27T02:49:49.062Z"],["b_xsfcWdmhbPD","$D2025-08-27T02:52:28.347Z"],["b_SZsrH7Hns7c","$D2025-08-27T03:12:29.532Z"],["b_yECVr9R6caR","$D2025-08-27T03:18:05.074Z"],["b_N9Y3dPbdIbf","$D2025-08-27T03:24:58.982Z"],["b_fd9fAr24aCv","$D2025-08-27T03:29:33.949Z"],["b_EbqYcco2A1B","$D2025-08-27T03:35:42.673Z"],["b_ilP027Cx0uI","$D2025-08-29T00:56:17.058Z"],["b_sZ0hUxbfet5","$D2025-08-29T05:10:07.035Z"],["b_cflLL68fHJE","$D2025-08-29T05:11:54.359Z"],["b_bCtAHqhntIE","$D2025-08-29T05:38:05.943Z"],["b_Q546JkWCMM7","$D2025-09-08T02:32:58.839Z"],["b_pA5C7ji8KW1","$D2025-09-08T02:37:49.378Z"],["b_nr7G6GTctDQ","$D2025-09-08T02:47:13.953Z"],["b_KLAWAqqKodO","$D2025-09-08T02:49:43.435Z"],["b_Ph4QCgckW2Q","$D2025-10-06T22:00:05.333Z"],["b_i4Ld73ZBrTZ","$D2025-10-06T22:00:31.770Z"],["b_gd7zpFSwy2d","$D2026-05-22T02:54:24.178Z"],["b_YCCCQUHQuTE","$D2026-05-22T03:04:39.378Z"],["b_uqdV2JRYjF6","$D2026-05-22T03:04:46.701Z"],["b_PE6liYsWK7N","$D2026-05-22T03:04:53.788Z"],["b_DQCTTmbi9gB","$D2026-05-22T03:05:00.830Z"],["b_qkVRCHwgz5I","$D2026-05-22T03:23:13.638Z"],["b_r2ys6ljz9hE","$D2026-05-22T03:23:40.144Z"],["b_NGnptJgu5ev","$D2026-05-22T03:44:10.806Z"],["b_CJb7QynN6hR","$D2026-05-22T13:55:00.626Z"],["b_kGoEqjMdfg8","$D2026-05-22T13:55:10.830Z"],["b_rxWoTUcKj8A","$D2026-05-22T13:55:17.442Z"],["b_ehwA770GuYe","$D2026-05-22T13:55:27.426Z"],["b_Gl9XQqYg1l1","$D2026-05-22T13:55:49.940Z"],["b_ypVdXp4fRBT","$D2026-05-22T14:23:34.264Z"],["b_qpvhGuZI7qx","$D2026-05-22T14:24:02.157Z"],["b_35tKRpMdmAB","$D2026-05-22T14:24:24.173Z"],["b_p1x6AV2TtEf","$D2026-05-22T14:29:30.779Z"],["b_YiFrqRedxkD","$D2026-05-22T14:29:46.701Z"]] 90:[["b_ypVdXp4fRBT",false],["b_qpvhGuZI7qx",false],["b_35tKRpMdmAB",false],["b_p1x6AV2TtEf",false],["b_YiFrqRedxkD",false]] 91:[["b_ypVdXp4fRBT","$undefined"],["b_qpvhGuZI7qx","$undefined"],["b_35tKRpMdmAB","$undefined"],["b_p1x6AV2TtEf","$undefined"],["b_YiFrqRedxkD",{"git":{"ref":"main","sha":"005028e950d84bfb556032eb71dda1d3e4c89c6e","type":"github","repoId":0,"repoName":"v0-kelly-resume-website","ownerName":"kreddington41","commitMessage":"Initialized repository for chat Resume website makeover"},"deploymentId":"dpl_4GMNkdsJBGM9ZY1ecp88BekWH8CY","showV0Button":true}]] 92:[["b_ypVdXp4fRBT",null],["b_qpvhGuZI7qx",null],["b_35tKRpMdmAB",null],["b_p1x6AV2TtEf",null],["b_YiFrqRedxkD",null]] 93:[["b_ypVdXp4fRBT",true],["b_qpvhGuZI7qx",true],["b_35tKRpMdmAB",true],["b_p1x6AV2TtEf",true],["b_YiFrqRedxkD",true]] 94:[["b_ypVdXp4fRBT",true],["b_qpvhGuZI7qx",true],["b_35tKRpMdmAB",true],["b_p1x6AV2TtEf",true],["b_YiFrqRedxkD",true]] 95:[] 96:T5bf,The user wants me to replace the PDF slideshow in the "Institutional Product Marketing" section with an image-based slideshow using the format from the DataVIS Initiative section. Let me describe the images: 1. **OTC Options Primer** - A long educational document explaining OTC options, what they are, types of options, pricing, how to trade with Kraken, and various option strategies with charts. 2. **Kraken Prime for Hedge Funds** - A comprehensive product page covering qualified custody, execution & OTC liquidity, capital efficiency, regulated derivatives & hedging, staking & yield, unified crypto infrastructure for hedge funds, and Kraken stats. 3. **OFFICIAL TRUMP Token Infrastructure** - A product 1-pager covering qualified custody, OTC execution, the TRUMP token as collateral, partnership integrations, and broader strategic opportunities for the token ecosystem. 4. **Kraken Prime for Venture Capitalists** - Similar to hedge funds page but focused on VCs - token custody & vesting, execution & OTC liquidity, LP reporting & governance, staking/yield/financing, and unified crypto infrastructure for VC funds. 5. **BTC Covered Calls** - A strategy spotlight document explaining covered call strategies for BTC holders, including strategy overview, why Kraken VIP, and steady premium capture performance metrics. Now I need to update the Kraken Institutional component to use an image-based slideshow like DataVIS Initiative, using these image URLs.97:T35ecb,[V0_FILE]png:file="public/images/usdw-analysis.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/screenshot%20USDW%20WTUSD%20resize-oWiE3moj5LRDktnnTyGg4m3OtCdslZ.png" isMerged="true" [V0_FILE]typescriptreact:file="components/innovation-showcase.tsx" isMerged="true" "use client" import { Brain, Smartphone, Globe } from "lucide-react" export function InnovationShowcase() { const projects = [ { category: "AI & Automation", icon: , projects: [ { title: "AI Executive Avatars", description: "Designed workflows to transform executives into animated avatars that recite blog posts interactively", executives: ["Will Peck", "Jason Guthrie", "Jeremy Siegel"], tech: ["AI Workflows", "Digital Clones", "Interactive Content"], }, { title: "AI Accessibility Integration", description: "Spearheaded Murph.AI adoption for WCAG-compliant voice narration of blog posts", impact: "Enhanced accessibility and engagement", tech: ["Murph.AI", "WCAG Compliance", "Voice Generation"], }, { title: "Generative AI Marketing", description: "Utilized Google Veo3 to produce brand-consistent imagery and animations", tech: ["Google Veo3", "Brand Consistency", "Campaign Assets"], }, ], }, { category: "Growth & App Marketing", icon: , projects: [ { title: "App Store Optimization", description: "Managed listings across Apple App Store and Google Play with custom landing pages", impact: "Drove organic downloads through keyword optimization and A/B testing", tech: ["ASO", "Keyword Targeting", "A/B Testing"], }, { title: "WisdomTree Prime Copywriting", description: "Wrote crypto-native copy establishing flagship app's authoritative voice", scope: ["Homepage", "About Page", "Brand Voice Guidelines"], }, ], }, { category: "Web3 & Onchain Innovation", icon: , projects: [ { title: "DataVIS Project", description: "Developed structured onchain identity for seamless Web3 integration", platforms: ["Dune", "Nansen", "Developer Platforms"], impact: "Amplified brand visibility across Web3 ecosystems", }, { title: "Onchain Transparency", description: "Standardized token metadata to make products discoverable and trusted", focus: ["Token Metadata", "Verification", "Discoverability"], }, ], }, ] return (
Innovation in Action

Leading-edge AI, automation, and Web3 projects that drive real business impact
{projects.map((category, categoryIndex) => (
{category.icon}
{category.category}

{category.projects.map((project, projectIndex) => (
{project.title}

{project.description}
{project.tech && (
{project.tech.map((tech, techIndex) => ( {tech} ))}
)} {project.impact &&
Impact: {project.impact}
}
))}
) } [V0_FILE]typescriptreact:file="components/about.tsx" isEdit="true" isQuickEdit="true" isMerged="true" export function About() { return (
About Me

I like the interesting.

The outcasts.
The left-of-centers.
The loners.
The rejects.
The left-curvers.
The right-curvers.
The outsiders.
The eccentric.
The peculiar.
The ADHDers.
The autists.
The broken.
The lonely.
The neurodivergent.
The free thinkers.
The traumatized.
The lost and forgotten.
They think beyond conventional boundaries because they exist outside them. As keen observers, they step back to absorb everything, only to later reemerge with simplified solutions to the complex and answers to the seemingly unsolvable.
The misunderstood create the unforgettable.

What I Do

I'm an expert Product, Social Media, and Content marketer passionate about crypto and AI.
I leverage analytics, thought leadership, and viral content to build brands and drive adoption. My expertise spans GTM strategy, storytelling, and AI-driven marketing across fintech, crypto, and emerging technologies.
Key Achievements

6x industry benchmark engagement rate on LinkedIn and X
Supported startups in raising $40M+ in funding
1 of 48 selected from 1200+ applicants for Buildspace's Nights and Weekends program
Led AI tool research and custom GPT development
Crypto Native Credentials

• Solidity: Zero to Expert certification
• Meme connoisseur & crypto culture expert
• Buildspace alumni (48/1200+ selected)
• Deep Web3 ecosystem knowledge
) } [V0_FILE]png:file="public/images/wisdomtree-crypto-native.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/screencapture-wisdomtreeprime-m02-project-qa-2025-08-01-11_37_23-sXdc4koXNHM6tIXr5DKYZi6afbxbiO.png" isMerged="true" [V0_FILE]png:file="public/images/wisdomtree-original.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/screencapture-wisdomtreeprime-2025-07-31-21_56_03.png-iJ2qkw2tUJqEF57AaD56SA14URiLO4.jpeg" isMerged="true" [V0_FILE]typescriptreact:file="components/experience.tsx" isEdit="true" isMerged="true" import { Building2, Calendar, MapPin } from "lucide-react" export function Experience() { const experiences = [ { title: "Associate, Marketing", company: "WisdomTree Asset Management", location: "New York", period: "Current Position", type: "Current", sections: [ { title: "Brand & Strategy", highlights: [ "Built and scaled WisdomTree Prime's social media strategy, positioning the app to capture both crypto-native and mainstream audiences, driving adoption through multi-channel campaigns", "Created and aligned brand messaging across Twitter/X, LinkedIn, YouTube, email, website, in-app, and TV ads, optimizing for engagement and downloads", "Established the onchain brand voice, writing foundational crypto-native copy (Homepage, About page, etc) that anchored the app's positioning in a competitive crypto app market", "Owned executive social media accounts and strategy, working directly with senior leaders (CEO, CLO, Head of Digital Assets, Head of BizDev, Product, Strategy) to craft compelling thought leadership content", "Worked cross-functionally across product, compliance, legal, design, UX/UI, PR, and Investor Relations teams to ensure marketing content met regulatory & compliance standards (FINRA, SEC)", "Implemented WCAG standards for Website & Content Accessibility, ensuring compliance and successfully protecting the brand against litigation risks", "Conceptualized and launched the DataVIS initiative to standardize WisdomTree's onchain identity, ensuring seamless integration with leading analytics platforms (Dune, Nansen, Messari, RWA.xyz, etc.)", ], }, { title: "App Store Listings", highlights: [ "Created and managed App Store listings on both Apple App Store Connect and Google Play Console, including custom product landing pages, localized creative assets, and keyword optimization", "Drove significant app growth through App Store Optimization (ASO), increasing organic downloads through optimized descriptions, A/B-tested images, and metadata improvements", "Designed & launched custom promotional store listings tailored for campaigns and audiences", ], }, { title: "Artificial Intelligence & Innovation", highlights: [ "Pioneered the use of AI avatars for executive thought leadership, developing digital clones of senior leaders (Will Peck, Jason Guthrie, Jeremy Siegel) to deliver interactive blog content and pilot chatbot-driven engagement", "Integrated Murf.ai into the blog publishing workflow for WCAG-compliant, AI-generated narration, improving accessibility and engagement", "Directed AI adoption across marketing operations, leading the AI Committee in researching and deploying tools and workflows such as customGPTs to accelerate content generation", "Leveraged Google Veo3, Lumen5, Midjourney, and other generative AI tools to create branded imagery, animations, and video assets", ], }, { title: "Content & Product Marketing", highlights: [ "Growth hacked Crypto Clarified podcast, doubling subscriber growth rate", "Identified and recruited podcast guests from companies such as Circle, CoinFund, Fractal, and more", "Authored and ghostwrote blog posts and research white papers on crypto, tokenization, and Digital Assets", "Created Tokenization 101 Lead Anchor document for WisdomTree Tokenization Projects targeting RIA's, Crypto-native startups, DAO treasuries, hedge funds, and family offices", "Achieved 6x industry benchmark engagement rates by curating viral social content, influencer collabs, & brand campaigns", ], }, ], }, { title: "Fractional CMO/Growth & Strategy Consultant", company: "Reddeq", location: "Remote", period: "Past", type: "Consulting", highlights: [ "Advised Angel, Seed, and Series-A Founders on go-to-market (GTM) strategy, product positioning, and messaging, driving market adoption for startups across fintech, crypto, AI and deep tech", "Developed high-impact investor and customer-facing materials, including landing pages, pitch decks, brand stories, blog posts, email campaigns, and personas to enhance fundraising and market fit", "Conducted market research & competitive analysis, identifying key trends and best practices to position startups effectively", "Supported startups in raising $40M+ in funding", "Collaborated with incubators, accelerators, launchpads, and investment groups (Angel Syndicates, HNWIs, Family Offices) to secure early-stage funding and strategic partnerships", "Advised on GTM strategy and product marketing for multiple high-growth startups, including ACV Auctions - Virtual Lift and Graphene Devices - Next-gen battery tech", "Developed crypto market insights & investment theses, analyzing onchain data, social sentiment, and macro trends across Bitcoin, Ethereum, Solana, Fantom (now Sonic), Avalanche, Near, Cosmos, and other blockchain ecosystems", "Advised startups in the StartupNY, LaunchNY, and Z80 Labs (Techstars affiliate) ecosystems, refining growth strategies, branding, and customer acquisition through storytelling and data-driven insights", ], }, ] return (
Professional Experience

{experiences.map((exp, index) => (
{exp.title}

{exp.company}
{exp.location}
{exp.period}
{exp.type}
{/* Sections for detailed breakdown */} {exp.sections ? (
{exp.sections.map((section, sectionIndex) => (
{section.title}

{section.highlights.map((highlight, idx) => (
{highlight}
))}
) : (
{exp.highlights?.map((highlight, idx) => (
{highlight}
))}
)}
))}
) } [V0_FILE]plaintext:file="public/resume/kelly-reddington-resume.pdf" query="Professional resume for Kelly Reddington showing marketing strategist experience at WisdomTree and consulting work, with sections for experience, skills, certifications and education in clean professional format" isMerged="true" [V0_FILE]png:file="public/images/usdw-complete-analysis.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/screenshot%20USDW%20WTUSD%20resize-jk0EjhLpbiZjfPeN5TCQkgugR7t9b2.png" isMerged="true" [V0_FILE]png:file="public/images/crdt-epic-analysis.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/CRDT%20and%20EPIC%20branding-iEeN0wiLxLl698LvJ64KRAvB6r2nUU.png" isMerged="true" [V0_FILE]png:file="public/images/datavis-proposal.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/DataVis%201-fbDMTEUqnpVus91UeCk0PcusJAZ7aC.png" isMerged="true" [V0_FILE]png:file="public/images/datavis-update.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/DataVIS%202-I8oBdPBPQHB4R5pLyuAWk60WfS4Kah.png" isMerged="true" [V0_FILE]png:file="public/images/aso-screenshots-1.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-5rc3AG2e5LilXLVp3gJNFk8NZIxql9.png" isMerged="true" [V0_FILE]png:file="public/images/aso-screenshots-2.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-PyJFiqsKNxV21JP1KaVawdnZINvyOe.png" isMerged="true" [V0_FILE]typescriptreact:file="app/page.tsx" isMerged="true" import { Hero } from "@/components/hero" import { Skills } from "@/components/skills" import { KrakenInstitutional } from "@/components/kraken-institutional" import { DataVISShowcase } from "@/components/datavis-showcase" import { ASOShowcase } from "@/components/aso-showcase" import { CryptoCopywriting } from "@/components/crypto-copywriting" import { CaseStudy } from "@/components/case-study" import { GeoStrategy } from "@/components/geo-strategy" import { Portfolio } from "@/components/portfolio" import { MemeShowcase } from "@/components/meme-showcase" import { WorkSamples } from "@/components/work-samples" import { Certifications } from "@/components/certifications" import { ResumeViewer } from "@/components/resume-viewer" import { Contact } from "@/components/contact" import { Navigation } from "@/components/navigation" export default function Home() { return (
) } [V0_FILE]typescriptreact:file="app/globals.css" isEdit="true" isQuickEdit="true" isMerged="true" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); :root { --background: oklch(1 0 0); --foreground: oklch(0.145 0 0); --card: oklch(1 0 0); --card-foreground: oklch(0.145 0 0); --popover: oklch(1 0 0); --popover-foreground: oklch(0.145 0 0); --primary: oklch(0.205 0 0); --primary-foreground: oklch(0.985 0 0); --secondary: oklch(0.97 0 0); --secondary-foreground: oklch(0.205 0 0); --muted: oklch(0.97 0 0); --muted-foreground: oklch(0.556 0 0); --accent: oklch(0.97 0 0); --accent-foreground: oklch(0.205 0 0); --destructive: oklch(0.577 0.245 27.325); --destructive-foreground: oklch(0.577 0.245 27.325); --border: oklch(0.922 0 0); --input: oklch(0.922 0 0); --ring: oklch(0.708 0 0); --chart-1: oklch(0.646 0.222 41.116); --chart-2: oklch(0.6 0.118 184.704); --chart-3: oklch(0.398 0.07 227.392); --chart-4: oklch(0.828 0.189 84.429); --chart-5: oklch(0.769 0.188 70.08); --radius: 0.625rem; --sidebar: oklch(0.985 0 0); --sidebar-foreground: oklch(0.145 0 0); --sidebar-primary: oklch(0.205 0 0); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.97 0 0); --sidebar-accent-foreground: oklch(0.205 0 0); --sidebar-border: oklch(0.922 0 0); --sidebar-ring: oklch(0.708 0 0); } .dark { --background: oklch(0.145 0 0); --foreground: oklch(0.985 0 0); --card: oklch(0.145 0 0); --card-foreground: oklch(0.985 0 0); --popover: oklch(0.145 0 0); --popover-foreground: oklch(0.985 0 0); --primary: oklch(0.985 0 0); --primary-foreground: oklch(0.205 0 0); --secondary: oklch(0.269 0 0); --secondary-foreground: oklch(0.985 0 0); --muted: oklch(0.269 0 0); --muted-foreground: oklch(0.708 0 0); --accent: oklch(0.269 0 0); --accent-foreground: oklch(0.985 0 0); --destructive: oklch(0.396 0.141 25.723); --destructive-foreground: oklch(0.637 0.237 25.331); --border: oklch(0.269 0 0); --input: oklch(0.269 0 0); --ring: oklch(0.439 0 0); --chart-1: oklch(0.488 0.243 264.376); --chart-2: oklch(0.696 0.17 162.48); --chart-3: oklch(0.769 0.188 70.08); --chart-4: oklch(0.627 0.265 303.9); --chart-5: oklch(0.645 0.246 16.439); --sidebar: oklch(0.205 0 0); --sidebar-foreground: oklch(0.985 0 0); --sidebar-primary: oklch(0.488 0.243 264.376); --sidebar-primary-foreground: oklch(0.985 0 0); --sidebar-accent: oklch(0.269 0 0); --sidebar-accent-foreground: oklch(0.985 0 0); --sidebar-border: oklch(0.269 0 0); --sidebar-ring: oklch(0.439 0 0); } @theme inline { --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); } @layer base { * { @apply border-border outline-ring/50; } body { @apply bg-background text-foreground; } } /* Custom animations */ @keyframes fade-in { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in { animation: fade-in 1s ease-out; } /* Smooth scrolling */ html { scroll-behavior: smooth; } /* Custom scrollbar */ ::-webkit-scrollbar { width: 8px; } ::-webkit-scrollbar-track { background: #000; } ::-webkit-scrollbar-thumb { background: linear-gradient(to bottom, #ef4444, #dc2626); border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: linear-gradient(to bottom, #dc2626, #b91c1c); } /* Glass morphism effect */ .glass { background: rgba(255, 255, 255, 0.05); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.1); } /* Fix for descender cutoff in section titles */ .section-title { line-height: 1.2; padding-bottom: 0.5rem; margin-bottom: 1rem; } /* Ensure underline dividers have proper spacing */ .underline-divider { margin-top: 1.5rem !important; } [V0_FILE]typescriptreact:file="components/datavis-showcase.tsx" isEdit="true" isQuickEdit="true" isMerged="true" "use client" import { useState, useEffect } from "react" import { ChevronLeft, ChevronRight, Database, Globe, Zap, Users, Settings, TrendingUp, Code, Maximize2, X, } from "lucide-react" import { Button } from "@/components/ui/button" export function DataVISShowcase() { const [currentSlide, setCurrentSlide] = useState(0) const [isFullscreen, setIsFullscreen] = useState(false) const [fullscreenImage, setFullscreenImage] = useState("") // Prevent body scroll when fullscreen is open useEffect(() => { if (isFullscreen) { document.body.style.overflow = "hidden" } else { document.body.style.overflow = "unset" } // Cleanup on unmount return () => { document.body.style.overflow = "unset" } }, [isFullscreen]) const slides = [ { id: 0, title: "DataVIS Initiative: Strategic Overview", subtitle: "Bringing Visibility, Identity & Structure to WisdomTree's Onchain Presence", icon: , content: (
The Strategic Challenge

In Web3, fragmented data across platforms creates friction for developers, partners, and institutional adoption. WisdomTree needed a unified onchain presence that builds trust and simplifies integration.
Visibility
Discoverable on analytics platforms
Identity
Consistent brand across chains
Structure
Centralized source of truth
Why This Matters

"In crypto, transparency and easy access to docs, contract address info, and APIs builds trust and creates a more uniform brand experience onchain."
), }, { id: 1, title: "The Onchain Product Kit Strategy", subtitle: "Solving Developer & Partner Friction Points", icon: , content: (
The Central Hub Concept

A dedicated onchain product kit that serves as the single source of truth for all WisdomTree onchain products, accessible at wisdomtreeprime.com/onchainkit or onchainkit.wisdomtreeprime.com
Use Case: Dashboard Integration

"A dashboard like RWA.xyz or stabledash wants to list our products?"
Solution: One URL with all contract addresses, tickers, logo links, and relevant information.
Use Case: Data Partners

"A data partner like Nansen or CoinMetrics asks to pull NAV or AUM data?"
Solution: Convenient link explaining indexing logic and API access.
Use Case: Developer Tools

"Zapper or DefiLlama wants to display our logos for tokens?"
Solution: Pre-formatted, brand consistent downloadable assets.
), }, { id: 2, title: "Competitive Analysis & Market Position", subtitle: "Learning from Crypto Leaders", icon: , content: (
Industry Best Practices

"Others in the space have it, and if we want to make things simple and straightforward for people to include our products in their products, this is the way to go."
Leading Examples

• Coinbase/Base: Comprehensive OnchainKit API docs
• Ondo: Centralized address documentation
• Superstate: Smart contract introductions
• Securitize: Postman API documentation
WisdomTree Advantage

• Traditional finance credibility
• Multi-chain product suite
• Institutional-grade compliance
• Developer-friendly approach
Strategic Positioning

"Another way to reinforce the idea that WisdomTree is easy to work with and has an onchain presence that is a cut above the competition."
), }, { id: 3, title: "Technical Architecture & Components", subtitle: "Building the Onchain Product Kit", icon:
,
      content: (
        
          
            Core Components
            
              A comprehensive developer resource targeting data platforms, block explorers, and developers who prefer
              self-serve documentation.
            
          

          
            
              🏷️ Official Token Information
              
                • Token names and tickers
                • Contract addresses with chain breakdown (Ethereum, Base, Arbitrum)
                • OpenZeppelin audit highlights
                • Explorer links and verified contracts
              
            

            
              🎨 Logos & Metadata
              
                • PNG logos for dashboards and wallet experiences
                • TrustWallet and CoinGecko asset repository links
                • Wallet labeling standards
                • .eth and onchain identity naming conventions
              
            

            
              🔌 APIs & Data Access
              
                • Public-facing, read-only API documentation
                • Static JSON files for daily data pulls
                • Integration with existing digital funds API
                • Contact form for integration requests
              
            
          
        
      ),
    },
    {
      id: 4,
      title: "3-Phase Implementation Strategy",
      subtitle: "Discovery → Integration → Maintenance",
      icon: ,
      content: (
        
          
            Strategic Rollout Plan
            "Developed a Three step process for us to kickstart this initiative."
          

          
            
              
                
                Phase 1: Discovery Phase ✅
              
              
                • Platform inventory and analysis
                • Contract address compilation
                • Technical requirements scoping
                • Competitive benchmarking
              
            

            
              
                
                Phase 2: Platform Outreach & Integration 🔄
              
              
                • Direct platform partnerships
                • API integrations and testing
                • Brand asset distribution
                • Developer documentation deployment
              
            

            
              
                
                Phase 3: Maintenance 📋
              
              
                • Ongoing platform relationship management
                • Data accuracy monitoring
                • New integration requests
                • Performance analytics and optimization
              
            
          
        
      ),
    },
    {
      id: 5,
      title: "Partnership & Integration Impact",
      subtitle: "Building the WisdomTree Ecosystem",
      icon: ,
      content: (
        
          
            Target Partnership Ecosystem
            
              Strategic integrations across analytics platforms, developer tools, and institutional infrastructure.
            
          

          
            
              
                Analytics Platforms
                
                  • RWA.xyz - RWA dashboard integration
                  • Nansen - Institutional analytics
                  • CoinMetrics - Data partnership
                  • Messari - Research Report Integration
                
              

              
                Developer Tools
                
                  • Zapper - Portfolio tracking
                  • DefiLlama - TVL aggregation
                  • Dune Analytics - Custom dashboards
                  • Block explorers (Etherscan, BaseScan, etc.)
                
              
            

            
              
                Chain Ecosystems
                
                  • Base - L2 RWA exploration
                  • Ethereum - Primary deployment
                  • Stellar - RWA expansion
                  • Cross-chain visibility
                
              

              
                Use Case Example
                
                  "A Base Dev exploring RWAs for his Dune dashboard can access all of our contract addresses in one
                  convenient, centralized location."
                
              
            
          

          
            Strategic Outcome
            
              Improved institutional visibility, streamlined partner integrations, and reinforced positioning as the
              easiest traditional finance company to work with in Web3.
            
          
        
      ),
    },
    {
      id: 6,
      title: "Innovation: AI-Powered Developer Experience",
      subtitle: "Next-Generation Developer Relations",
      icon: ,
      content: (
        
          
            ChatGPT Plugin/Embedded Assistant
            
              "Embed an assistant trained on our dev docs and contracts. Inspired by the Fantom and Base Builder
              Assistants."
            
          

          
            
              Inspiration Examples
              
                
                  • Build on Base Assistant: Solidity expert for Base ecosystem
                
                
                  • Fantom GPT: Comprehensive protocol assistant
                
                
                  • Developer-focused AI: Instant technical support
                
              
            

            
              WisdomTree AI Features
              
                • Trained on WisdomTree dev docs
                • Contract interaction guidance
                • API usage examples
                • Integration troubleshooting
              
            
          

          
            Developer Experience Vision
            
              
                24/7 Support: Instant answers to technical questions
              
              
                Self-Service: Reduced support ticket volume
              
              
                Onboarding: Faster developer integration
              
              
                Innovation: Cutting-edge developer relations
              
            
          

          
            Strategic Innovation
            
              Positioning WisdomTree at the forefront of Web3 developer experience with AI-powered support and
              documentation.
            
          
        
      ),
    },
    {
      id: 7,
      title: "Original DataVIS Proposal Document",
      subtitle: "Complete Strategic Initiative Email",
      icon: ,
      content: (
        
          
            Original Strategic Proposal Email
            
              The complete email proposal that outlined the DataVIS initiative, including competitive analysis,
              technical requirements, and implementation strategy.
            
          

          
            
               openFullscreen("/images/datavis-proposal.png")}
              >
                

                {/* Expand overlay */}
                
                  
                    
                  
                
              
            

            
              Click image to expand to full screen
              
                Scroll within the image above to view the complete document
              
            
          
        
      ),
    },
    {
      id: 8,
      title: "DataVIS Initiative Update Document",
      subtitle: "Progress Report & Strategic Framework",
      icon: ,
      content: (
        
          
            Initiative Progress Update
            
              Follow-up communication showing the refined DataVIS framework (Visibility, Identity, Structure) and
              current implementation status across the three-phase rollout.
            
          

          
            
               openFullscreen("/images/datavis-update.png")}
              >
                

                {/* Expand overlay */}
                
                  
                    
                  
                
              
            

            
              Click image to expand to full screen
              
                Scroll within the image above to view the complete document
              
            
          
        
      ),
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  const openFullscreen = (image: string) => {
    setFullscreenImage(image)
    setIsFullscreen(true)
  }

  const closeFullscreen = () => {
    setIsFullscreen(false)
    setFullscreenImage("")
  }

  return (
    <>
      
        
          
            
              DataVIS Initiative
            
            
            
              Strategic initiative to bring Visibility, Identity, and Structure to WisdomTree's onchain data presence
            
          

          
            
              {/* Slide Header */}
              
                
                  {slides[currentSlide].icon}
                  
                    {slides[currentSlide].title}
                    {slides[currentSlide].subtitle}
                  
                
              

              {/* Slide Content */}
              {slides[currentSlide].content}

              {/* Navigation */}
              
                
                  

                  {/* Slide Indicators */}
                  
                    {slides.map((_, index) => (
                      

                  
                

                
                  Slide {currentSlide + 1} of {slides.length}
                
              
            
          
        
      

      {/* Fullscreen Modal */}
      {isFullscreen && (
        
          
            

             {
                // Prevent event from bubbling up to prevent background scroll
                e.stopPropagation()
              }}
            >
              
            
          
        
      )}
    
  )
}
[V0_FILE]typescriptreact:file="components/aso-showcase.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState, useEffect } from "react"
import {
  ChevronLeft,
  ChevronRight,
  Smartphone,
  TrendingUp,
  Target,
  Search,
  BarChart3,
  Zap,
  FileText,
  Maximize2,
  X,
  ExternalLink,
} from "lucide-react"
import { Button } from "@/components/ui/button"

export function ASOShowcase() {
  const [currentSlide, setCurrentSlide] = useState(0)
  const [isFullscreen, setIsFullscreen] = useState(false)
  const [fullscreenImage, setFullscreenImage] = useState("")

  // Prevent body scroll when fullscreen is open
  useEffect(() => {
    if (isFullscreen) {
      document.body.style.overflow = "hidden"
    } else {
      document.body.style.overflow = "unset"
    }

    // Cleanup on unmount
    return () => {
      document.body.style.overflow = "unset"
    }
  }, [isFullscreen])

  const slides = [
    {
      id: 0,
      title: "App Store Optimization Strategy",
      subtitle: "Driving Organic Growth Through Strategic ASO",
      icon: ,
      content: (
        
          
            WisdomTree Prime App Store
            
              Led comprehensive App Store Optimization strategy across Apple App Store and Google Play, driving
              significant organic growth through data-driven keyword optimization and strategic positioning.
            
            
              Managed complete app store presence including custom promotional campaigns, localized listings, and
              cross-functional collaboration with Design, Product, Legal, and Compliance to ensure regulatory compliance
              while maximizing discoverability.
            

            {/* App Store Links */}
            
              
                View on App Store
                
              
              
                View on Google Play
                
              
            
          

          {/* App Store Screenshots Grid */}
          
            
              Featured App Store Creative Assets
              
                
                    openFullscreen(
                      "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-qIpcIRFnljbiXBdLmcFFZECC2y1I0B.png",
                    )
                  }
                >
                  
                  {/* Expand overlay */}
                  
                    
                      
                    
                  
                
                
                    openFullscreen(
                      "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-7Iu85APeD1QWR8Rc4WhookCKMtpgvm.png",
                    )
                  }
                >
                  
                  {/* Expand overlay */}
                  
                    
                      
                    
                  
                
              
              
                Click images to expand to full screen
                
                  Showing the evolution of app store creative assets from earlier campaigns to current messaging
                
              
            
          

          
            
              #1 Rankings
              Multiple target keywords
            
            
              Organic Growth
              Boosted downloads significantly
            
            
              Cross-Platform
              iOS & Android optimization
            
          
        
      ),
    },
    {
      id: 1,
      title: "Keyword Strategy & Research",
      subtitle: "Data-Driven Keyword Optimization",
      icon: ,
      content: (
        
          
            Strategic Keyword Research & Optimization
            
              Leveraged AppTweak and similar ASO tools for comprehensive competitor analysis, keyword discovery, and
              performance tracking to achieve #1 rankings for multiple target keywords.
            
          

          
            
              Research & Discovery
              
                • Competitor analysis using AppTweak
                • High-value keyword identification
                • Search volume & difficulty monitoring
                • Market trend analysis
                • Opportunity gap identification
              
            

            
              Implementation & Results
              
                • Achieved #1 rankings for target keywords
                • Continuous refinement over time
                • Performance tracking & iteration
                • Keyword ranking improvements
                • Organic download growth
              
            
          

          
            Key Focus Areas
            
              
                Crypto & DeFi Keywords: Targeting crypto-native audience with relevant financial terms
              
              
                Traditional Finance: Bridging TradFi users to digital asset investing
              
              
                Gold Investment: Capturing precious metals investment searches
              
              
                Digital Payments: Visa debit card and spending functionality
              
            
          
        
      ),
    },
    {
      id: 2,
      title: "Metadata & Localization Optimization",
      subtitle: "Global Reach Through Strategic Optimization",
      icon: ,
      content: (
        
          
            Comprehensive Metadata Strategy
            
              Optimized app titles, subtitles, tags, and categories to maximize search visibility and alignment with app
              store algorithms while ensuring global reach through localization.
            
          

          
            
              Metadata Optimization
              
                
                  App Store Elements
                  
                    • App titles & subtitles
                    • Keyword tags optimization
                    • Category selection strategy
                    • Algorithm alignment
                  
                
                
                  Search Visibility
                  
                    • Maximum discoverability
                    • Relevant keyword placement
                    • Competitive positioning
                    • Performance monitoring
                  
                
              
            

            
              US Market Focus
              
                
                  US Market Optimization
                  
                    • US market optimization
                    • Domestic keyword targeting
                    • American audience preferences
                    • US regulatory compliance
                  
                
                
                  Conversion Optimization
                  
                    • Improved US conversions
                    • Enhanced domestic reach
                    • US market-specific messaging
                    • US regulatory compliance
                  
                
              
            
          

          
            Strategic Impact
            
              Comprehensive metadata and localization strategy resulted in improved search rankings, enhanced US market
              penetration, and increased organic downloads domestically.
            
          
        
      ),
    },
    {
      id: 3,
      title: "Visual Asset Optimization & A/B Testing",
      subtitle: "Data-Driven Creative Optimization",
      icon: ,
      content: (
        
          
            Creative Asset Strategy & Testing
            
              Designed and refined screenshots, icons, and feature graphics through systematic A/B testing to maximize
              click-throughs and installs while maintaining consistent branding across all channels.
            
          

          
            
              Visual Asset Optimization
              
                • Screenshot design & refinement
                • App icon optimization
                • Feature graphic creation
                • Consistent brand alignment
                • Cross-channel consistency
                • Click-through maximization
              
            

            
              A/B Testing Framework
              
                • Copy variations testing
                • Screenshot experiments
                • Icon performance analysis
                • Feature graphic optimization
                • Conversion rate tracking
                • Statistical significance validation
              
            
          

          
            Creative Asset Categories
            
              
                Gold Investment
                Onchain gold token features and pricing
              
              
                Crypto Features
                Bitcoin rewards and crypto functionality
              
              
                Financial Tools
                Dashboard, cross-chain, and Visa card
              
            
          

          
            Testing Results
            
              Systematic A/B testing of creative assets led to improved conversion rates, higher install rates, and
              better overall app store performance through data-driven optimization.
            
          
        
      ),
    },
    {
      id: 4,
      title: "Crypto-Native App Store Description",
      subtitle: "Regulatory-Compliant Copy Within Strict Length Restrictions",
      icon: ,
      content: (
        
          
            Strategic Copy Optimization
            
              Crafted crypto-native app store descriptions that clearly and concisely convey the app's features and
              functionality while adhering to strict regulatory guardrails and app store copy length restrictions.
            
            
              Balanced authentic Web3 terminology with FINRA/SEC compliance requirements, ensuring maximum
              discoverability without compromising regulatory standards or exceeding character limits.
            
          

          
            
              
                  openFullscreen(
                    "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/1000017568.jpg-fTzP0rlIl0P1Em9764qH6SvsjJLMZQ.jpeg",
                  )
                }
              >
                

                {/* Expand overlay */}
                
                  
                    
                  
                
              
            

            
              Click image to expand to full screen
              
                Scroll within the image above to view the complete app store description
              
            
          

          
            
              Regulatory
              FINRA/SEC compliant copy
            
            
              Crypto-Native
              Authentic Web3 terminology
            
            
              Optimized
              Maximum character efficiency
            
          
        
      ),
    },
    {
      id: 5,
      title: "Custom Promotional Campaigns",
      subtitle: "Targeted Campaign-Specific Listings",
      icon: ,
      content: (
        
          
            Campaign-Specific Store Optimization
            
              Created custom promotional store pages tailored for specific audiences and campaigns, integrating with
              broader marketing strategy across social media, email, and web for a unified user journey.
            
          

          
            
              Custom Promotional Features
              
                
                  Campaign Types
                  
                    • Bitcoin reward promotions
                    • Gold investment campaigns
                    • Visa debit card launches
                    • Cross-chain feature highlights
                  
                
                
                  Audience Targeting
                  
                    • Crypto-native users
                    • Traditional investors
                    • Gold investment enthusiasts
                    • Digital payment adopters
                  
                
              
            

            
              Cross-Functional Integration
              
                
                  Team Collaboration
                  
                    • Design team coordination
                    • Product team alignment
                    • Compliance team approval
                    • Marketing campaign integration
                  
                
                
                  Brand Standards
                  
                    • Regulatory compliance (FINRA, SEC)
                    • Brand consistency
                    • Legal review process
                    • Risk management
                  
                
              
            
          

          
            Unified Marketing Strategy
            
              Aligned app store content with campaigns across social media, email, and web to create a seamless user
              journey from discovery to download and activation.
            
          
        
      ),
    },
    {
      id: 6,
      title: "Performance Tracking & Results",
      subtitle: "Data-Driven Success Metrics",
      icon: ,
      content: (
        
          
            Measurable ASO Success
            
              Comprehensive performance tracking and iterative improvements resulted in significant organic growth,
              improved conversion rates, and elevated overall app visibility across both iOS and Android platforms.
            
          

          
            
              Key Performance Metrics
              
                • Keyword ranking improvements
                • Conversion rate optimization
                • Install lift analysis
                • Organic download growth
                • App visibility enhancement
                • User acquisition cost reduction
              
            

            
              Strategic Outcomes
              
                • #1 rankings for multiple target keywords
                • Boosted organic downloads significantly
                • Improved conversion rates
                • Enhanced brand visibility
                • Enhanced US market presence
                • Reduced customer acquisition costs
              
            
          

          
            
              Continuous Optimization Process
              
                
                  Monitor: Track keyword rankings, conversion rates, and competitor movements
                
                
                  Analyze: Identify optimization opportunities and performance gaps
                
                
                  Iterate: Implement improvements and measure impact
                
              
            

            
              Reputation Management
              
                
                  User Feedback: Prompt responses to reviews and ratings
                
                
                  Brand Protection: Proactive reputation management
                
                
                  Review Strategy: Encouraging positive user reviews
                
                
                  Issue Resolution: Quick response to user concerns
                
              
            
          

          
            Strategic Impact Summary
            
              The comprehensive ASO strategy delivered measurable results: achieved #1 keyword rankings, significantly
              boosted organic downloads, improved conversion rates, and established WisdomTree Prime as a leading
              fintech app in the digital asset space.
            

            {/* App Store Links in Results Section */}
            
              
                App Store
                
              
              
                Google Play
                
              
            
          
        
      ),
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  const openFullscreen = (image: string) => {
    setFullscreenImage(image)
    setIsFullscreen(true)
  }

  const closeFullscreen = () => {
    setIsFullscreen(false)
    setFullscreenImage("")
  }

  return (
    <>
      
        
          
            
              App Store Optimization
            
            
            
              Strategic ASO management for WisdomTree Prime across iOS and Android, driving organic growth through
              data-driven optimization and creative excellence
            
          

          
            
              {/* Slide Header */}
              
                
                  {slides[currentSlide].icon}
                  
                    {slides[currentSlide].title}
                    {slides[currentSlide].subtitle}
                  
                
              

              {/* Slide Content */}
              {slides[currentSlide].content}

              {/* Navigation */}
              
                
                  

                  {/* Slide Indicators */}
                  
                    {slides.map((_, index) => (
                      

                  
                

                
                  Slide {currentSlide + 1} of {slides.length}
                
              
            
          
        
      

      {/* Fullscreen Modal */}
      {isFullscreen && (
        
          
            

             {
                // Prevent event from bubbling up to prevent background scroll
                e.stopPropagation()
              }}
            >
              
            
          
        
      )}
    
  )
}
[V0_FILE]typescriptreact:file="components/crypto-copywriting.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState, useEffect } from "react"
import { ChevronLeft, ChevronRight, Maximize2, X, FileText } from "lucide-react"
import { Button } from "@/components/ui/button"

export function CryptoCopywriting() {
  const [currentSlide, setCurrentSlide] = useState(0)
  const [isFullscreen, setIsFullscreen] = useState(false)
  const [fullscreenImage, setFullscreenImage] = useState("")

  // Prevent body scroll when fullscreen is open
  useEffect(() => {
    if (isFullscreen) {
      document.body.style.overflow = "hidden"
    } else {
      document.body.style.overflow = "unset"
    }

    // Cleanup on unmount
    return () => {
      document.body.style.overflow = "unset"
    }
  }, [isFullscreen])

  const slides = [
    {
      id: 0,
      title: "Original WisdomTree Homepage",
      subtitle: "Traditional Fintech Messaging",
      description:
        "The original homepage used conventional financial services language with promotional offers and traditional marketing approaches that didn't authentically connect with crypto-native audiences.",
      image: "/images/wisdomtree-original.png",
      keyPoints: [
        "'The future of finance is here' - generic fintech messaging",
        "Promotional offers like 'Get $100 in Bitcoin!'",
        "Traditional financial services tone and design",
        "Corporate marketing approach with multiple CTAs",
      ],
    },
    {
      id: 1,
      title: "Crypto-Native Rewrite",
      subtitle: "Web3-Focused Messaging & Positioning",
      description:
        "My rewrite transformed the messaging to speak directly to crypto natives with authentic Web3 language and positioning.",
      image: "/images/wisdomtree-crypto-native.png",
      keyPoints: [
        "'Wisdom Is Your Edge' - powerful, direct messaging",
        "Onchain assets, composable, transparent language",
        "DeFi and Web3 terminology throughout",
        "Crypto-native value propositions",
      ],
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const openFullscreen = (image: string) => {
    setFullscreenImage(image)
    setIsFullscreen(true)
  }

  const closeFullscreen = () => {
    setIsFullscreen(false)
    setFullscreenImage("")
  }

  return (
    <>
      
        
          
            
              Crypto Native Copywriting
            
            
            
              Transforming traditional fintech messaging into authentic crypto-native language that resonates with Web3
              audiences
            
          

          
            
              {/* Slide Header */}
              
                
                  
                    
                  
                  
                    {slides[currentSlide].title}
                    {slides[currentSlide].subtitle}
                  
                  
                    {currentSlide + 1} of {slides.length}
                  
                
              

              {/* Slide Content */}
              
                
                  {/* Description & Key Points */}
                  
                    
                      Overview
                      {slides[currentSlide].description}
                    

                    
                      Key Elements
                      
                        {slides[currentSlide].keyPoints.map((point, index) => (
                          
                            
                            {point}
                          
                        ))}
                      
                    

                    {currentSlide === 1 && (
                      
                        Impact
                        
                          The crypto-native rewrite positioned WisdomTree Prime as a Web3-first platform, using
                          authentic terminology that crypto natives understand and trust. This approach bridges
                          traditional finance with DeFi, speaking to both audiences effectively.
                        
                      
                    )}
                  

                  {/* Scrollable Image */}
                  
                    
                       openFullscreen(slides[currentSlide].image)}
                      >
                        

                        {/* Expand overlay */}
                        
                          
                            
                          
                        
                      
                    

                    
                      Click image to expand to full screen
                      Scroll within the image above to view the complete page
                    
                  
                
              

              {/* Navigation */}
              
                
                  

                  {/* Slide Indicators */}
                  
                    {slides.map((_, index) => (
                      

                  
                
              
            

            {/* Comparison Summary */}
            
              Transformation Summary
              
                
                  Before: Traditional Fintech
                  
                    • Generic "better system" messaging
                    • Corporate financial services tone
                    • Limited crypto terminology
                    • Traditional value propositions
                  
                
                
                  After: Crypto-Native
                  
                    • Direct, powerful "Wisdom Is Your Edge"
                    • Authentic Web3 language throughout
                    • Onchain, composable, DeFi terminology
                    • Crypto-native value propositions
                  
                
              
            
          
        
      

      {/* Fullscreen Modal */}
      {isFullscreen && (
        
          
            

             {
                // Prevent event from bubbling up to prevent background scroll
                e.stopPropagation()
              }}
            >
              
            
          
        
      )}
    
  )
}
[V0_FILE]typescriptreact:file="components/case-study.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState, useEffect } from "react"
import { ChevronLeft, ChevronRight, Brain, Search, Target, Volume2, Maximize2, X } from "lucide-react"
import { Button } from "@/components/ui/button"

export function CaseStudy() {
  const [currentSlide, setCurrentSlide] = useState(0)
  const [isFullscreen, setIsFullscreen] = useState(false)
  const [fullscreenImage, setFullscreenImage] = useState("")

  // Prevent body scroll when fullscreen is open
  useEffect(() => {
    if (isFullscreen) {
      document.body.style.overflow = "hidden"
    } else {
      document.body.style.overflow = "unset"
    }

    // Cleanup on unmount
    return () => {
      document.body.style.overflow = "unset"
    }
  }, [isFullscreen])

  const slides = [
    {
      id: 0,
      title: "Strategic Ticker Branding Framework",
      subtitle: "Systematic Approach to Financial Product Naming",
      icon: ,
      content: (
        
          
            The Strategic Challenge
            
              Ticker symbols are more than just identifiers—they're the first impression, the mental anchor, and the
              trust signal for financial products. Every character matters.
            
            
              I developed a comprehensive framework combining psychology, linguistics, and market dynamics to optimize
              ticker selection across multiple WisdomTree products.
            
          

          
            
              USDW vs WTUSD
              Stablecoin Strategy
            
            
              CRDT vs CRDY
              Credit Product Positioning
            
            
              EPIC vs WEPI
              Equity Fund Branding
            
          

          
            My Analytical Framework
            
              • Market Alignment & Pattern Recognition
              • Cognitive Fluency & Processing Speed
              • Sound Symbolism & Emotional Resonance
              • Phonetic Intensity & Trust Signals
            
          
        
      ),
    },
    {
      id: 1,
      title: "USDW vs WTUSD: Stablecoin Strategy",
      subtitle: "Market Alignment & Trust Patterns",
      icon: ,
      content: (
        
          
            The USD Pattern Advantage
            
              Dominant stablecoin naming follows a clear convention that users trust and recognize instantly.
            
            
              {["USDC", "USDT", "USDG", "USD1"].map((ticker) => (
                
                  {ticker}
                
              ))}
            
          

          
            
              USDW Advantages
              
                • Chunked as "USD + W"
                • Vowel-led, familiar pattern
                • 6 syllables, easy flow
                • Instant category recognition
                • Groups with trusted stables
              
            

            
              WTUSD Challenges
              
                • Consonant cluster start
                • 7 syllables, harder parsing
                • Breaks expected pattern
                • Lower discoverability
                • Requires exact search
              
            
          

          
            Strategic Outcome
            
              Recommendation: USDW - Aligns with how humans think, speak, scan, and trust. Category
              clarity first, brand differentiation second.
            
          
        
      ),
    },
    {
      id: 2,
      title: "CRDT vs CRDY: Credit Product Analysis",
      subtitle: "Sound Symbolism & Institutional Trust",
      icon: ,
      content: (
        
          
            Market Alignment Analysis
            
              Both CRDT and CRDY are direct plays on "credit," but their sound, structure, and associations create
              different impressions that matter for institutional branding.
            
          

          
            
              CRDT: Sharp Authority
              
                • Hard "T" stop - clean, precise, assertive
                • Aligns with institutional naming trends
                • Firm mouth closure reinforces control
                • Sharp, clipped authority
                • Trust, fluency, professionalism
              
            

            
              CRDY: Softer Approach
              
                • Soft "Y" vowel glide - rounds off energy
                • Opens door to unwanted phonetic slippage
                • Softened ending creates negative homophone risk
                • Less emotional authority
                • Uncertainty, softness, lower recall
              
            
          

          
            Bouba/Kiki Effect Applied
            
              Research shows sharp sounds are associated with precision and power, while soft sounds suggest passivity
              and lower energy.
            
            
              
                CRDT: Sharp consonants, clear finish, hard stop
              
              
                CRDY: Angular sounds with soft ending
              
            
          
        
      ),
    },
    {
      id: 3,
      title: "EPIC vs WEPI: Equity Fund Positioning",
      subtitle: "Emotional Resonance & Narrative Fit",
      icon: ,
      content: (
        
          
            Emotional Resonance Analysis
            
              EPIC is powerful, high-fluency, and aspirational. It has brand narrative baked in: bold, memorable, and a
              natural shorthand for a product that aims to define advanced equity income.
            
          

          
            
              EPIC: Bold & Energetic
              
                • Strong lip pop with "P"
                • Open "EH" vowel (used in happy expressions)
                • Sharp "K" close that reinforces control
                • Energized articulation = energized perception
                • Clarity, recall, confidence
              
            

            
              WEPI: Soft & Forgettable
              
                • Rounded lips with "W" (like blowing or sighing)
                • Trailing "I" that drifts rather than lands
                • Doesn't land — it leaks
                • Rounded, soft-like shape = low emotional payoff
                • Low signal strength, weaker trust profile
              
            
          

          
            Neuroscience of Sound & Meaning
            
              Research shows high-energy phonemes like "P" and "K" stimulate dopaminergic reward centers in the brain,
              while soft sounds activate emotional associations of sadness or fragility.
            
            
              EPIC lights up reward circuits — it feels good to say
              
                WEPI has no such impact. Worse, it sounds like "weepy" — not ideal for fund marketing.
              
            
          
        
      ),
    },
    {
      id: 4,
      title: "Phonetic Intensity & Linguistic Trust",
      subtitle: "The Science Behind Sound Perception",
      icon: ,
      content: (
        
          
            Cross-Analysis Patterns
            
              Consistent patterns emerge across all three ticker analyses, validating the strategic framework.
            
          

          
            
              Phonetic Intensity Research
              
                Studies show that fluency directly influences risk perception, recall, and brand credibility. Names that
                are easier to pronounce are judged as more familiar, credible, and safe.
              
              
                
                  USDW
                  Tightly constructed, clear rhythm
                
                
                  CRDT
                  Sharp, precise, authoritative
                
                
                  EPIC
                  Bold, energetic, commanding
                
              
            

            
              Embodied Cognition Impact
              
                How we physically produce sounds affects how we emotionally interpret them. Firm mouth closures suggest
                control and precision, while open glides can suggest uncertainty.
              
              
                
                  Winning Patterns:
                  
• Sharp consonants and clear stops
                  
• Familiar phonetic structures
                  
• Strong articulatory gestures
                
                
                  Avoid:
                  
• Soft endings and vowel glides
                  
• Consonant clusters at start
                  
• Homophone risks
                
              
            
          
        
      ),
    },
    {
      id: 5,
      title: "USDW vs WTUSD: Complete Analysis Document",
      subtitle: "Full Strategic Breakdown & Email Communication",
      icon: ,
      content: (
        
          
            Original Strategic Analysis Email
            
              The complete email analysis that led to the USDW recommendation, including market alignment research,
              cognitive fluency theory, and comprehensive linguistic analysis.
            
          

          
            
               openFullscreen("/images/usdw-complete-analysis.png")}
              >
                

                {/* Expand overlay */}
                
                  
                    
                  
                
              
            

            
              Click image to expand to full screen
              
                Scroll within the image above to view the complete document
              
            
          
        
      ),
    },
    {
      id: 6,
      title: "CRDT vs CRDY and EPIC vs WEPI Analysis",
      subtitle: "Complete Strategic Breakdown & Email Communication",
      icon: ,
      content: (
        
          
            Original Strategic Analysis Email
            
              The complete email analysis covering both CRDT vs CRDY and EPIC vs WEPI. This document shows the detailed
              sound symbolism research, Bouba/Kiki effect application, and embodied cognition analysis that led to both
              the CRDT and EPIC recommendations.
            
          

          
            
               openFullscreen("/images/crdt-epic-analysis.png")}
              >
                

                {/* Expand overlay */}
                
                  
                    
                  
                
              
            

            
              Click image to expand to full screen
              
                Scroll within the image above to view the complete document
              
            
          
        
      ),
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  const openFullscreen = (image: string) => {
    setFullscreenImage(image)
    setIsFullscreen(true)
  }

  const closeFullscreen = () => {
    setIsFullscreen(false)
    setFullscreenImage("")
  }

  return (
    <>
      
        
          
            
              Strategic Ticker Branding
            
            
            
              Comprehensive analysis of ticker optimization across multiple WisdomTree products, combining psychology,
              linguistics, and market dynamics
            
          

          
            
              {/* Slide Header */}
              
                
                  {slides[currentSlide].icon}
                  
                    {slides[currentSlide].title}
                    {slides[currentSlide].subtitle}
                  
                
              

              {/* Slide Content */}
              {slides[currentSlide].content}

              {/* Navigation */}
              
                
                  

                  {/* Slide Indicators */}
                  
                    {slides.map((_, index) => (
                      

                  
                

                
                  Slide {currentSlide + 1} of {slides.length}
                
              
            
          
        
      

      {/* Fullscreen Modal */}
      {isFullscreen && (
        
          
            

             {
                // Prevent event from bubbling up to prevent background scroll
                e.stopPropagation()
              }}
            >
              
            
          
        
      )}
    
  )
}
[V0_FILE]typescriptreact:file="components/geo-strategy.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState } from "react"
import { ChevronLeft, ChevronRight, Lightbulb, TrendingUp, Search, Zap, Brain, Target } from "lucide-react"
import { Button } from "@/components/ui/button"

export function GeoStrategy() {
  const [currentSlide, setCurrentSlide] = useState(0)

  const slides = [
    {
      id: 0,
      title: "Strategic Initiative: The AI Discovery Shift",
      subtitle: "Identifying the Future Before It Arrives",
      icon: ,
      content: (
        
          
            The Insight
            
              "AI is fundamentally changing how people discover content and products. I'd like us to get ahead of this
              shift with a thoughtful, informed strategy."
            
            
              Instead of scrolling through search results, users are relying on AI-generated answers, summaries, and
              recommendations. This trend is already impacting organic traffic and will only accelerate.
            
          

          
            
              Before
              Traditional SEO mindset
            
            
              After
              GEO/LLMO strategy
            
          
        
      ),
    },
    {
      id: 1,
      title: "Strategic Questions Framework",
      subtitle: "Comprehensive Research Approach",
      icon: ,
      content: (
        
          
            My Strategic Research Framework
            
              I developed a comprehensive approach to understand and leverage the shift from SEO to GEO:
            
          

          
            
              1. Understanding GEO/LLMO
              
                • How to optimize for AI-generated answers (ChatGPT, Google AI, Perplexity)
                • Factors that increase content citation likelihood
                • Tools and plugins for GEO optimization
              
            

            
              2. ASO Evolution Impact
              
                • How AI results affect app store listings
                • Crossover between ASO and GEO strategies
                • Future of app discovery
              
            

            
              3. Success Metrics & Best Practices
              
                • Emerging GEO best practices identification
                • Competitive analysis of early adopters
                • Actionable implementation roadmap
              
            
          
        
      ),
    },
    {
      id: 2,
      title: "The Challenge: Black Box Problem",
      subtitle: "Understanding the Complexity",
      icon: ,
      content: (
        
          
            Two Fundamental Problems Identified
            
              Our research revealed why GEO/LLMO is so challenging compared to traditional SEO:
            
          

          
            
              Problem 1: Attribution Mystery
              
                Deciphering the black box of LLM sourcing to correctly attribute citations and references.
              
              Unlike SEO's clear rules, LLMs operate probabilistically
            

            
              Problem 2: Training Data Opacity
              
                Understanding vector, timing, and frequency of training data and live search functions.
              
              Pattern-based vs deterministic outcomes
            
          

          
            The "Wild West" Phase
            
              We're in an ambiguous phase where lack of transparency makes it difficult to plan or optimize confidently.
              LLM providers will eventually need to provide structured guidance similar to how search engines matured.
            
          
        
      ),
    },
    {
      id: 3,
      title: "Tactical Solutions Discovered",
      subtitle: "LLM-Specific Growth Hacks",
      icon: ,
      content: (
        
          
            Emerging GEO Tactics
            
              While foundational content strategy remains king, I identified specific LLM optimization tactics:
            
          

          
            
              1. Press Release Networks
              
                LLMs prioritize content labeled as "press releases" from authoritative sources.
              
              
                Strategy: Distribute interconnected press releases across partner networks
              
            

            
              2. Pattern Density Saturation
              
                LLMs are pattern recognition engines - republishing across multiple platforms increases indexing
                frequency.
              
              
                Platforms: WisdomTreePrime.com, Mirror.xyz, Medium, Substack, etc.
              
            

            
              3. Direct OpenAI Listing
              
                Proactive approach to list funds, app, services, and data platforms directly with OpenAI.
              
              Early adoption of ChatGPT Search Product Discovery
            
          
        
      ),
    },
    {
      id: 4,
      title: "Competitive Advantage: BI Tool Access",
      subtitle: "Peeling Back the LLM Layers",
      icon: ,
      content: (
        
          
            The Solution
            
              Access to a business intelligence tool specifically designed to map LLM sourcing and attribution
              preferences - essentially a "prompt-to-source visibility layer."
            
          

          
            
              What This Enables
              
                • Peek into the LLM "black box"
                • Map sourcing preferences
                • Understand attribution patterns
                • Optimize content strategy accordingly
              
            

            
              Strategic Position
              
                "We are ahead of most and are in an excellent position to path-find a way through this unexplored
                territory."
              
            
          

          
            First-Mover Advantage
            
              While everyone else is still figuring out the basics, we're already implementing advanced BI tools and
              strategic frameworks for GEO optimization.
            
          
        
      ),
    },
    {
      id: 5,
      title: "Strategic Impact & Leadership",
      subtitle: "Driving Innovation Through Foresight",
      icon: ,
      content: (
        
          
            
              Strategic Leadership in Action
              
                Identifying market shifts before they become mainstream and building competitive advantages through
                early adoption
              
            
          

          
            
              ✅ What I Delivered
              
                • Identified the SEO → GEO shift early
                • Developed comprehensive research framework
                • Secured access to cutting-edge BI tools
                • Created actionable implementation strategy
                • Positioned team ahead of competition
              
            

            
              🎯 Strategic Outcomes
              
                • First-mover advantage in GEO/LLMO
                • Advanced tooling for LLM optimization
                • Cross-functional team alignment
                • Future-proofed content strategy
                • Competitive intelligence advantage
              
            
          

          
            The Kelly Reddington Approach
            
              Spot emerging trends → Research comprehensively → Build strategic frameworks → Secure competitive
              advantages → Lead implementation
            
          
        
      ),
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  return (
    
      
        
          
            Strategic Foresight: SEO to GEO
          
          
          
            How I identified and led the strategic shift from traditional SEO to Generative Engine Optimization,
            positioning our team ahead of the curve in AI-driven discovery
          
        

        
          
            {/* Slide Header */}
            
              
                {slides[currentSlide].icon}
                
                  {slides[currentSlide].title}
                  {slides[currentSlide].subtitle}
                
              
            

            {/* Slide Content */}
            {slides[currentSlide].content}

            {/* Navigation */}
            
              
                

                {/* Slide Indicators */}
                
                  {slides.map((_, index) => (
                    

                
              

              
                Slide {currentSlide + 1} of {slides.length}
              
            
          
        
      
    
  )
}
[V0_FILE]typescriptreact:file="components/meme-showcase.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState } from "react"
import { Zap, ExternalLink, ChevronLeft, ChevronRight, Play } from "lucide-react"
import { Button } from "@/components/ui/button"

export function MemeShowcase() {
  const [currentSlide, setCurrentSlide] = useState(0)

  const slideshows = [
    {
      id: 0,
      title: "Meme Marketing Portfolio",
      subtitle: "Original Viral Content Collection",
      embedSrc: "https://www.canva.com/design/DAGTI0yzUQI/AjMeynilyDQRVzAmK0Dy1Q/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGTI0yzUQI/AjMeynilyDQRVzAmK0Dy1Q/view?utm_content=DAGTI0yzUQI&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Full Meme Slideshow",
      paddingTop: "100.0000%",
      icon: ,
      isVideo: false,
    },
    {
      id: 1,
      title: "Extended Meme Collection",
      subtitle: "Additional Viral Content & Community Engagement",
      embedSrc: "https://www.canva.com/design/DAGTOuJMOk4/A8-gHxdrhP_aC9DeZtM9uQ/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGTOuJMOk4/A8-gHxdrhP_aC9DeZtM9uQ/view?utm_content=DAGTOuJMOk4&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Extended Meme Collection",
      paddingTop: "100.0000%",
      icon: ,
      isVideo: false,
    },
    {
      id: 2,
      title: "Meme Video Examples",
      subtitle: "Dynamic Video Content & Animated Memes",
      embedSrc: "https://www.canva.com/design/DAGTPJjruMg/I65kmuVC8n1mTQ2lQvMY0g/watch?embed",
      viewLink:
        "https://www.canva.com/design/DAGTPJjruMg/I65kmuVC8n1mTQ2lQvMY0g/watch?utm_content=DAGTPJjruMg&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Meme Video Examples",
      paddingTop: "100.0000%",
      icon: ,
      isVideo: true,
    },
    {
      id: 3,
      title: "Advanced Meme Video Collection",
      subtitle: "Extended Video Content & Creative Animations",
      embedSrc: "https://www.canva.com/design/DAGYM0C2Wdw/ca8omqgNjH3-gNtViWlcCQ/watch?embed",
      viewLink:
        "https://www.canva.com/design/DAGYM0C2Wdw/ca8omqgNjH3-gNtViWlcCQ/watch?utm_content=DAGYM0C2Wdw&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Advanced Meme Videos",
      paddingTop: "100.0000%",
      icon: ,
      isVideo: true,
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slideshows.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slideshows.length) % slideshows.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  return (
    
      
        
          
            Meme Marketing & Viral Content
          
          
          
            Strategic meme marketing and viral content creation that drives engagement and builds authentic connections
            with crypto-native audiences
          
        

        
          
            {/* Header */}
            
              
                {slideshows[currentSlide].icon}
                
                  {slideshows[currentSlide].title}
                  {slideshows[currentSlide].subtitle}
                
                
                  {currentSlide + 1} of {slideshows.length}
                
              
            

            {/* Slideshow Container */}
            
              
                
              </div>

              <div className="text-center mt-6">
                <a
                  href={slideshows[currentSlide].viewLink}
                  target="_blank"
                  rel="noopener noreferrer"
                  className="inline-flex items-center gap-2 px-6 py-3 bg-gradient-to-r from-red-600 to-red-800 hover:from-red-700 hover:to-red-900 text-white rounded-full font-semibold transition-all duration-300 hover:scale-105 shadow-lg hover:shadow-red-500/25"
                >
                  <span>{slideshows[currentSlide].linkText}</span>
                  <ExternalLink className="w-4 h-4" />
                </a>
                <p className="text-sm text-gray-400 mt-2">by Kelly Reddington</p>
              </div>
            </div>

            {/* Navigation */}
            <div className="p-6 border-t border-white/10 bg-white/5">
              <div className="flex items-center justify-between">
                <Button
                  onClick={prevSlide}
                  variant="outline"
                  className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                  disabled={currentSlide === 0}
                >
                  <ChevronLeft className="w-4 h-4 mr-2" />
                  Previous
                </Button>

                {/* Slide Indicators */}
                <div className="flex gap-2">
                  {slideshows.map((_, index) => (
                    <button
                      key={index}
                      onClick={() => goToSlide(index)}
                      className={`w-3 h-3 rounded-full transition-all duration-300 ${
                        index === currentSlide
                          ? "bg-gradient-to-r from-red-500 to-red-600"
                          : "bg-white/20 hover:bg-white/40"
                      }`}
                    />
                  ))}
                </div>

                <Button
                  onClick={nextSlide}
                  variant="outline"
                  className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                  disabled={currentSlide === slideshows.length - 1}
                >
                  Next
                  <ChevronRight className="w-4 h-4 ml-2" />
                </Button>
              </div>

              <div className="text-center mt-4 text-gray-400 text-sm">
                Slide {currentSlide + 1} of {slideshows.length}
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/work-samples.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { ExternalLink, FileText, Zap } from "lucide-react"

export function WorkSamples() {
  const samples = [
    {
      category: "Product Marketing",
      icon: <Zap className="w-6 h-6" />,
      description:
        "The aim of my Product Marketing efforts is to translate the product vision into adoption. At the heart of great product marketing is the ability to understand the product, the market, and the end user, ensuring that every message resonates with the right audience.",
      approach: [
        "Positioning: Crafting compelling product narratives that align with market needs, current events, cultural relevance",
        "Go-to-Market Strategy: Developing end-to-end product marketing strategies, including launch plans and retention campaigns",
        "Cross-Functional Collaboration: Working closely with product, sales, and design teams",
        "Data-Driven Insights: Leveraging analytics and client feedback to refine messaging and boost engagement",
      ],
    },
    {
      category: "Content Marketing",
      icon: <FileText className="w-6 h-6" />,
      items: [
        "RWA.xyz Joint Whitepaper",
        "Blog Strategy and Writing (named author and ghostwriter)",
        "Storytelling for Brand awareness and employee advocacy",
        "Copywriting & Creative Ideation",
        "Podcast guest outreach and show notes",
        "Website copy examples",
      ],
    },
  ]

  return (
    <section id="work-samples" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Work Samples & Expertise
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            Examples of viral content, strategic campaigns, and product marketing that drive real results
          </p>
        </div>

        <div className="space-y-12">
          {samples.map((sample, index) => (
            <div
              key={index}
              className="bg-white/5 backdrop-blur-sm rounded-2xl p-8 border border-white/10 hover:bg-white/10 transition-all duration-300"
            >
              <div className="flex items-center gap-4 mb-6">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  {sample.icon}
                </div>
                <h3 className="text-2xl font-bold text-red-400">{sample.category}</h3>
              </div>

              {sample.description && <p className="text-gray-300 leading-relaxed mb-6">{sample.description}</p>}

              {sample.approach && (
                <div className="space-y-3 mb-6">
                  <h4 className="text-lg font-semibold text-white">My Approach:</h4>
                  {sample.approach.map((item, idx) => (
                    <div key={idx} className="flex items-start gap-3">
                      <div className="w-2 h-2 bg-red-500 rounded-full mt-2 flex-shrink-0" />
                      <span className="text-gray-300">{item}</span>
                    </div>
                  ))}
                </div>
              )}

              {sample.items && (
                <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-3">
                  {sample.items.map((item, idx) => (
                    <div
                      key={idx}
                      className="flex items-center gap-2 p-3 bg-white/5 rounded-lg border border-white/10 hover:bg-white/10 transition-colors duration-300"
                    >
                      <ExternalLink className="w-4 h-4 text-red-400 flex-shrink-0" />
                      <span className="text-gray-300 text-sm">{item}</span>
                    </div>
                  ))}
                </div>
              )}
            </div>
          ))}
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/certifications.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { Award, GraduationCap } from "lucide-react"

export function Certifications() {
  const certifications = [
    "Google AI for Anyone Certification",
    "Product Marketing Alliance - Core",
    "The Complete Solidity Course - Blockchain - Zero to Expert (Udemy)",
    "Appsflyer Essentials Certified - Mobile App Analytics",
    "Level Access Certified - Website & Content Accessibility (WCAG)",
    "Sprout Social Certified",
    "Hubspot Social Media Marketing Certified",
    "Hootsuite Social Media Marketing Certified",
    "BuildSpace Nights & Weekends",
  ]

  const education = [
    {
      institution: "University At Buffalo",
      degree: "Business Administration - Finance & Marketing Concentrations",
      gpa: "3.7 GPA",
    },
    {
      institution: "Hilbert College",
      degree: "CyberSecurity/Infosec",
      gpa: "3.8 GPA",
    },
  ]

  return (
    <section id="certifications" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Education & Certifications
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            Continuous learning and professional development in marketing, technology, and business strategy
          </p>
        </div>

        <div className="grid lg:grid-cols-2 gap-12">
          {/* Certifications - Left Side */}
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 p-8">
            <div className="flex items-center gap-3 mb-8">
              <div className="p-3 bg-gradient-to-r from-red-500 to-red-600 rounded-lg">
                <Award className="w-6 h-6 text-white" />
              </div>
              <h3 className="text-2xl font-bold text-white">Professional Certifications</h3>
            </div>
            <div className="space-y-4">
              {certifications.map((cert, index) => (
                <div key={index} className="flex items-start gap-3 group">
                  <div className="w-2 h-2 bg-red-500 rounded-full mt-2 flex-shrink-0 group-hover:bg-red-400 transition-colors" />
                  <span className="text-gray-300 group-hover:text-white transition-colors leading-relaxed">{cert}</span>
                </div>
              ))}
            </div>
          </div>

          {/* Education - Right Side */}
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 p-8">
            <div className="flex items-center gap-3 mb-8">
              <div className="p-3 bg-gradient-to-r from-red-500 to-red-600 rounded-lg">
                <GraduationCap className="w-6 h-6 text-white" />
              </div>
              <h3 className="text-2xl font-bold text-white">Education</h3>
            </div>
            <div className="space-y-8">
              {education.map((edu, index) => (
                <div key={index} className="group">
                  <h4 className="text-xl font-semibold text-white mb-2 group-hover:text-red-400 transition-colors">
                    {edu.institution}
                  </h4>
                  <p className="text-gray-300 mb-2 leading-relaxed">{edu.degree}</p>
                  <div className="inline-block px-3 py-1 bg-gradient-to-r from-red-500/20 to-red-600/20 border border-red-500/30 rounded-full">
                    <span className="text-red-400 font-semibold text-sm">{edu.gpa}</span>
                  </div>
                </div>
              ))}
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/resume-viewer.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { FileText, ExternalLink } from "lucide-react"

export function ResumeViewer() {
  return (
    <section id="resume" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Resume
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
        </div>

        <div className="max-w-5xl mx-auto">
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 overflow-hidden">
            {/* Header */}
            <div className="bg-gradient-to-r from-red-500/20 to-red-600/20 p-6 border-b border-white/10">
              <div className="flex items-center gap-4">
                <div className="p-2 bg-white/10 rounded-lg">
                  <FileText className="w-6 h-6" />
                </div>
                <div>
                  <h3 className="text-2xl font-bold text-red-400">Resume</h3>
                  <p className="text-gray-300">Kelly Reddington</p>
                </div>
              </div>
            </div>

            {/* Canva Embed Container */}
            <div className="p-8">
              <div
                style={{
                  position: "relative",
                  width: "100%",
                  height: 0,
                  paddingTop: "129.4118%",
                  paddingBottom: 0,
                  boxShadow: "0 2px 8px 0 rgba(63,69,81,0.16)",
                  overflow: "hidden",
                  borderRadius: "12px",
                  willChange: "transform",
                }}
              >
                <iframe
                  loading="lazy"
                  style={{
                    position: "absolute",
                    width: "100%",
                    height: "100%",
                    top: 0,
                    left: 0,
                    border: "none",
                    padding: 0,
                    margin: 0,
                  }}
                  src="https://www.canva.com/design/DAGCiqwnmWA/wOVV_p2Py1HdGIi7_5QI9w/view?embed"
                  allowFullScreen={true}
                  allow="fullscreen"
                />
              </div>

              <div className="text-center mt-6">
                <a
                  href="https://www.canva.com/design/DAGCiqwnmWA/wOVV_p2Py1HdGIi7_5QI9w/view?utm_content=DAGCiqwnmWA&utm_campaign=designshare&utm_medium=embeds&utm_source=link"
                  target="_blank"
                  rel="noopener noreferrer"
                  className="inline-flex items-center gap-2 px-6 py-3 bg-gradient-to-r from-red-600 to-red-800 hover:from-red-700 hover:to-red-900 text-white rounded-full font-semibold transition-all duration-300 hover:scale-105 shadow-lg hover:shadow-red-500/25"
                >
                  <span>View Full Resume</span>
                  <ExternalLink className="w-4 h-4" />
                </a>
                <p className="text-sm text-gray-400 mt-2">by Kelly Reddington</p>
              </div>
            </div>

            {/* Footer */}
            <div className="p-4 border-t border-white/10 bg-white/5 text-center">
              <p className="text-gray-400 text-sm">
                Interactive resume powered by Canva • Click expand for fullscreen view • Download directly from viewer
              </p>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/skills.tsx" isEdit="true" isMerged="true"
import { Brain, Code, TrendingUp, Zap } from "lucide-react"

export function Skills() {
  const skillCategories = [
    {
      icon: <TrendingUp className="w-8 h-8" />,
      title: "Marketing & Growth",
      skills: [
        "Product Marketing",
        "Growth Hacking",
        "Storytelling",
        "Social Media Growth (X, LinkedIn, YouTube, TikTok, Discord, Farcaster)",
        "SEO",
        "ASO",
        "GEO/LLMO",
        "Email Marketing",
        "Influencer Outreach",
        "Community Building",
      ],
    },
    {
      icon: <Code className="w-8 h-8" />,
      title: "Crypto & Blockchain",
      skills: [
        "EVM Compatibility",
        "Solidity",
        "Smart Contracts",
        "OpenZeppelin",
        "Tokenomics Analysis",
        "DeFi",
        "Tokenization",
        "DAOs",
        "Web3",
        "Reward Loops",
        "Gamification",
        "Decentralized Social (DeSo)",
        "Liquid Staking",
        "LSTs",
        "Restaking",
        "Lido",
        "JitoSOL",
        "MEV",
        "EigenLayer",
        "AVSs",
        "CESR (Composite Ether Staking Rate)",
        "ChainLink",
        "Interoperability",
      ],
    },
    {
      icon: <Brain className="w-8 h-8" />,
      title: "AI & Emerging Tech",
      skills: [
        "Artificial Intelligence",
        "Custom GPT Development",
        "AI Marketing Applications",
        "AI-Generated Content",
        "Google Veo3 Video generation",
        "Gemini Flash 2.5",
        "Midjourney",
        "Lumen5",
        "Murf.ai",
        "V0 Vercel",
      ],
    },
    {
      icon: <Zap className="w-8 h-8" />,
      title: "Data & Strategy",
      skills: [
        "Market Research",
        "Growth Hacking",
        "Analytics & Engagement Optimization",
        "Funnel Strategy",
        "Audience Segmentation",
        "A/B Testing",
        "Appsflyer OneLinks",
        "Meme Marketing",
      ],
    },
  ]

  return (
    <section id="skills" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Key Skills
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
        </div>

        <div className="grid md:grid-cols-2 gap-8 mb-16">
          {skillCategories.map((category, index) => (
            <div
              key={index}
              className="bg-white/5 backdrop-blur-sm rounded-2xl p-8 border border-white/10 hover:bg-white/10 transition-all duration-300 group"
            >
              <div className="flex items-center gap-4 mb-6">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10 group-hover:scale-110 transition-transform duration-300">
                  {category.icon}
                </div>
                <h3 className="text-xl font-bold text-white">{category.title}</h3>
              </div>
              <div className="flex flex-wrap gap-2">
                {category.skills.map((skill, idx) => (
                  <span
                    key={idx}
                    className="px-3 py-1 bg-white/10 rounded-full text-sm text-gray-300 border border-white/20 hover:bg-white/20 transition-colors duration-300"
                  >
                    {skill}
                  </span>
                ))}
              </div>
            </div>
          ))}
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/portfolio.tsx" isEdit="true" isMerged="true"
"use client"

import { useState } from "react"
import { ExternalLink, ChevronLeft, ChevronRight, Building2, Zap, MessageSquare, Users } from "lucide-react"
import { Button } from "@/components/ui/button"

export function Portfolio() {
  const [currentSlide, setCurrentSlide] = useState(0)

  const slideshows = [
    {
      id: 0,
      title: "Corporate Communications",
      subtitle: "Professional Corporate & Business Communications",
      embedSrc: "https://www.canva.com/design/DAGxAZTkRlE/JfsM5skp-0yC6K6aJIoEKw/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGxAZTkRlE/JfsM5skp-0yC6K6aJIoEKw/view?utm_content=DAGxAZTkRlE&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Corporate Communications Portfolio",
      paddingTop: "100.0000%",
      icon: <Building2 className="w-6 h-6" />,
      description:
        "Professional corporate communications, business presentations, and strategic messaging designed for executive and institutional audiences.",
    },
    {
      id: 1,
      title: "Advertisement Portfolio",
      subtitle: "High-Impact Advertisements & Social Media Campaigns",
      embedSrc: "https://www.canva.com/design/DAGT5I_f7jk/f9WITpF4AcHdPHR3nXNTuw/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGT5I_f7jk/f9WITpF4AcHdPHR3nXNTuw/view?utm_content=DAGT5I_f7jk&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Full Advertisement Portfolio",
      paddingTop: "100.0000%",
      icon: <Zap className="w-6 h-6" />,
      description:
        "Explore my collection of high-impact advertisements, social media campaigns, and creative content that achieved 6x industry benchmark engagement rates.",
    },
    {
      id: 2,
      title: "Twitter Threads Portfolio",
      subtitle: "Strategic Thread Content for Retail & Institutional Audiences",
      embedSrc: "https://www.canva.com/design/DAGTguOp3Zc/9zT7A86K8SZiFeubP_URoA/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGTguOp3Zc/9zT7A86K8SZiFeubP_URoA/view?utm_content=DAGTguOp3Zc&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Twitter Threads Portfolio",
      paddingTop: "100.0000%",
      icon: <MessageSquare className="w-6 h-6" />,
      description:
        "I have experience crafting Twitter threads for both retail and institutional audiences. This slideshow features a few examples of my work. Click/tap the image to be taken to the full thread on X.",
    },
    {
      id: 3,
      title: "Social Media Post Examples",
      subtitle: "Influencer-Style Content & Engagement-Driven Posts",
      embedSrc: "https://www.canva.com/design/DAGT3ktaMd0/7y8CsDDLg4AaAqFkB_T2YA/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGT3ktaMd0/7y8CsDDLg4AaAqFkB_T2YA/view?utm_content=DAGT3ktaMd0&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Social Media Examples",
      paddingTop: "100.0000%",
      icon: <Users className="w-6 h-6" />,
      description:
        "Examples of social media posts designed to drive engagement and build authentic connections with audiences across multiple platforms.",
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slideshows.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slideshows.length) % slideshows.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  return (
    <section id="portfolio" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Ads, Threads, Social Posts
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-700 mx-auto rounded-full mt-4" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            A showcase of viral content, strategic campaigns, and high-engagement social media posts that achieved 6x
            industry benchmark engagement rates
          </p>
        </div>

        <div className="max-w-4xl mx-auto">
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 overflow-hidden">
            {/* Header */}
            <div className="bg-gradient-to-r from-red-500/20 to-red-600/20 p-6 border-b border-white/10">
              <div className="flex items-center gap-4 mb-2">
                <div className="p-2 bg-white/10 rounded-lg">{slideshows[currentSlide].icon}</div>
                <div className="flex-1">
                  <h3 className="text-2xl font-bold text-red-400">{slideshows[currentSlide].title}</h3>
                  <p className="text-gray-300">{slideshows[currentSlide].subtitle}</p>
                </div>
                <div className="text-sm text-gray-400">
                  {currentSlide + 1} of {slideshows.length}
                </div>
              </div>
            </div>

            {/* Content Description */}
            <div className="px-8 pt-6">
              <p className="text-gray-300 text-center leading-relaxed">{slideshows[currentSlide].description}</p>
            </div>

            {/* Canva Embed Container */}
            <div className="p-8">
              <div
                style={{
                  position: "relative",
                  width: "100%",
                  height: 0,
                  paddingTop: slideshows[currentSlide].paddingTop,
                  paddingBottom: 0,
                  boxShadow: "0 2px 8px 0 rgba(63,69,81,0.16)",
                  marginTop: "1.6em",
                  marginBottom: "0.9em",
                  overflow: "hidden",
                  borderRadius: "12px",
                  willChange: "transform",
                }}
              >
                <iframe
                  key={currentSlide} // Force re-render when slide changes
                  loading="lazy"
                  style={{
                    position: "absolute",
                    width: "100%",
                    height: "100%",
                    top: 0,
                    left: 0,
                    border: "none",
                    padding: 0,
                    margin: 0,
                  }}
                  src={slideshows[currentSlide].embedSrc}
                  allowFullScreen={true}
                  allow="fullscreen"
                />
              </div>

              <div className="text-center mt-6">
                <a
                  href={slideshows[currentSlide].viewLink}
                  target="_blank"
                  rel="noopener noreferrer"
                  className="inline-flex items-center gap-2 px-6 py-3 bg-gradient-to-r from-red-600 to-red-800 hover:from-red-700 hover:to-red-900 text-white rounded-full font-semibold transition-all duration-300 hover:scale-105 shadow-lg hover:shadow-red-500/25"
                >
                  <span>{slideshows[currentSlide].linkText}</span>
                  <ExternalLink className="w-4 h-4" />
                </a>
                <p className="text-sm text-gray-400 mt-2">by Kelly Reddington</p>
              </div>
            </div>

            {/* Navigation */}
            <div className="p-6 border-t border-white/10 bg-white/5">
              <div className="flex items-center justify-between">
                <Button
                  onClick={prevSlide}
                  variant="outline"
                  className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                  disabled={currentSlide === 0}
                >
                  <ChevronLeft className="w-4 h-4 mr-2" />
                  Previous
                </Button>

                {/* Slide Indicators */}
                <div className="flex gap-2">
                  {slideshows.map((_, index) => (
                    <button
                      key={index}
                      onClick={() => goToSlide(index)}
                      className={`w-3 h-3 rounded-full transition-all duration-300 ${
                        index === currentSlide
                          ? "bg-gradient-to-r from-red-500 to-red-600"
                          : "bg-white/20 hover:bg-white/40"
                      }`}
                    />
                  ))}
                </div>

                <Button
                  onClick={nextSlide}
                  variant="outline"
                  className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                  disabled={currentSlide === slideshows.length - 1}
                >
                  Next
                  <ChevronRight className="w-4 h-4 ml-2" />
                </Button>
              </div>

              <div className="text-center mt-4 text-gray-400 text-sm">
                Slide {currentSlide + 1} of {slideshows.length}
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]json:file="package.json" isMerged="true"
{
  "name": "my-v0-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "eslint ."
  },
  "dependencies": {
    "@hookform/resolvers": "^3.10.0",
    "@radix-ui/react-accordion": "1.2.2",
    "@radix-ui/react-alert-dialog": "1.1.4",
    "@radix-ui/react-aspect-ratio": "1.1.1",
    "@radix-ui/react-avatar": "1.1.2",
    "@radix-ui/react-checkbox": "1.1.3",
    "@radix-ui/react-collapsible": "1.1.2",
    "@radix-ui/react-context-menu": "2.2.4",
    "@radix-ui/react-dialog": "1.1.4",
    "@radix-ui/react-dropdown-menu": "2.1.4",
    "@radix-ui/react-hover-card": "1.1.4",
    "@radix-ui/react-label": "2.1.1",
    "@radix-ui/react-menubar": "1.1.4",
    "@radix-ui/react-navigation-menu": "1.2.3",
    "@radix-ui/react-popover": "1.1.4",
    "@radix-ui/react-progress": "1.1.1",
    "@radix-ui/react-radio-group": "1.2.2",
    "@radix-ui/react-scroll-area": "1.2.2",
    "@radix-ui/react-select": "2.1.4",
    "@radix-ui/react-separator": "1.1.1",
    "@radix-ui/react-slider": "1.2.2",
    "@radix-ui/react-slot": "1.1.1",
    "@radix-ui/react-switch": "1.1.2",
    "@radix-ui/react-tabs": "1.1.2",
    "@radix-ui/react-toast": "1.2.4",
    "@radix-ui/react-toggle": "1.1.1",
    "@radix-ui/react-toggle-group": "1.1.1",
    "@radix-ui/react-tooltip": "1.1.6",
    "@vercel/analytics": "1.3.1",
    "autoprefixer": "^10.4.20",
    "class-variance-authority": "^0.7.1",
    "clsx": "^2.1.1",
    "cmdk": "1.0.4",
    "date-fns": "4.1.0",
    "embla-carousel-react": "8.5.1",
    "geist": "^1.3.1",
    "input-otp": "1.4.1",
    "lucide-react": "^0.454.0",
    "next": "14.2.35",
    "next-themes": "^0.4.6",
    "react": "^19",
    "react-day-picker": "9.8.0",
    "react-dom": "^19",
    "react-hook-form": "^7.60.0",
    "react-resizable-panels": "^2.1.7",
    "recharts": "2.15.4",
    "sonner": "^1.7.4",
    "tailwind-merge": "^3.3.1",
    "tailwindcss-animate": "^1.0.7",
    "vaul": "^0.9.9",
    "zod": "3.25.67"
  },
  "devDependencies": {
    "@tailwindcss/postcss": "^4.1.9",
    "@types/node": "^22",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "postcss": "^8.5",
    "tailwindcss": "^4.1.9",
    "tw-animate-css": "1.3.3",
    "typescript": "^5"
  }
}
[V0_FILE]typescriptreact:file="components/hero.tsx" isEdit="true" isMerged="true"
"use client"

import { ArrowDown, Linkedin, Mail, BookOpen } from "lucide-react"
import { Button } from "@/components/ui/button"

export function Hero() {
  const scrollToNextSection = () => {
    const skillsSection = document.getElementById("skills")
    if (skillsSection) {
      skillsSection.scrollIntoView({ behavior: "smooth" })
    }
  }

  return (
    <section className="relative min-h-screen flex items-center justify-center overflow-hidden bg-black">
      {/* Background Image */}
      <div
        className="absolute inset-0 bg-cover bg-center bg-no-repeat opacity-30"
        style={{ backgroundImage: "url(/images/hero-bg.png)" }}
      />

      {/* Gradient Overlay */}
      <div className="absolute inset-0 bg-gradient-to-br from-black via-black/90 to-black" />

      {/* Animated Background Elements */}
      <div className="absolute inset-0">
        <div className="absolute top-1/4 left-1/4 w-96 h-96 bg-red-500/10 rounded-full blur-3xl animate-pulse" />
        <div className="absolute bottom-1/4 right-1/4 w-96 h-96 bg-red-500/10 rounded-full blur-3xl animate-pulse delay-1000" />
      </div>

      <div className="relative z-10 text-center max-w-4xl mx-auto px-4">
        <div className="mb-8 animate-fade-in">
          <h1 className="text-5xl md:text-7xl font-bold mb-6 bg-gradient-to-r from-red-500 to-red-600 bg-clip-text text-transparent leading-tight pb-2">
            Kelly Reddington
          </h1>
          <div className="text-xl md:text-2xl text-gray-300 mb-4">
            Marketing & Growth Strategist | Crypto | Fintech | AI{" "}
          </div>
          <div className="text-lg text-gray-400 max-w-2xl mx-auto leading-relaxed">
            Blending technical fluency with narrative clarity to drive adoption. Specializing in education-first
            content, go-to-market strategy, and institutional messaging that bridges complex infrastructure and
            real-world outcomes.
          </div>
        </div>

        {/* Contact Info */}
        <div className="flex flex-wrap justify-center gap-6 mb-12 text-gray-300">
          <a
            href="https://kellyreddington.substack.com/"
            target="_blank"
            rel="noopener noreferrer"
            className="flex items-center gap-2 bg-white/5 backdrop-blur-sm rounded-full px-4 py-2 border border-white/10 hover:bg-white/10 transition-all duration-300"
          >
            <BookOpen size={16} />
            <span>Substack</span>
          </a>
          <div className="flex items-center gap-2 bg-white/5 backdrop-blur-sm rounded-full px-4 py-2 border border-white/10">
            <Mail size={16} />
            <span>kreddington41@gmail.com</span>
          </div>
          <a
            href="https://www.linkedin.com/in/kellyreddington"
            target="_blank"
            rel="noopener noreferrer"
            className="flex items-center gap-2 bg-white/5 backdrop-blur-sm rounded-full px-4 py-2 border border-white/10 hover:bg-white/10 transition-all duration-300"
          >
            <Linkedin size={16} />
            <span>LinkedIn</span>
          </a>
        </div>

        {/* CTA Button */}
        <div className="flex justify-center mb-16">
          <Button
            size="lg"
            onClick={scrollToNextSection}
            className="bg-gradient-to-r from-red-600 to-red-700 hover:from-red-700 hover:to-red-800 text-white border-0 rounded-full px-8 py-3 text-lg font-semibold shadow-2xl hover:shadow-red-500/25 transition-all duration-300 hover:scale-105 cursor-pointer"
          >
            View My Work
          </Button>
        </div>

        {/* Scroll Indicator */}
        <div className="animate-bounce">
          <ArrowDown className="mx-auto text-gray-400" size={32} />
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/contact.tsx" isEdit="true" isMerged="true"
"use client"

import { Mail, BookOpen, Linkedin, MapPin } from "lucide-react"

export function Contact() {
  return (
    <section id="contact" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-red-500 to-red-600 bg-clip-text text-transparent leading-tight pb-2">
            Let's Connect
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            Let's discuss how we can work together.
          </p>
        </div>

        <div className="max-w-2xl mx-auto">
          {/* Contact Info */}
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl p-8 border border-white/10">
            <h3 className="text-2xl font-bold text-white mb-8 text-center">Get In Touch</h3>
            <div className="space-y-6">
              <div className="flex items-center gap-4">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  <BookOpen className="w-5 h-5" />
                </div>
                <div>
                  <p className="text-gray-400 text-sm">Substack</p>
                  <a
                    href="https://kellyreddington.substack.com/"
                    target="_blank"
                    rel="noopener noreferrer"
                    className="text-red-400 font-medium hover:text-red-300 transition-colors duration-300"
                  >
                    Read my Substack
                  </a>
                </div>
              </div>

              <div className="flex items-center gap-4">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  <Mail className="w-5 h-5" />
                </div>
                <div>
                  <p className="text-gray-400 text-sm">Email</p>
                  <p className="text-white font-medium">kreddington41@gmail.com</p>
                </div>
              </div>

              <div className="flex items-center gap-4">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  <MapPin className="w-5 h-5" />
                </div>
                <div>
                  <p className="text-gray-400 text-sm">Location</p>
                  <p className="text-white font-medium">New York</p>
                </div>
              </div>

              <div className="flex items-center gap-4">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  <Linkedin className="w-5 h-5" />
                </div>
                <div>
                  <p className="text-gray-400 text-sm">LinkedIn</p>
                  <a
                    href="https://www.linkedin.com/in/kellyreddington"
                    target="_blank"
                    rel="noopener noreferrer"
                    className="text-red-400 font-medium hover:text-red-300 transition-colors duration-300"
                  >
                    Connect with me
                  </a>
                </div>
              </div>
            </div>
          </div>
        </div>

        {/* Footer */}
        <div className="mt-20 pt-8 border-t border-white/10 text-center">
          <p className="text-gray-400">© 2025 Kelly Reddington. All rights reserved.</p>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]plaintext:file="public/favicon.ico" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/K%20%281%29-93VebBiwkopZ7pcddW8RmAOEnWGnpS.png" isMerged="true"
[V0_FILE]png:file="public/icon-192.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/K%20%281%29-93VebBiwkopZ7pcddW8RmAOEnWGnpS.png" isMerged="true"
[V0_FILE]png:file="public/icon-512.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/K%20%281%29-93VebBiwkopZ7pcddW8RmAOEnWGnpS.png" isMerged="true"
[V0_FILE]typescriptreact:file="app/layout.tsx" isFixed="true" isEdit="true" isQuickEdit="true" isMerged="true"
import type React from "react"
import type { Metadata } from "next"
import { Inter } from "next/font/google"
import "./globals.css"
import { Analytics } from "@vercel/analytics/react"
import { Suspense } from "react"

const inter = Inter({ subsets: ["latin"] })

export const metadata: Metadata = {
  title: "Kelly Reddington",
  description: "Marketing strategist specializing in crypto, DeFi, growth hacking, and data-driven campaigns",
  icons: {
    icon: [
      { url: "/favicon.ico" },
      { url: "/icon-192.png", sizes: "192x192", type: "image/png" },
      { url: "/icon-512.png", sizes: "512x512", type: "image/png" },
    ],
    apple: "/icon-192.png",
  },
}

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="en">
      <head>
        <link rel="icon" href="/favicon.ico" sizes="any" />
        <link rel="apple-touch-icon" href="/icon-192.png" />
      </head>
      <body className={inter.className}>
        <Suspense fallback={<div>Loading...</div>}>{children}</Suspense>
        <Analytics />
      </body>
    </html>
  )
}
[V0_FILE]typescriptreact:file="components/navigation.tsx" isMerged="true"
"use client"

import { useState, useEffect } from "react"
import { Menu, X } from "lucide-react"

export function Navigation() {
  const [isOpen, setIsOpen] = useState(false)
  const [scrolled, setScrolled] = useState(false)

  useEffect(() => {
    const handleScroll = () => {
      setScrolled(window.scrollY > 50)
    }
    window.addEventListener("scroll", handleScroll)
    return () => window.removeEventListener("scroll", handleScroll)
  }, [])

  const navItems = [
    { href: "#skills", label: "Skills" },
    { href: "#kraken-institutional", label: "Kraken Institutional" },
    { href: "#portfolio", label: "Portfolio" },
    { href: "#meme-showcase", label: "Meme Marketing" },
    { href: "#work-samples", label: "Work Samples" },
    { href: "#crypto-copywriting", label: "Copywriting" },
    { href: "#case-study", label: "Case Study" },
    { href: "#geo-strategy", label: "GEO Strategy" },
    { href: "#datavis-showcase", label: "DataVIS" },
    { href: "#aso-showcase", label: "ASO" },
    { href: "#certifications", label: "Certifications" },
    { href: "#resume", label: "Resume" },
    { href: "#contact", label: "Contact" },
  ]

  return (
    <nav
      className={`fixed top-0 w-full z-50 transition-all duration-300 ${
        scrolled ? "bg-black/80 backdrop-blur-xl border-b border-white/10" : "bg-transparent"
      }`}
    >
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <div className="flex justify-between items-center py-4">
          <div className="text-2xl font-bold bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent">
            Kelly Reddington
          </div>

          {/* Hamburger Menu Button */}
          <button
            className="p-2 rounded-xl bg-white/10 backdrop-blur-sm border border-white/20 hover:bg-white/20 transition-all duration-300"
            onClick={() => setIsOpen(!isOpen)}
          >
            {isOpen ? <X size={24} /> : <Menu size={24} />}
          </button>
        </div>

        {/* Expandable Navigation Menu */}
        {isOpen && (
          <div className="absolute top-full left-0 w-full bg-black/95 backdrop-blur-xl border-b border-white/10">
            <div className="px-4 py-6 space-y-4">
              {navItems.map((item) => (
                <a
                  key={item.href}
                  href={item.href}
                  className="block text-gray-300 hover:text-white transition-all duration-300 py-3 relative group"
                  onClick={() => setIsOpen(false)}
                >
                  {item.label}
                  <span className="absolute -bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-red-500 to-red-600 group-hover:w-full transition-all duration-300"></span>
                </a>
              ))}
            </div>
          </div>
        )}
      </div>
    </nav>
  )
}
[V0_FILE]plaintext:file="public/documents/trump-token-1pager.pdf" url="https://blobs.vusercontent.net/blob/OFFICIAL%20TRUMP%20token%201pager%20%281%29-MhpvFMxjQUDKnaTloicSMQoJMSrb7h.pdf" isMerged="true"
Non-image binary files cannot be read directly. It is available at the following URL: https://blobs.vusercontent.net/blob/OFFICIAL%20TRUMP%20token%201pager%20%281%29-MhpvFMxjQUDKnaTloicSMQoJMSrb7h.pdf
[V0_FILE]plaintext:file="public/documents/kraken-prime-asset-managers.pdf" url="https://blobs.vusercontent.net/blob/Kraken%20Prime%20for%20Asset%20Managers-x5sbxdKQFONbA1IbNkW8swm99DWZsv.pdf" isMerged="true"
Non-image binary files cannot be read directly. It is available at the following URL: https://blobs.vusercontent.net/blob/Kraken%20Prime%20for%20Asset%20Managers-x5sbxdKQFONbA1IbNkW8swm99DWZsv.pdf
[V0_FILE]typescriptreact:file="components/kraken-institutional.tsx"
"use client"

import { useState, useEffect } from "react"
import { ChevronLeft, ChevronRight, Building2, ExternalLink, FileText, BookOpen, FolderOpen, Maximize2, X } from "lucide-react"

export function KrakenInstitutional() {
  const [currentSlide, setCurrentSlide] = useState(0)
  const [currentDocSlide, setCurrentDocSlide] = useState(0)
  const [isFullscreen, setIsFullscreen] = useState(false)
  const [fullscreenImage, setFullscreenImage] = useState("")

  // Prevent body scroll when fullscreen is open
  useEffect(() => {
    if (isFullscreen) {
      document.body.style.overflow = "hidden"
    } else {
      document.body.style.overflow = "unset"
    }
    return () => {
      document.body.style.overflow = "unset"
    }
  }, [isFullscreen])

  const slides = [
    {
      title: "Kraken Institutional Content Portfolio",
      subtitle: "Product Marketing & Content Strategy",
      embedUrl: "https://www.canva.com/design/DAHKTm4_J4A/SuOBc7RO9d4QDagQ3NRVTA/view?embed",
      linkUrl: "https://www.canva.com/design/DAHKTm4_J4A/SuOBc7RO9d4QDagQ3NRVTA/view",
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const documentSlides = [
    {
      title: "Infrastructure for the OFFICIAL TRUMP Token Ecosystem",
      description: "Product 1-pager covering qualified custody, OTC execution, derivatives access, collateral capabilities, and broader strategic partnership opportunities.",
      imageUrl: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/official_trump_token_single-tHLmA33k3vqR1JXbJCqP3xyiLM5DH7.png",
    },
    {
      title: "BTC Covered Calls Strategy Spotlight",
      description: "Strategy spotlight explaining covered call strategies for BTC holders, including strategy overview, why Kraken VIP, and steady premium capture performance metrics.",
      imageUrl: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/btc_covered_calls_single_image-qL5M1SzCXGGNNavyHrba03q0FazK7o.png",
    },
    {
      title: "Kraken Prime for Hedge Funds",
      description: "Comprehensive product marketing for hedge funds covering qualified custody, execution & OTC liquidity, capital efficiency, regulated derivatives, and staking & yield.",
      imageUrl: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/kraken_prime_hedge_funds_single-yU6We9bXMdX89AQ5uFXGY32yRSFs0q.png",
    },
    {
      title: "Kraken Prime for Venture Capitalists",
      description: "Product marketing for VCs covering token custody & vesting, execution & OTC liquidity, LP reporting & governance, staking, yield, and financing.",
      imageUrl: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/kraken_prime_vcs_single-1Q3zCuxJv2cRRpfCqpkdWwjd46v1oI.png",
    },
    {
      title: "OTC Options Primer",
      description: "Educational content explaining OTC options, pricing mechanics, option strategies, and how to trade OTC options with Kraken.",
      imageUrl: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/otc_options_primer_page_1.png-b2TlN0pLOvnhxMbyy8hd9Kjwe55dWs.jpeg",
    },
  ]

  const nextDocSlide = () => {
    setCurrentDocSlide((prev) => (prev + 1) % documentSlides.length)
  }

  const prevDocSlide = () => {
    setCurrentDocSlide((prev) => (prev - 1 + documentSlides.length) % documentSlides.length)
  }

  return (
    <section id="kraken-institutional" className="py-20 px-4 sm:px-6 lg:px-8 bg-black">
      <div className="max-w-6xl mx-auto">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold bg-gradient-to-r from-red-500 to-red-600 bg-clip-text text-transparent leading-tight pb-2">
            Kraken Institutional
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto mt-4 mb-8"></div>
          <p className="text-gray-400 max-w-4xl mx-auto text-lg leading-relaxed">
            I joined Kraken Institutional as a product marketer focusing on content strategy. I created social posts, animations, sales enablement material, decks for Payward Services (B2B offering), Prime brokerage, Exchange trading, Brochures for events, wrote blog posts, long-form educational primers, and more. I focused on broad strategy, tying our product offerings to industry narratives to trendjack and growth hack our social presence and to increase our MQLs in the pipeline.
          </p>
          <p className="text-white font-bold max-w-4xl mx-auto text-lg leading-relaxed mt-4">
            I blend institutional positioning, infrastructure narratives, regulated financial messaging, and complex product abstraction to create content systems.
          </p>
        </div>

        {/* Slideshow */}
        <div className="relative">
          {/* Slide Header */}
          <div className="text-center mb-6">
            <div className="flex items-center justify-center gap-3 mb-2">
              <Building2 className="w-6 h-6 text-red-500" />
              <h3 className="text-2xl font-bold text-white">{slides[currentSlide].title}</h3>
            </div>
            <p className="text-gray-400">{slides[currentSlide].subtitle}</p>
          </div>

          {/* Canva Embed */}
          <div className="relative rounded-2xl overflow-hidden border border-white/10 bg-white/5">
            <div style={{ position: "relative", width: "100%", height: 0, paddingTop: "56.25%", overflow: "hidden" }}>
              <iframe
                key={currentSlide}
                loading="lazy"
                style={{ position: "absolute", width: "100%", height: "100%", top: 0, left: 0, border: "none" }}
                src={slides[currentSlide].embedUrl}
                allowFullScreen
                allow="fullscreen"
              />
            </div>
          </div>

          {/* View Full Slideshow Link */}
          <div className="text-center mt-6">
            <a
              href={slides[currentSlide].linkUrl}
              target="_blank"
              rel="noopener noreferrer"
              className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors"
            >
              <ExternalLink className="w-4 h-4" />
              View Full Slideshow
            </a>
          </div>

          {/* Navigation Buttons - Only show if more than 1 slide */}
          {slides.length > 1 && (
            <>
              <button
                onClick={prevSlide}
                className="absolute left-4 top-1/2 -translate-y-1/2 p-3 rounded-full bg-black/50 border border-white/20 hover:bg-red-500/20 hover:border-red-400 transition-all duration-300"
              >
                <ChevronLeft className="w-6 h-6" />
              </button>
              <button
                onClick={nextSlide}
                className="absolute right-4 top-1/2 -translate-y-1/2 p-3 rounded-full bg-black/50 border border-white/20 hover:bg-red-500/20 hover:border-red-400 transition-all duration-300"
              >
                <ChevronRight className="w-6 h-6" />
              </button>
            </>
          )}
        </div>

        {/* Slide Indicators - Only show if more than 1 slide */}
        {slides.length > 1 && (
          <div className="flex justify-center gap-2 mt-8">
            {slides.map((_, index) => (
              <button
                key={index}
                onClick={() => setCurrentSlide(index)}
                className={`w-3 h-3 rounded-full transition-all duration-300 ${
                  index === currentSlide ? "bg-red-500 w-8" : "bg-white/30 hover:bg-white/50"
                }`}
              />
            ))}
          </div>
        )}

        {/* Blog Posts Section */}
        <div className="mt-20">
          <div className="text-center mb-12">
            <div className="flex items-center justify-center gap-3 mb-4">
              <BookOpen className="w-6 h-6 text-red-500" />
              <h3 className="text-2xl font-bold text-white">Blog Posts I Wrote While at Kraken</h3>
            </div>
            <p className="text-gray-400 max-w-3xl mx-auto">
              These blog posts display clear product marketing principles, content logic ladders, and oftentimes tie into the company&apos;s mission for impactful conclusions.
            </p>
          </div>

          <div className="space-y-8">
            {/* Product Integration Announcement */}
            <div className="bg-white/5 border border-white/10 rounded-xl p-6 hover:border-red-500/30 transition-all duration-300">
              <div className="flex items-start gap-4">
                <div className="p-3 rounded-lg bg-red-500/10">
                  <FileText className="w-5 h-5 text-red-500" />
                </div>
                <div className="flex-1">
                  <h4 className="text-lg font-semibold text-white mb-2">Product Integration Announcement</h4>
                  <a
                    href="https://blog.kraken.com/product/ramp/now-live-on-onramper"
                    target="_blank"
                    rel="noopener noreferrer"
                    className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                  >
                    <ExternalLink className="w-4 h-4" />
                    Now Live on Onramper
                  </a>
                </div>
              </div>
            </div>

            {/* Kraken 360 Thought Leadership */}
            <div className="bg-white/5 border border-white/10 rounded-xl p-6 hover:border-red-500/30 transition-all duration-300">
              <div className="flex items-start gap-4">
                <div className="p-3 rounded-lg bg-red-500/10">
                  <FileText className="w-5 h-5 text-red-500" />
                </div>
                <div className="flex-1">
                  <h4 className="text-lg font-semibold text-white mb-3">Kraken 360 Thought Leadership Content System</h4>
                  <div className="grid grid-cols-2 md:grid-cols-3 gap-3">
                    <a
                      href="https://blog.kraken.com/product/360/the-tge-checklist"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 1: The TGE Checklist
                    </a>
                    <a
                      href="https://blog.kraken.com/product/360/pre-tge-playbook-part-2"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 2: Pre-TGE Playbook
                    </a>
                    <a
                      href="https://blog.kraken.com/product/360/pre-tge-playbook-part-3"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 3: Pre-TGE Playbook
                    </a>
                    <a
                      href="https://blog.kraken.com/product/360/pre-tge-playbook-part-4"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 4: Pre-TGE Playbook
                    </a>
                    <a
                      href="https://blog.kraken.com/product/360/the-vendor-sprawl-problem"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 5: Vendor Sprawl Problem
                    </a>
                    <a
                      href="https://blog.kraken.com/product/360/6-vendors-to-lock-in-before-mint"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 6: 6 Vendors to Lock In
                    </a>
                  </div>
                </div>
              </div>
            </div>

            {/* Exchange Trading API Unlocked */}
            <div className="bg-white/5 border border-white/10 rounded-xl p-6 hover:border-red-500/30 transition-all duration-300">
              <div className="flex items-start gap-4">
                <div className="p-3 rounded-lg bg-red-500/10">
                  <FileText className="w-5 h-5 text-red-500" />
                </div>
                <div className="flex-1">
                  <h4 className="text-lg font-semibold text-white mb-2">Exchange Trading &apos;API Unlocked&apos; Content System</h4>
                  <a
                    href="https://blog.kraken.com/category/product/api"
                    target="_blank"
                    rel="noopener noreferrer"
                    className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                  >
                    <ExternalLink className="w-4 h-4" />
                    View API Content Series
                  </a>
                </div>
              </div>
            </div>

            {/* Kraken Custody SPL Token Support */}
            <div className="bg-white/5 border border-white/10 rounded-xl p-6 hover:border-red-500/30 transition-all duration-300">
              <div className="flex items-start gap-4">
                <div className="p-3 rounded-lg bg-red-500/10">
                  <FileText className="w-5 h-5 text-red-500" />
                </div>
                <div className="flex-1">
                  <h4 className="text-lg font-semibold text-white mb-2">Kraken Custody Expanded Asset Support</h4>
                  <a
                    href="https://blog.kraken.com/product/kraken-institutional/spl-token-support-for-solana"
                    target="_blank"
                    rel="noopener noreferrer"
                    className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                  >
                    <ExternalLink className="w-4 h-4" />
                    SPL Token Support for Solana
                  </a>
                  <p className="text-gray-500 text-xs mt-2">
                    This post taps into the internet capital markets narrative popularized by the Solana ecosystem, naturally segues into a Kraken 360 product spotlight, and ends with an inter-weaving of Solana&apos;s mission and Kraken&apos;s founding mission.
                  </p>
                </div>
              </div>
            </div>
          </div>
        </div>

        {/* Institutional Product Marketing Section */}
        <div className="mt-20">
          <div className="text-center mb-12">
            <div className="flex items-center justify-center gap-3 mb-4">
              <Building2 className="w-6 h-6 text-red-500" />
              <h3 className="text-2xl font-bold text-white">Institutional Product Marketing</h3>
            </div>
            <p className="text-gray-400 max-w-4xl mx-auto mb-4">
              Specialized in translating complex crypto and financial infrastructure into clear institutional narratives across Kraken Institutional&apos;s custody, execution, staking, financing, derivatives, and token lifecycle offerings.
            </p>
            <p className="text-gray-400 max-w-4xl mx-auto">
              The work combined product marketing, infrastructure positioning, educational content, and strategic storytelling to help institutional audiences understand how digital asset systems integrate into real-world operational, treasury, trading, governance, and investment workflows. The focus consistently centered on clarity, trust, regulatory alignment, and simplifying complexity without diluting technical sophistication.
            </p>
          </div>

          {/* Google Drive Link */}
          <div className="text-center mb-10">
            <a
              href="https://drive.google.com/drive/folders/166hffHZf2GWonoiyctOyKO0KQDL1WSX9?usp=sharing"
              target="_blank"
              rel="noopener noreferrer"
              className="inline-flex items-center gap-3 px-6 py-3 bg-white/5 border border-white/10 rounded-xl hover:border-red-500/30 hover:bg-red-500/5 transition-all duration-300"
            >
              <FolderOpen className="w-5 h-5 text-red-500" />
              <span className="text-white font-medium">Click to view Google Drive folder</span>
              <ExternalLink className="w-4 h-4 text-gray-400" />
            </a>
          </div>

          {/* Document Slideshow */}
          <div className="relative">
            {/* Slide Header */}
            <div className="text-center mb-6">
              <h4 className="text-xl font-semibold text-white mb-2">{documentSlides[currentDocSlide].title}</h4>
              <p className="text-gray-400 text-sm max-w-2xl mx-auto">{documentSlides[currentDocSlide].description}</p>
            </div>

            {/* Image Display with Scroll */}
            <div className="relative rounded-2xl overflow-hidden border border-white/10 bg-white/5">
              <div
                className="w-full h-[600px] overflow-y-auto bg-gray-900 cursor-pointer group"
                style={{
                  scrollbarWidth: "thin",
                  scrollbarColor: "#ef4444 #1f2937",
                }}
                onClick={() => {
                  setFullscreenImage(documentSlides[currentDocSlide].imageUrl)
                  setIsFullscreen(true)
                }}
              >
                <img
                  key={currentDocSlide}
                  src={documentSlides[currentDocSlide].imageUrl}
                  alt={documentSlides[currentDocSlide].title}
                  className="w-full h-auto transition-transform duration-300"
                  style={{ minHeight: "100%", objectFit: "contain" }}
                />
              </div>
              {/* Expand Button */}
              <button
                onClick={() => {
                  setFullscreenImage(documentSlides[currentDocSlide].imageUrl)
                  setIsFullscreen(true)
                }}
                className="absolute top-4 right-4 p-2 rounded-lg bg-black/50 border border-white/20 hover:bg-red-500/20 hover:border-red-400 transition-all duration-300"
              >
                <Maximize2 className="w-5 h-5" />
              </button>
            </div>

            <div className="text-center mt-4">
              <p className="text-gray-400 text-sm">Click image to expand to full screen</p>
              <p className="text-gray-500 text-xs mt-1">Scroll within the image above to view the complete document</p>
            </div>

            {/* Navigation Buttons */}
            {documentSlides.length > 1 && (
              <>
                <button
                  onClick={prevDocSlide}
                  className="absolute left-4 top-1/2 -translate-y-1/2 p-3 rounded-full bg-black/50 border border-white/20 hover:bg-red-500/20 hover:border-red-400 transition-all duration-300"
                >
                  <ChevronLeft className="w-6 h-6" />
                </button>
                <button
                  onClick={nextDocSlide}
                  className="absolute right-4 top-1/2 -translate-y-1/2 p-3 rounded-full bg-black/50 border border-white/20 hover:bg-red-500/20 hover:border-red-400 transition-all duration-300"
                >
                  <ChevronRight className="w-6 h-6" />
                </button>
              </>
            )}
          </div>

          {/* Slide Indicators */}
          {documentSlides.length > 1 && (
            <div className="flex justify-center gap-2 mt-8">
              {documentSlides.map((_, index) => (
                <button
                  key={index}
                  onClick={() => setCurrentDocSlide(index)}
                  className={`w-3 h-3 rounded-full transition-all duration-300 ${
                    index === currentDocSlide ? "bg-red-500 w-8" : "bg-white/30 hover:bg-white/50"
                  }`}
                />
              ))}
            </div>
          )}

          {/* Slide Counter */}
          <div className="text-center mt-4 text-gray-500 text-sm">
            {currentDocSlide + 1} of {documentSlides.length}
          </div>
        </div>

        {/* Fullscreen Modal */}
        {isFullscreen && (
          <div
            className="fixed inset-0 bg-black/95 z-50 flex items-center justify-center p-4"
            onClick={() => setIsFullscreen(false)}
          >
            <button
              onClick={() => setIsFullscreen(false)}
              className="absolute top-4 right-4 p-3 rounded-full bg-white/10 hover:bg-red-500/20 transition-all duration-300 z-50"
            >
              <X className="w-6 h-6" />
            </button>
            <div
              className="max-w-7xl max-h-[90vh] overflow-auto overscroll-contain"
              onClick={(e) => e.stopPropagation()}
            >
              <img
                src={fullscreenImage}
                alt="Fullscreen view"
                className="w-full h-auto"
              />
            </div>
          </div>
        )}
      </div>
    </section>
  )
}98:T35ecb,[V0_FILE]png:file="public/images/usdw-analysis.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/screenshot%20USDW%20WTUSD%20resize-oWiE3moj5LRDktnnTyGg4m3OtCdslZ.png" isMerged="true"
[V0_FILE]typescriptreact:file="components/innovation-showcase.tsx" isMerged="true"
"use client"

import { Brain, Smartphone, Globe } from "lucide-react"

export function InnovationShowcase() {
  const projects = [
    {
      category: "AI & Automation",
      icon: <Brain className="w-6 h-6" />,
      projects: [
        {
          title: "AI Executive Avatars",
          description:
            "Designed workflows to transform executives into animated avatars that recite blog posts interactively",
          executives: ["Will Peck", "Jason Guthrie", "Jeremy Siegel"],
          tech: ["AI Workflows", "Digital Clones", "Interactive Content"],
        },
        {
          title: "AI Accessibility Integration",
          description: "Spearheaded Murph.AI adoption for WCAG-compliant voice narration of blog posts",
          impact: "Enhanced accessibility and engagement",
          tech: ["Murph.AI", "WCAG Compliance", "Voice Generation"],
        },
        {
          title: "Generative AI Marketing",
          description: "Utilized Google Veo3 to produce brand-consistent imagery and animations",
          tech: ["Google Veo3", "Brand Consistency", "Campaign Assets"],
        },
      ],
    },
    {
      category: "Growth & App Marketing",
      icon: <Smartphone className="w-6 h-6" />,
      projects: [
        {
          title: "App Store Optimization",
          description: "Managed listings across Apple App Store and Google Play with custom landing pages",
          impact: "Drove organic downloads through keyword optimization and A/B testing",
          tech: ["ASO", "Keyword Targeting", "A/B Testing"],
        },
        {
          title: "WisdomTree Prime Copywriting",
          description: "Wrote crypto-native copy establishing flagship app's authoritative voice",
          scope: ["Homepage", "About Page", "Brand Voice Guidelines"],
        },
      ],
    },
    {
      category: "Web3 & Onchain Innovation",
      icon: <Globe className="w-6 h-6" />,
      projects: [
        {
          title: "DataVIS Project",
          description: "Developed structured onchain identity for seamless Web3 integration",
          platforms: ["Dune", "Nansen", "Developer Platforms"],
          impact: "Amplified brand visibility across Web3 ecosystems",
        },
        {
          title: "Onchain Transparency",
          description: "Standardized token metadata to make products discoverable and trusted",
          focus: ["Token Metadata", "Verification", "Discoverability"],
        },
      ],
    },
  ]

  return (
    <section id="innovation" className="py-20 bg-gradient-to-b from-gray-900 to-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent">
            Innovation in Action
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            Leading-edge AI, automation, and Web3 projects that drive real business impact
          </p>
        </div>

        <div className="space-y-12">
          {projects.map((category, categoryIndex) => (
            <div key={categoryIndex} className="space-y-6">
              <div className="flex items-center gap-4 mb-8">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  {category.icon}
                </div>
                <h3 className="text-2xl font-bold text-red-400">{category.category}</h3>
              </div>

              <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
                {category.projects.map((project, projectIndex) => (
                  <div
                    key={projectIndex}
                    className="bg-white/5 backdrop-blur-sm rounded-2xl p-6 border border-white/10 hover:bg-white/10 transition-all duration-300 group"
                  >
                    <h4 className="text-xl font-semibold text-white mb-3 group-hover:text-red-400 transition-colors duration-300">
                      {project.title}
                    </h4>
                    <p className="text-gray-300 mb-4 leading-relaxed">{project.description}</p>

                    {project.tech && (
                      <div className="flex flex-wrap gap-2 mb-3">
                        {project.tech.map((tech, techIndex) => (
                          <span
                            key={techIndex}
                            className="px-2 py-1 bg-red-500/20 text-red-400 rounded-full text-xs border border-red-500/30"
                          >
                            {tech}
                          </span>
                        ))}
                      </div>
                    )}

                    {project.impact && <div className="text-sm text-gray-400 italic">Impact: {project.impact}</div>}
                  </div>
                ))}
              </div>
            </div>
          ))}
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/about.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
export function About() {
  return (
    <section id="about" className="py-20 bg-gradient-to-b from-black to-gray-900">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent">
            About Me
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full" />
        </div>

        <div className="grid lg:grid-cols-2 gap-12 items-start">
          <div className="space-y-8">
            <div className="bg-white/5 backdrop-blur-sm rounded-2xl p-8 border border-white/10 hover:bg-white/10 transition-all duration-300">
              <h3 className="text-2xl font-semibold mb-6 text-red-400">I like the interesting.</h3>
              <div className="space-y-2 text-gray-300 leading-relaxed">
                <p>The outcasts.</p>
                <p>The left-of-centers.</p>
                <p>The loners.</p>
                <p>The rejects.</p>
                <p>The left-curvers.</p>
                <p>The right-curvers.</p>
                <p>The outsiders.</p>
                <p>The eccentric.</p>
                <p>The peculiar.</p>
                <p>The ADHDers.</p>
                <p>The autists.</p>
                <p>The broken.</p>
                <p>The lonely.</p>
                <p>The neurodivergent.</p>
                <p>The free thinkers.</p>
                <p>The traumatized.</p>
                <p>The lost and forgotten.</p>
                <p>They think beyond conventional boundaries because they exist outside them. As keen observers, they step
                back to absorb everything, only to later reemerge with simplified solutions to the complex and answers
                to the seemingly unsolvable.
              </p>
              <h4 className="text-red-400 font-semibold text-lg">The misunderstood create the unforgettable.</h4>
              <p></p>
              <p></p>
              <p></p>
              <p></p>
              <p></p>
              <p></p>
              <p></p>
              <p></p>
              </div>
            </div>

            
          </div>

          <div className="space-y-8">
            <div className="bg-white/5 backdrop-blur-sm rounded-2xl p-8 border border-white/10 hover:bg-white/10 transition-all duration-300">
              <h3 className="text-2xl font-semibold mb-4 text-white">What I Do</h3>
              <p className="text-gray-300 leading-relaxed mb-4">
                I'm an expert Product, Social Media, and Content marketer passionate about crypto and AI.
              </p>
              <p className="text-gray-300 leading-relaxed">
                I leverage analytics, thought leadership, and viral content to build brands and drive adoption. My
                expertise spans GTM strategy, storytelling, and AI-driven marketing across fintech, crypto, and emerging
                technologies.
              </p>
            </div>

            <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 backdrop-blur-sm rounded-2xl p-8 border border-white/10">
              <h3 className="text-2xl font-semibold mb-6 text-white">Key Achievements</h3>
              <ul className="space-y-4 text-gray-300">
                <li className="flex items-start gap-3">
                  <div className="w-2 h-2 bg-red-500 rounded-full mt-2 flex-shrink-0" />
                  <span>6x industry benchmark engagement rate on LinkedIn and X</span>
                </li>
                <li className="flex items-start gap-3">
                  <div className="w-2 h-2 bg-red-600 rounded-full mt-2 flex-shrink-0" />
                  <span>Supported startups in raising $40M+ in funding</span>
                </li>
                <li className="flex items-start gap-3">
                  <div className="w-2 h-2 bg-red-500 rounded-full mt-2 flex-shrink-0" />
                  <span>1 of 48 selected from 1200+ applicants for Buildspace's Nights and Weekends program</span>
                </li>
                <li className="flex items-start gap-3">
                  <div className="w-2 h-2 bg-red-600 rounded-full mt-2 flex-shrink-0" />
                  <span>Led AI tool research and custom GPT development</span>
                </li>
              </ul>
            </div>

            <div className="bg-white/5 backdrop-blur-sm rounded-2xl p-8 border border-white/10">
              <h3 className="text-xl font-semibold mb-4 text-red-400">Crypto Native Credentials</h3>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Solidity: Zero to Expert certification</li>
                <li>• Meme connoisseur & crypto culture expert</li>
                <li>• Buildspace alumni (48/1200+ selected)</li>
                <li>• Deep Web3 ecosystem knowledge</li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]png:file="public/images/wisdomtree-crypto-native.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/screencapture-wisdomtreeprime-m02-project-qa-2025-08-01-11_37_23-sXdc4koXNHM6tIXr5DKYZi6afbxbiO.png" isMerged="true"
[V0_FILE]png:file="public/images/wisdomtree-original.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/screencapture-wisdomtreeprime-2025-07-31-21_56_03.png-iJ2qkw2tUJqEF57AaD56SA14URiLO4.jpeg" isMerged="true"
[V0_FILE]typescriptreact:file="components/experience.tsx" isEdit="true" isMerged="true"
import { Building2, Calendar, MapPin } from "lucide-react"

export function Experience() {
  const experiences = [
    {
      title: "Associate, Marketing",
      company: "WisdomTree Asset Management",
      location: "New York",
      period: "Current Position",
      type: "Current",
      sections: [
        {
          title: "Brand & Strategy",
          highlights: [
            "Built and scaled WisdomTree Prime's social media strategy, positioning the app to capture both crypto-native and mainstream audiences, driving adoption through multi-channel campaigns",
            "Created and aligned brand messaging across Twitter/X, LinkedIn, YouTube, email, website, in-app, and TV ads, optimizing for engagement and downloads",
            "Established the onchain brand voice, writing foundational crypto-native copy (Homepage, About page, etc) that anchored the app's positioning in a competitive crypto app market",
            "Owned executive social media accounts and strategy, working directly with senior leaders (CEO, CLO, Head of Digital Assets, Head of BizDev, Product, Strategy) to craft compelling thought leadership content",
            "Worked cross-functionally across product, compliance, legal, design, UX/UI, PR, and Investor Relations teams to ensure marketing content met regulatory & compliance standards (FINRA, SEC)",
            "Implemented WCAG standards for Website & Content Accessibility, ensuring compliance and successfully protecting the brand against litigation risks",
            "Conceptualized and launched the DataVIS initiative to standardize WisdomTree's onchain identity, ensuring seamless integration with leading analytics platforms (Dune, Nansen, Messari, RWA.xyz, etc.)",
          ],
        },
        {
          title: "App Store Listings",
          highlights: [
            "Created and managed App Store listings on both Apple App Store Connect and Google Play Console, including custom product landing pages, localized creative assets, and keyword optimization",
            "Drove significant app growth through App Store Optimization (ASO), increasing organic downloads through optimized descriptions, A/B-tested images, and metadata improvements",
            "Designed & launched custom promotional store listings tailored for campaigns and audiences",
          ],
        },
        {
          title: "Artificial Intelligence & Innovation",
          highlights: [
            "Pioneered the use of AI avatars for executive thought leadership, developing digital clones of senior leaders (Will Peck, Jason Guthrie, Jeremy Siegel) to deliver interactive blog content and pilot chatbot-driven engagement",
            "Integrated Murf.ai into the blog publishing workflow for WCAG-compliant, AI-generated narration, improving accessibility and engagement",
            "Directed AI adoption across marketing operations, leading the AI Committee in researching and deploying tools and workflows such as customGPTs to accelerate content generation",
            "Leveraged Google Veo3, Lumen5, Midjourney, and other generative AI tools to create branded imagery, animations, and video assets",
          ],
        },
        {
          title: "Content & Product Marketing",
          highlights: [
            "Growth hacked Crypto Clarified podcast, doubling subscriber growth rate",
            "Identified and recruited podcast guests from companies such as Circle, CoinFund, Fractal, and more",
            "Authored and ghostwrote blog posts and research white papers on crypto, tokenization, and Digital Assets",
            "Created Tokenization 101 Lead Anchor document for WisdomTree Tokenization Projects targeting RIA's, Crypto-native startups, DAO treasuries, hedge funds, and family offices",
            "Achieved 6x industry benchmark engagement rates by curating viral social content, influencer collabs, & brand campaigns",
          ],
        },
      ],
    },
    {
      title: "Fractional CMO/Growth & Strategy Consultant",
      company: "Reddeq",
      location: "Remote",
      period: "Past",
      type: "Consulting",
      highlights: [
        "Advised Angel, Seed, and Series-A Founders on go-to-market (GTM) strategy, product positioning, and messaging, driving market adoption for startups across fintech, crypto, AI and deep tech",
        "Developed high-impact investor and customer-facing materials, including landing pages, pitch decks, brand stories, blog posts, email campaigns, and personas to enhance fundraising and market fit",
        "Conducted market research & competitive analysis, identifying key trends and best practices to position startups effectively",
        "Supported startups in raising $40M+ in funding",
        "Collaborated with incubators, accelerators, launchpads, and investment groups (Angel Syndicates, HNWIs, Family Offices) to secure early-stage funding and strategic partnerships",
        "Advised on GTM strategy and product marketing for multiple high-growth startups, including ACV Auctions - Virtual Lift and Graphene Devices - Next-gen battery tech",
        "Developed crypto market insights & investment theses, analyzing onchain data, social sentiment, and macro trends across Bitcoin, Ethereum, Solana, Fantom (now Sonic), Avalanche, Near, Cosmos, and other blockchain ecosystems",
        "Advised startups in the StartupNY, LaunchNY, and Z80 Labs (Techstars affiliate) ecosystems, refining growth strategies, branding, and customer acquisition through storytelling and data-driven insights",
      ],
    },
  ]

  return (
    <section id="experience" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent">
            Professional Experience
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full" />
        </div>

        <div className="space-y-8">
          {experiences.map((exp, index) => (
            <div
              key={index}
              className="bg-white/5 backdrop-blur-sm rounded-2xl p-8 border border-white/10 hover:bg-white/10 transition-all duration-300 group"
            >
              <div className="flex flex-col lg:flex-row lg:items-start lg:justify-between mb-6">
                <div className="flex-1">
                  <h3 className="text-2xl font-bold text-white mb-2 group-hover:text-red-400 transition-colors duration-300">
                    {exp.title}
                  </h3>
                  <div className="flex items-center gap-2 text-gray-300 mb-2">
                    <Building2 size={18} />
                    <span className="text-lg font-semibold">{exp.company}</span>
                  </div>
                  <div className="flex flex-wrap gap-4 text-sm text-gray-400">
                    <div className="flex items-center gap-1">
                      <MapPin size={16} />
                      <span>{exp.location}</span>
                    </div>
                    <div className="flex items-center gap-1">
                      <Calendar size={16} />
                      <span>{exp.period}</span>
                    </div>
                  </div>
                </div>
                <div
                  className={`mt-4 lg:mt-0 px-3 py-1 rounded-full text-sm font-medium ${
                    exp.type === "Current"
                      ? "bg-green-500/20 text-green-400 border border-green-500/30"
                      : "bg-red-500/20 text-red-400 border border-red-500/30"
                  }`}
                >
                  {exp.type}
                </div>
              </div>

              {/* Sections for detailed breakdown */}
              {exp.sections ? (
                <div className="space-y-6">
                  {exp.sections.map((section, sectionIndex) => (
                    <div key={sectionIndex} className="space-y-3">
                      <h4 className="text-lg font-semibold text-red-400 border-b border-red-500/20 pb-2">
                        {section.title}
                      </h4>
                      <div className="space-y-3">
                        {section.highlights.map((highlight, idx) => (
                          <div key={idx} className="flex items-start gap-3">
                            <div className="w-2 h-2 bg-gradient-to-r from-red-500 to-red-600 rounded-full mt-2 flex-shrink-0" />
                            <span className="text-gray-300 leading-relaxed">{highlight}</span>
                          </div>
                        ))}
                      </div>
                    </div>
                  ))}
                </div>
              ) : (
                <div className="space-y-3">
                  {exp.highlights?.map((highlight, idx) => (
                    <div key={idx} className="flex items-start gap-3">
                      <div className="w-2 h-2 bg-gradient-to-r from-red-500 to-red-600 rounded-full mt-2 flex-shrink-0" />
                      <span className="text-gray-300 leading-relaxed">{highlight}</span>
                    </div>
                  ))}
                </div>
              )}
            </div>
          ))}
        </div>
      </div>
    </section>
  )
}
[V0_FILE]plaintext:file="public/resume/kelly-reddington-resume.pdf" query="Professional resume for Kelly Reddington showing marketing strategist experience at WisdomTree and consulting work, with sections for experience, skills, certifications and education in clean professional format" isMerged="true"
[V0_FILE]png:file="public/images/usdw-complete-analysis.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/screenshot%20USDW%20WTUSD%20resize-jk0EjhLpbiZjfPeN5TCQkgugR7t9b2.png" isMerged="true"
[V0_FILE]png:file="public/images/crdt-epic-analysis.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/CRDT%20and%20EPIC%20branding-iEeN0wiLxLl698LvJ64KRAvB6r2nUU.png" isMerged="true"
[V0_FILE]png:file="public/images/datavis-proposal.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/DataVis%201-fbDMTEUqnpVus91UeCk0PcusJAZ7aC.png" isMerged="true"
[V0_FILE]png:file="public/images/datavis-update.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/DataVIS%202-I8oBdPBPQHB4R5pLyuAWk60WfS4Kah.png" isMerged="true"
[V0_FILE]png:file="public/images/aso-screenshots-1.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-5rc3AG2e5LilXLVp3gJNFk8NZIxql9.png" isMerged="true"
[V0_FILE]png:file="public/images/aso-screenshots-2.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-PyJFiqsKNxV21JP1KaVawdnZINvyOe.png" isMerged="true"
[V0_FILE]typescriptreact:file="app/page.tsx" isMerged="true"
import { Hero } from "@/components/hero"
import { Skills } from "@/components/skills"
import { KrakenInstitutional } from "@/components/kraken-institutional"
import { DataVISShowcase } from "@/components/datavis-showcase"
import { ASOShowcase } from "@/components/aso-showcase"
import { CryptoCopywriting } from "@/components/crypto-copywriting"
import { CaseStudy } from "@/components/case-study"
import { GeoStrategy } from "@/components/geo-strategy"
import { Portfolio } from "@/components/portfolio"
import { MemeShowcase } from "@/components/meme-showcase"
import { WorkSamples } from "@/components/work-samples"
import { Certifications } from "@/components/certifications"
import { ResumeViewer } from "@/components/resume-viewer"
import { Contact } from "@/components/contact"
import { Navigation } from "@/components/navigation"

export default function Home() {
  return (
    <main className="min-h-screen bg-black text-white">
      <Navigation />
      <Hero />
      <Skills />
      <KrakenInstitutional />
      <DataVISShowcase />
      <ASOShowcase />
      <CryptoCopywriting />
      <CaseStudy />
      <GeoStrategy />
      <Portfolio />
      <MemeShowcase />
      <WorkSamples />
      <Certifications />
      <ResumeViewer />
      <Contact />
    </main>
  )
}
[V0_FILE]typescriptreact:file="app/globals.css" isEdit="true" isQuickEdit="true" isMerged="true"
@import "tailwindcss";
@import "tw-animate-css";

@custom-variant dark (&:is(.dark *));

:root {
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.577 0.245 27.325);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);
  --radius: 0.625rem;
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.205 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);
}

.dark {
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.145 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.145 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.985 0 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.269 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: oklch(0.396 0.141 25.723);
  --destructive-foreground: oklch(0.637 0.237 25.331);
  --border: oklch(0.269 0 0);
  --input: oklch(0.269 0 0);
  --ring: oklch(0.439 0 0);
  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);
  --sidebar: oklch(0.205 0 0);
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-primary: oklch(0.488 0.243 264.376);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.269 0 0);
  --sidebar-accent-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(0.269 0 0);
  --sidebar-ring: oklch(0.439 0 0);
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-card: var(--card);
  --color-card-foreground: var(--card-foreground);
  --color-popover: var(--popover);
  --color-popover-foreground: var(--popover-foreground);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-secondary: var(--secondary);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-accent: var(--accent);
  --color-accent-foreground: var(--accent-foreground);
  --color-destructive: var(--destructive);
  --color-destructive-foreground: var(--destructive-foreground);
  --color-border: var(--border);
  --color-input: var(--input);
  --color-ring: var(--ring);
  --color-chart-1: var(--chart-1);
  --color-chart-2: var(--chart-2);
  --color-chart-3: var(--chart-3);
  --color-chart-4: var(--chart-4);
  --color-chart-5: var(--chart-5);
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --color-sidebar: var(--sidebar);
  --color-sidebar-foreground: var(--sidebar-foreground);
  --color-sidebar-primary: var(--sidebar-primary);
  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --color-sidebar-accent: var(--sidebar-accent);
  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
  --color-sidebar-border: var(--sidebar-border);
  --color-sidebar-ring: var(--sidebar-ring);
}

@layer base {
  * {
    @apply border-border outline-ring/50;
  }
  body {
    @apply bg-background text-foreground;
  }
}

/* Custom animations */
@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in {
  animation: fade-in 1s ease-out;
}

/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #000;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(to bottom, #ef4444, #dc2626);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(to bottom, #dc2626, #b91c1c);
}

/* Glass morphism effect */
.glass {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Fix for descender cutoff in section titles */
.section-title {
  line-height: 1.2;
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
}

/* Ensure underline dividers have proper spacing */
.underline-divider {
  margin-top: 1.5rem !important;
}
[V0_FILE]typescriptreact:file="components/datavis-showcase.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState, useEffect } from "react"
import {
  ChevronLeft,
  ChevronRight,
  Database,
  Globe,
  Zap,
  Users,
  Settings,
  TrendingUp,
  Code,
  Maximize2,
  X,
} from "lucide-react"
import { Button } from "@/components/ui/button"

export function DataVISShowcase() {
  const [currentSlide, setCurrentSlide] = useState(0)
  const [isFullscreen, setIsFullscreen] = useState(false)
  const [fullscreenImage, setFullscreenImage] = useState("")

  // Prevent body scroll when fullscreen is open
  useEffect(() => {
    if (isFullscreen) {
      document.body.style.overflow = "hidden"
    } else {
      document.body.style.overflow = "unset"
    }

    // Cleanup on unmount
    return () => {
      document.body.style.overflow = "unset"
    }
  }, [isFullscreen])

  const slides = [
    {
      id: 0,
      title: "DataVIS Initiative: Strategic Overview",
      subtitle: "Bringing Visibility, Identity & Structure to WisdomTree's Onchain Presence",
      icon: <Database className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-2xl p-8 border border-white/10">
            <h3 className="text-2xl font-bold text-red-400 mb-4">The Strategic Challenge</h3>
            <p className="text-gray-300 text-lg leading-relaxed mb-4">
              In Web3, fragmented data across platforms creates friction for developers, partners, and institutional
              adoption. WisdomTree needed a unified onchain presence that builds trust and simplifies integration.
            </p>
          </div>

          <div className="grid md:grid-cols-3 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">Visibility</div>
              <div className="text-gray-300 text-sm">Discoverable on analytics platforms</div>
            </div>
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">Identity</div>
              <div className="text-gray-300 text-sm">Consistent brand across chains</div>
            </div>
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">Structure</div>
              <div className="text-gray-300 text-sm">Centralized source of truth</div>
            </div>
          </div>

          <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Why This Matters</h4>
            <p className="text-gray-300 text-sm">
              "In crypto, transparency and easy access to docs, contract address info, and APIs builds trust and creates
              a more uniform brand experience onchain."
            </p>
          </div>
        </div>
      ),
    },
    {
      id: 1,
      title: "The Onchain Product Kit Strategy",
      subtitle: "Solving Developer & Partner Friction Points",
      icon: <Globe className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">The Central Hub Concept</h3>
            <p className="text-gray-300 mb-4">
              A dedicated onchain product kit that serves as the single source of truth for all WisdomTree onchain
              products, accessible at wisdomtreeprime.com/onchainkit or onchainkit.wisdomtreeprime.com
            </p>
          </div>

          <div className="space-y-4">
            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Use Case: Dashboard Integration</h4>
              <p className="text-gray-300 text-sm mb-2">
                "A dashboard like RWA.xyz or stabledash wants to list our products?"
              </p>
              <p className="text-gray-300 text-sm">
                <strong>Solution:</strong> One URL with all contract addresses, tickers, logo links, and relevant
                information.
              </p>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Use Case: Data Partners</h4>
              <p className="text-gray-300 text-sm mb-2">
                "A data partner like Nansen or CoinMetrics asks to pull NAV or AUM data?"
              </p>
              <p className="text-gray-300 text-sm">
                <strong>Solution:</strong> Convenient link explaining indexing logic and API access.
              </p>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Use Case: Developer Tools</h4>
              <p className="text-gray-300 text-sm mb-2">"Zapper or DefiLlama wants to display our logos for tokens?"</p>
              <p className="text-gray-300 text-sm">
                <strong>Solution:</strong> Pre-formatted, brand consistent downloadable assets.
              </p>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 2,
      title: "Competitive Analysis & Market Position",
      subtitle: "Learning from Crypto Leaders",
      icon: <TrendingUp className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Industry Best Practices</h3>
            <p className="text-gray-300 mb-4">
              "Others in the space have it, and if we want to make things simple and straightforward for people to
              include our products in their products, this is the way to go."
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">Leading Examples</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>
                  • <strong>Coinbase/Base:</strong> Comprehensive OnchainKit API docs
                </li>
                <li>
                  • <strong>Ondo:</strong> Centralized address documentation
                </li>
                <li>
                  • <strong>Superstate:</strong> Smart contract introductions
                </li>
                <li>
                  • <strong>Securitize:</strong> Postman API documentation
                </li>
              </ul>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">WisdomTree Advantage</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Traditional finance credibility</li>
                <li>• Multi-chain product suite</li>
                <li>• Institutional-grade compliance</li>
                <li>• Developer-friendly approach</li>
              </ul>
            </div>
          </div>

          <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10 text-center">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Strategic Positioning</h4>
            <p className="text-gray-300 text-sm">
              "Another way to reinforce the idea that WisdomTree is easy to work with and has an onchain presence that
              is a cut above the competition."
            </p>
          </div>
        </div>
      ),
    },
    {
      id: 3,
      title: "Technical Architecture & Components",
      subtitle: "Building the Onchain Product Kit",
      icon: <Code className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Core Components</h3>
            <p className="text-gray-300 mb-4">
              A comprehensive developer resource targeting data platforms, block explorers, and developers who prefer
              self-serve documentation.
            </p>
          </div>

          <div className="space-y-4">
            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">🏷️ Official Token Information</h4>
              <ul className="space-y-1 text-gray-300 text-sm">
                <li>• Token names and tickers</li>
                <li>• Contract addresses with chain breakdown (Ethereum, Base, Arbitrum)</li>
                <li>• OpenZeppelin audit highlights</li>
                <li>• Explorer links and verified contracts</li>
              </ul>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">🎨 Logos & Metadata</h4>
              <ul className="space-y-1 text-gray-300 text-sm">
                <li>• PNG logos for dashboards and wallet experiences</li>
                <li>• TrustWallet and CoinGecko asset repository links</li>
                <li>• Wallet labeling standards</li>
                <li>• .eth and onchain identity naming conventions</li>
              </ul>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">🔌 APIs & Data Access</h4>
              <ul className="space-y-1 text-gray-300 text-sm">
                <li>• Public-facing, read-only API documentation</li>
                <li>• Static JSON files for daily data pulls</li>
                <li>• Integration with existing digital funds API</li>
                <li>• Contact form for integration requests</li>
              </ul>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 4,
      title: "3-Phase Implementation Strategy",
      subtitle: "Discovery → Integration → Maintenance",
      icon: <Settings className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Strategic Rollout Plan</h3>
            <p className="text-gray-300 mb-4">"Developed a Three step process for us to kickstart this initiative."</p>
          </div>

          <div className="space-y-4">
            <div className="bg-gradient-to-r from-green-500/20 to-green-600/20 rounded-xl p-6 border border-green-500/30">
              <div className="flex items-center gap-3 mb-3">
                <div className="w-3 h-3 bg-green-500 rounded-full"></div>
                <h4 className="text-lg font-semibold text-green-400">Phase 1: Discovery Phase ✅</h4>
              </div>
              <ul className="space-y-1 text-gray-300 text-sm ml-6">
                <li>• Platform inventory and analysis</li>
                <li>• Contract address compilation</li>
                <li>• Technical requirements scoping</li>
                <li>• Competitive benchmarking</li>
              </ul>
            </div>

            <div className="bg-gradient-to-r from-yellow-500/20 to-orange-500/20 rounded-xl p-6 border border-yellow-500/30">
              <div className="flex items-center gap-3 mb-3">
                <div className="w-3 h-3 bg-yellow-500 rounded-full"></div>
                <h4 className="text-lg font-semibold text-yellow-400">Phase 2: Platform Outreach & Integration 🔄</h4>
              </div>
              <ul className="space-y-1 text-gray-300 text-sm ml-6">
                <li>• Direct platform partnerships</li>
                <li>• API integrations and testing</li>
                <li>• Brand asset distribution</li>
                <li>• Developer documentation deployment</li>
              </ul>
            </div>

            <div className="bg-gradient-to-r from-blue-500/20 to-purple-500/20 rounded-xl p-6 border border-blue-500/30">
              <div className="flex items-center gap-3 mb-3">
                <div className="w-3 h-3 bg-blue-500 rounded-full"></div>
                <h4 className="text-lg font-semibold text-blue-400">Phase 3: Maintenance 📋</h4>
              </div>
              <ul className="space-y-1 text-gray-300 text-sm ml-6">
                <li>• Ongoing platform relationship management</li>
                <li>• Data accuracy monitoring</li>
                <li>• New integration requests</li>
                <li>• Performance analytics and optimization</li>
              </ul>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 5,
      title: "Partnership & Integration Impact",
      subtitle: "Building the WisdomTree Ecosystem",
      icon: <Users className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Target Partnership Ecosystem</h3>
            <p className="text-gray-300 mb-4">
              Strategic integrations across analytics platforms, developer tools, and institutional infrastructure.
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="space-y-4">
              <div className="bg-red-500/10 rounded-xl p-4 border border-red-500/20">
                <h4 className="text-md font-bold text-red-400 mb-2">Analytics Platforms</h4>
                <ul className="space-y-1 text-gray-300 text-sm">
                  <li>• RWA.xyz - RWA dashboard integration</li>
                  <li>• Nansen - Institutional analytics</li>
                  <li>• CoinMetrics - Data partnership</li>
                  <li>• Messari - Research Report Integration</li>
                </ul>
              </div>

              <div className="bg-red-500/10 rounded-xl p-4 border border-red-500/20">
                <h4 className="text-md font-bold text-red-400 mb-2">Developer Tools</h4>
                <ul className="space-y-1 text-gray-300 text-sm">
                  <li>• Zapper - Portfolio tracking</li>
                  <li>• DefiLlama - TVL aggregation</li>
                  <li>• Dune Analytics - Custom dashboards</li>
                  <li>• Block explorers (Etherscan, BaseScan, etc.)</li>
                </ul>
              </div>
            </div>

            <div className="space-y-4">
              <div className="bg-red-500/10 rounded-xl p-4 border border-red-500/20">
                <h4 className="text-md font-bold text-red-400 mb-2">Chain Ecosystems</h4>
                <ul className="space-y-1 text-gray-300 text-sm">
                  <li>• Base - L2 RWA exploration</li>
                  <li>• Ethereum - Primary deployment</li>
                  <li>• Stellar - RWA expansion</li>
                  <li>• Cross-chain visibility</li>
                </ul>
              </div>

              <div className="bg-red-500/10 rounded-xl p-4 border border-red-500/20">
                <h4 className="text-md font-bold text-red-400 mb-2">Use Case Example</h4>
                <p className="text-gray-300 text-sm italic">
                  "A Base Dev exploring RWAs for his Dune dashboard can access all of our contract addresses in one
                  convenient, centralized location."
                </p>
              </div>
            </div>
          </div>

          <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10 text-center">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Strategic Outcome</h4>
            <p className="text-gray-300 text-sm">
              Improved institutional visibility, streamlined partner integrations, and reinforced positioning as the
              easiest traditional finance company to work with in Web3.
            </p>
          </div>
        </div>
      ),
    },
    {
      id: 6,
      title: "Innovation: AI-Powered Developer Experience",
      subtitle: "Next-Generation Developer Relations",
      icon: <Zap className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">ChatGPT Plugin/Embedded Assistant</h3>
            <p className="text-gray-300 mb-4">
              "Embed an assistant trained on our dev docs and contracts. Inspired by the Fantom and Base Builder
              Assistants."
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">Inspiration Examples</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>
                  • <strong>Build on Base Assistant:</strong> Solidity expert for Base ecosystem
                </li>
                <li>
                  • <strong>Fantom GPT:</strong> Comprehensive protocol assistant
                </li>
                <li>
                  • <strong>Developer-focused AI:</strong> Instant technical support
                </li>
              </ul>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">WisdomTree AI Features</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Trained on WisdomTree dev docs</li>
                <li>• Contract interaction guidance</li>
                <li>• API usage examples</li>
                <li>• Integration troubleshooting</li>
              </ul>
            </div>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Developer Experience Vision</h4>
            <div className="grid md:grid-cols-2 gap-4 text-sm text-gray-300">
              <div>
                <strong>24/7 Support:</strong> Instant answers to technical questions
              </div>
              <div>
                <strong>Self-Service:</strong> Reduced support ticket volume
              </div>
              <div>
                <strong>Onboarding:</strong> Faster developer integration
              </div>
              <div>
                <strong>Innovation:</strong> Cutting-edge developer relations
              </div>
            </div>
          </div>

          <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10 text-center">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Strategic Innovation</h4>
            <p className="text-gray-300 text-sm">
              Positioning WisdomTree at the forefront of Web3 developer experience with AI-powered support and
              documentation.
            </p>
          </div>
        </div>
      ),
    },
    {
      id: 7,
      title: "Original DataVIS Proposal Document",
      subtitle: "Complete Strategic Initiative Email",
      icon: <Database className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Original Strategic Proposal Email</h3>
            <p className="text-gray-300 mb-4">
              The complete email proposal that outlined the DataVIS initiative, including competitive analysis,
              technical requirements, and implementation strategy.
            </p>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl border border-white/10 overflow-hidden">
            <div className="p-4">
              <div
                className="w-full h-[600px] overflow-y-auto bg-white rounded-lg shadow-2xl cursor-pointer group relative"
                style={{
                  scrollbarWidth: "thin",
                  scrollbarColor: "#ef4444 #f1f5f9",
                }}
                onClick={() => openFullscreen("/images/datavis-proposal.png")}
              >
                <img
                  src="/images/datavis-proposal.png"
                  alt="Complete DataVIS Initiative Proposal Email"
                  className="w-full h-auto transition-transform duration-300 group-hover:scale-105"
                  style={{ minHeight: "100%", objectFit: "contain" }}
                />

                {/* Expand overlay */}
                <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all duration-300 flex items-center justify-center opacity-0 group-hover:opacity-100">
                  <div className="bg-red-500 text-white p-3 rounded-full">
                    <Maximize2 className="w-6 h-6" />
                  </div>
                </div>
              </div>
            </div>

            <div className="px-4 pb-4">
              <p className="text-center text-gray-400 text-sm mb-2">Click image to expand to full screen</p>
              <p className="text-center text-gray-500 text-xs">
                Scroll within the image above to view the complete document
              </p>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 8,
      title: "DataVIS Initiative Update Document",
      subtitle: "Progress Report & Strategic Framework",
      icon: <TrendingUp className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Initiative Progress Update</h3>
            <p className="text-gray-300 mb-4">
              Follow-up communication showing the refined DataVIS framework (Visibility, Identity, Structure) and
              current implementation status across the three-phase rollout.
            </p>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl border border-white/10 overflow-hidden">
            <div className="p-4">
              <div
                className="w-full h-[600px] overflow-y-auto bg-white rounded-lg shadow-2xl cursor-pointer group relative"
                style={{
                  scrollbarWidth: "thin",
                  scrollbarColor: "#ef4444 #f1f5f9",
                }}
                onClick={() => openFullscreen("/images/datavis-update.png")}
              >
                <img
                  src="/images/datavis-update.png"
                  alt="DataVIS Initiative Progress Update"
                  className="w-full h-auto transition-transform duration-300 group-hover:scale-105"
                  style={{ minHeight: "100%", objectFit: "contain" }}
                />

                {/* Expand overlay */}
                <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all duration-300 flex items-center justify-center opacity-0 group-hover:opacity-100">
                  <div className="bg-red-500 text-white p-3 rounded-full">
                    <Maximize2 className="w-6 h-6" />
                  </div>
                </div>
              </div>
            </div>

            <div className="px-4 pb-4">
              <p className="text-center text-gray-400 text-sm mb-2">Click image to expand to full screen</p>
              <p className="text-center text-gray-500 text-xs">
                Scroll within the image above to view the complete document
              </p>
            </div>
          </div>
        </div>
      ),
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  const openFullscreen = (image: string) => {
    setFullscreenImage(image)
    setIsFullscreen(true)
  }

  const closeFullscreen = () => {
    setIsFullscreen(false)
    setFullscreenImage("")
  }

  return (
    <>
      <section id="datavis-showcase" className="py-20 bg-black">
        <div className="max-w-6xl mx-auto px-4">
          <div className="text-center mb-16">
            <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
              DataVIS Initiative
            </h2>
            <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
            <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
              Strategic initiative to bring Visibility, Identity, and Structure to WisdomTree's onchain data presence
            </p>
          </div>

          <div className="max-w-4xl mx-auto">
            <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 overflow-hidden">
              {/* Slide Header */}
              <div className="bg-gradient-to-r from-red-500/20 to-red-600/20 p-6 border-b border-white/10">
                <div className="flex items-center gap-4 mb-2">
                  <div className="p-2 bg-white/10 rounded-lg">{slides[currentSlide].icon}</div>
                  <div>
                    <h3 className="text-2xl font-bold text-red-400">{slides[currentSlide].title}</h3>
                    <p className="text-gray-300">{slides[currentSlide].subtitle}</p>
                  </div>
                </div>
              </div>

              {/* Slide Content */}
              <div className="p-8 min-h-[500px]">{slides[currentSlide].content}</div>

              {/* Navigation */}
              <div className="p-6 border-t border-white/10 bg-white/5">
                <div className="flex items-center justify-between">
                  <Button
                    onClick={prevSlide}
                    variant="outline"
                    className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                    disabled={currentSlide === 0}
                  >
                    <ChevronLeft className="w-4 h-4 mr-2" />
                    Previous
                  </Button>

                  {/* Slide Indicators */}
                  <div className="flex gap-2">
                    {slides.map((_, index) => (
                      <button
                        key={index}
                        onClick={() => goToSlide(index)}
                        className={`w-3 h-3 rounded-full transition-all duration-300 ${
                          index === currentSlide
                            ? "bg-gradient-to-r from-red-500 to-red-600"
                            : "bg-white/20 hover:bg-white/40"
                        }`}
                      />
                    ))}
                  </div>

                  <Button
                    onClick={nextSlide}
                    variant="outline"
                    className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                    disabled={currentSlide === slides.length - 1}
                  >
                    Next
                    <ChevronRight className="w-4 h-4 ml-2" />
                  </Button>
                </div>

                <div className="text-center mt-4 text-gray-400 text-sm">
                  Slide {currentSlide + 1} of {slides.length}
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>

      {/* Fullscreen Modal */}
      {isFullscreen && (
        <div className="fixed inset-0 bg-black/95 z-50 flex items-center justify-center p-4">
          <div className="relative w-full h-full max-w-7xl max-h-full">
            <button
              onClick={closeFullscreen}
              className="absolute top-4 right-4 z-10 bg-red-500 hover:bg-red-600 text-white p-2 rounded-full transition-colors duration-300"
            >
              <X className="w-6 h-6" />
            </button>

            <div
              className="w-full h-full overflow-auto bg-white rounded-lg"
              onWheel={(e) => {
                // Prevent event from bubbling up to prevent background scroll
                e.stopPropagation()
              }}
            >
              <img
                src={fullscreenImage || "/placeholder.svg"}
                alt="Fullscreen view"
                className="w-full h-auto"
                style={{ minHeight: "100%", objectFit: "contain" }}
              />
            </div>
          </div>
        </div>
      )}
    </>
  )
}
[V0_FILE]typescriptreact:file="components/aso-showcase.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState, useEffect } from "react"
import {
  ChevronLeft,
  ChevronRight,
  Smartphone,
  TrendingUp,
  Target,
  Search,
  BarChart3,
  Zap,
  FileText,
  Maximize2,
  X,
  ExternalLink,
} from "lucide-react"
import { Button } from "@/components/ui/button"

export function ASOShowcase() {
  const [currentSlide, setCurrentSlide] = useState(0)
  const [isFullscreen, setIsFullscreen] = useState(false)
  const [fullscreenImage, setFullscreenImage] = useState("")

  // Prevent body scroll when fullscreen is open
  useEffect(() => {
    if (isFullscreen) {
      document.body.style.overflow = "hidden"
    } else {
      document.body.style.overflow = "unset"
    }

    // Cleanup on unmount
    return () => {
      document.body.style.overflow = "unset"
    }
  }, [isFullscreen])

  const slides = [
    {
      id: 0,
      title: "App Store Optimization Strategy",
      subtitle: "Driving Organic Growth Through Strategic ASO",
      icon: <Smartphone className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-2xl p-8 border border-white/10">
            <h3 className="text-2xl font-bold text-red-400 mb-4">WisdomTree Prime App Store</h3>
            <p className="text-gray-300 text-lg leading-relaxed mb-4">
              Led comprehensive App Store Optimization strategy across Apple App Store and Google Play, driving
              significant organic growth through data-driven keyword optimization and strategic positioning.
            </p>
            <p className="text-gray-300 leading-relaxed mb-6">
              Managed complete app store presence including custom promotional campaigns, localized listings, and
              cross-functional collaboration with Design, Product, Legal, and Compliance to ensure regulatory compliance
              while maximizing discoverability.
            </p>

            {/* App Store Links */}
            <div className="flex flex-wrap gap-4 justify-center">
              <a
                href="https://apps.apple.com/us/app/wisdomtree-prime/id1620597330"
                target="_blank"
                rel="noopener noreferrer"
                className="inline-flex items-center gap-2 px-6 py-3 bg-gradient-to-r from-blue-600 to-blue-800 hover:from-blue-700 hover:to-blue-900 text-white rounded-full font-semibold transition-all duration-300 hover:scale-105 shadow-lg hover:shadow-blue-500/25"
              >
                <span>View on App Store</span>
                <ExternalLink className="w-4 h-4" />
              </a>
              <a
                href="https://play.google.com/store/apps/details?id=com.wisdomtree.wtprime"
                target="_blank"
                rel="noopener noreferrer"
                className="inline-flex items-center gap-2 px-6 py-3 bg-gradient-to-r from-green-600 to-green-800 hover:from-green-700 hover:to-green-900 text-white rounded-full font-semibold transition-all duration-300 hover:scale-105 shadow-lg hover:shadow-green-500/25"
              >
                <span>View on Google Play</span>
                <ExternalLink className="w-4 h-4" />
              </a>
            </div>
          </div>

          {/* App Store Screenshots Grid */}
          <div className="space-y-6">
            <div className="bg-white/5 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-4">Featured App Store Creative Assets</h4>
              <div className="space-y-4">
                <div
                  className="relative cursor-pointer group"
                  onClick={() =>
                    openFullscreen(
                      "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-qIpcIRFnljbiXBdLmcFFZECC2y1I0B.png",
                    )
                  }
                >
                  <img
                    src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-qIpcIRFnljbiXBdLmcFFZECC2y1I0B.png"
                    alt="WisdomTree Prime App Store Screenshots - Earlier Version: $100 Bitcoin Rewards, Portfolio Dashboard, Cross-Chain Transfers, and Digital Assets Access"
                    className="w-full rounded-lg shadow-lg border border-white/10 transition-transform duration-300 group-hover:scale-105"
                  />
                  {/* Expand overlay */}
                  <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all duration-300 flex items-center justify-center opacity-0 group-hover:opacity-100 rounded-lg">
                    <div className="bg-red-500 text-white p-3 rounded-full">
                      <Maximize2 className="w-6 h-6" />
                    </div>
                  </div>
                </div>
                <div
                  className="relative cursor-pointer group"
                  onClick={() =>
                    openFullscreen(
                      "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-7Iu85APeD1QWR8Rc4WhookCKMtpgvm.png",
                    )
                  }
                >
                  <img
                    src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-7Iu85APeD1QWR8Rc4WhookCKMtpgvm.png"
                    alt="WisdomTree Prime App Store Screenshots - Latest Version: Onchain Gold Features, Paycheck Conversion Tools, Account Security Setup, and Enhanced UI"
                    className="w-full rounded-lg shadow-lg border border-white/10 transition-transform duration-300 group-hover:scale-105"
                  />
                  {/* Expand overlay */}
                  <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all duration-300 flex items-center justify-center opacity-0 group-hover:opacity-100 rounded-lg">
                    <div className="bg-red-500 text-white p-3 rounded-full">
                      <Maximize2 className="w-6 h-6" />
                    </div>
                  </div>
                </div>
              </div>
              <div className="text-center mt-4">
                <p className="text-gray-400 text-sm mb-2">Click images to expand to full screen</p>
                <p className="text-gray-500 text-xs">
                  Showing the evolution of app store creative assets from earlier campaigns to current messaging
                </p>
              </div>
            </div>
          </div>

          <div className="grid md:grid-cols-3 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">#1 Rankings</div>
              <div className="text-gray-300 text-sm">Multiple target keywords</div>
            </div>
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">Organic Growth</div>
              <div className="text-gray-300 text-sm">Boosted downloads significantly</div>
            </div>
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">Cross-Platform</div>
              <div className="text-gray-300 text-sm">iOS & Android optimization</div>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 1,
      title: "Keyword Strategy & Research",
      subtitle: "Data-Driven Keyword Optimization",
      icon: <Search className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Strategic Keyword Research & Optimization</h3>
            <p className="text-gray-300 mb-4">
              Leveraged AppTweak and similar ASO tools for comprehensive competitor analysis, keyword discovery, and
              performance tracking to achieve #1 rankings for multiple target keywords.
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">Research & Discovery</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Competitor analysis using AppTweak</li>
                <li>• High-value keyword identification</li>
                <li>• Search volume & difficulty monitoring</li>
                <li>• Market trend analysis</li>
                <li>• Opportunity gap identification</li>
              </ul>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">Implementation & Results</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Achieved #1 rankings for target keywords</li>
                <li>• Continuous refinement over time</li>
                <li>• Performance tracking & iteration</li>
                <li>• Keyword ranking improvements</li>
                <li>• Organic download growth</li>
              </ul>
            </div>
          </div>

          <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Key Focus Areas</h4>
            <div className="grid md:grid-cols-2 gap-4 text-sm text-gray-300">
              <div>
                <strong>Crypto & DeFi Keywords:</strong> Targeting crypto-native audience with relevant financial terms
              </div>
              <div>
                <strong>Traditional Finance:</strong> Bridging TradFi users to digital asset investing
              </div>
              <div>
                <strong>Gold Investment:</strong> Capturing precious metals investment searches
              </div>
              <div>
                <strong>Digital Payments:</strong> Visa debit card and spending functionality
              </div>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 2,
      title: "Metadata & Localization Optimization",
      subtitle: "Global Reach Through Strategic Optimization",
      icon: <Target className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Comprehensive Metadata Strategy</h3>
            <p className="text-gray-300 mb-4">
              Optimized app titles, subtitles, tags, and categories to maximize search visibility and alignment with app
              store algorithms while ensuring global reach through localization.
            </p>
          </div>

          <div className="space-y-4">
            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Metadata Optimization</h4>
              <div className="grid md:grid-cols-2 gap-4">
                <div>
                  <h5 className="text-white font-medium mb-2">App Store Elements</h5>
                  <ul className="space-y-1 text-gray-300 text-sm">
                    <li>• App titles & subtitles</li>
                    <li>• Keyword tags optimization</li>
                    <li>• Category selection strategy</li>
                    <li>• Algorithm alignment</li>
                  </ul>
                </div>
                <div>
                  <h5 className="text-white font-medium mb-2">Search Visibility</h5>
                  <ul className="space-y-1 text-gray-300 text-sm">
                    <li>• Maximum discoverability</li>
                    <li>• Relevant keyword placement</li>
                    <li>• Competitive positioning</li>
                    <li>• Performance monitoring</li>
                  </ul>
                </div>
              </div>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">US Market Focus</h4>
              <div className="grid md:grid-cols-2 gap-4">
                <div>
                  <h5 className="text-white font-medium mb-2">US Market Optimization</h5>
                  <ul className="space-y-1 text-gray-300 text-sm">
                    <li>• US market optimization</li>
                    <li>• Domestic keyword targeting</li>
                    <li>• American audience preferences</li>
                    <li>• US regulatory compliance</li>
                  </ul>
                </div>
                <div>
                  <h5 className="text-white font-medium mb-2">Conversion Optimization</h5>
                  <ul className="space-y-1 text-gray-300 text-sm">
                    <li>• Improved US conversions</li>
                    <li>• Enhanced domestic reach</li>
                    <li>• US market-specific messaging</li>
                    <li>• US regulatory compliance</li>
                  </ul>
                </div>
              </div>
            </div>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10 text-center">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Strategic Impact</h4>
            <p className="text-gray-300 text-sm">
              Comprehensive metadata and localization strategy resulted in improved search rankings, enhanced US market
              penetration, and increased organic downloads domestically.
            </p>
          </div>
        </div>
      ),
    },
    {
      id: 3,
      title: "Visual Asset Optimization & A/B Testing",
      subtitle: "Data-Driven Creative Optimization",
      icon: <BarChart3 className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Creative Asset Strategy & Testing</h3>
            <p className="text-gray-300 mb-4">
              Designed and refined screenshots, icons, and feature graphics through systematic A/B testing to maximize
              click-throughs and installs while maintaining consistent branding across all channels.
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">Visual Asset Optimization</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Screenshot design & refinement</li>
                <li>• App icon optimization</li>
                <li>• Feature graphic creation</li>
                <li>• Consistent brand alignment</li>
                <li>• Cross-channel consistency</li>
                <li>• Click-through maximization</li>
              </ul>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">A/B Testing Framework</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Copy variations testing</li>
                <li>• Screenshot experiments</li>
                <li>• Icon performance analysis</li>
                <li>• Feature graphic optimization</li>
                <li>• Conversion rate tracking</li>
                <li>• Statistical significance validation</li>
              </ul>
            </div>
          </div>

          <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Creative Asset Categories</h4>
            <div className="grid md:grid-cols-3 gap-4 text-sm">
              <div className="bg-white/5 rounded-lg p-3">
                <div className="text-red-400 font-bold mb-1">Gold Investment</div>
                <div className="text-gray-300">Onchain gold token features and pricing</div>
              </div>
              <div className="bg-white/5 rounded-lg p-3">
                <div className="text-red-400 font-bold mb-1">Crypto Features</div>
                <div className="text-gray-300">Bitcoin rewards and crypto functionality</div>
              </div>
              <div className="bg-white/5 rounded-lg p-3">
                <div className="text-red-400 font-bold mb-1">Financial Tools</div>
                <div className="text-gray-300">Dashboard, cross-chain, and Visa card</div>
              </div>
            </div>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10 text-center">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Testing Results</h4>
            <p className="text-gray-300 text-sm">
              Systematic A/B testing of creative assets led to improved conversion rates, higher install rates, and
              better overall app store performance through data-driven optimization.
            </p>
          </div>
        </div>
      ),
    },
    {
      id: 4,
      title: "Crypto-Native App Store Description",
      subtitle: "Regulatory-Compliant Copy Within Strict Length Restrictions",
      icon: <FileText className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-2xl p-8 border border-white/10">
            <h3 className="text-2xl font-bold text-red-400 mb-4">Strategic Copy Optimization</h3>
            <p className="text-gray-300 text-lg leading-relaxed mb-4">
              Crafted crypto-native app store descriptions that clearly and concisely convey the app's features and
              functionality while adhering to strict regulatory guardrails and app store copy length restrictions.
            </p>
            <p className="text-gray-300 leading-relaxed">
              Balanced authentic Web3 terminology with FINRA/SEC compliance requirements, ensuring maximum
              discoverability without compromising regulatory standards or exceeding character limits.
            </p>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl border border-white/10 overflow-hidden">
            <div className="p-4">
              <div
                className="w-full h-[600px] overflow-y-auto bg-white rounded-lg shadow-2xl cursor-pointer group relative"
                style={{
                  scrollbarWidth: "thin",
                  scrollbarColor: "#ef4444 #f1f5f9",
                }}
                onClick={() =>
                  openFullscreen(
                    "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/1000017568.jpg-fTzP0rlIl0P1Em9764qH6SvsjJLMZQ.jpeg",
                  )
                }
              >
                <img
                  src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/1000017568.jpg-fTzP0rlIl0P1Em9764qH6SvsjJLMZQ.jpeg"
                  alt="WisdomTree Prime App Store Description - Complete listing with optimized copy, features, and metadata"
                  className="w-full h-auto transition-transform duration-300 group-hover:scale-105"
                  style={{ minHeight: "100%", objectFit: "contain" }}
                />

                {/* Expand overlay */}
                <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all duration-300 flex items-center justify-center opacity-0 group-hover:opacity-100">
                  <div className="bg-red-500 text-white p-3 rounded-full">
                    <Maximize2 className="w-6 h-6" />
                  </div>
                </div>
              </div>
            </div>

            <div className="px-4 pb-4">
              <p className="text-center text-gray-400 text-sm mb-2">Click image to expand to full screen</p>
              <p className="text-center text-gray-500 text-xs">
                Scroll within the image above to view the complete app store description
              </p>
            </div>
          </div>

          <div className="grid md:grid-cols-3 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">Regulatory</div>
              <div className="text-gray-300 text-sm">FINRA/SEC compliant copy</div>
            </div>
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">Crypto-Native</div>
              <div className="text-gray-300 text-sm">Authentic Web3 terminology</div>
            </div>
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">Optimized</div>
              <div className="text-gray-300 text-sm">Maximum character efficiency</div>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 5,
      title: "Custom Promotional Campaigns",
      subtitle: "Targeted Campaign-Specific Listings",
      icon: <Zap className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Campaign-Specific Store Optimization</h3>
            <p className="text-gray-300 mb-4">
              Created custom promotional store pages tailored for specific audiences and campaigns, integrating with
              broader marketing strategy across social media, email, and web for a unified user journey.
            </p>
          </div>

          <div className="space-y-4">
            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Custom Promotional Features</h4>
              <div className="grid md:grid-cols-2 gap-4">
                <div>
                  <h5 className="text-white font-medium mb-2">Campaign Types</h5>
                  <ul className="space-y-1 text-gray-300 text-sm">
                    <li>• Bitcoin reward promotions</li>
                    <li>• Gold investment campaigns</li>
                    <li>• Visa debit card launches</li>
                    <li>• Cross-chain feature highlights</li>
                  </ul>
                </div>
                <div>
                  <h5 className="text-white font-medium mb-2">Audience Targeting</h5>
                  <ul className="space-y-1 text-gray-300 text-sm">
                    <li>• Crypto-native users</li>
                    <li>• Traditional investors</li>
                    <li>• Gold investment enthusiasts</li>
                    <li>• Digital payment adopters</li>
                  </ul>
                </div>
              </div>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Cross-Functional Integration</h4>
              <div className="grid md:grid-cols-2 gap-4">
                <div>
                  <h5 className="text-white font-medium mb-2">Team Collaboration</h5>
                  <ul className="space-y-1 text-gray-300 text-sm">
                    <li>• Design team coordination</li>
                    <li>• Product team alignment</li>
                    <li>• Compliance team approval</li>
                    <li>• Marketing campaign integration</li>
                  </ul>
                </div>
                <div>
                  <h5 className="text-white font-medium mb-2">Brand Standards</h5>
                  <ul className="space-y-1 text-gray-300 text-sm">
                    <li>• Regulatory compliance (FINRA, SEC)</li>
                    <li>• Brand consistency</li>
                    <li>• Legal review process</li>
                    <li>• Risk management</li>
                  </ul>
                </div>
              </div>
            </div>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10 text-center">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Unified Marketing Strategy</h4>
            <p className="text-gray-300 text-sm">
              Aligned app store content with campaigns across social media, email, and web to create a seamless user
              journey from discovery to download and activation.
            </p>
          </div>
        </div>
      ),
    },
    {
      id: 6,
      title: "Performance Tracking & Results",
      subtitle: "Data-Driven Success Metrics",
      icon: <TrendingUp className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-2xl p-8 border border-white/10">
            <h3 className="text-2xl font-bold text-red-400 mb-4">Measurable ASO Success</h3>
            <p className="text-gray-300 text-lg leading-relaxed mb-4">
              Comprehensive performance tracking and iterative improvements resulted in significant organic growth,
              improved conversion rates, and elevated overall app visibility across both iOS and Android platforms.
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">Key Performance Metrics</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Keyword ranking improvements</li>
                <li>• Conversion rate optimization</li>
                <li>• Install lift analysis</li>
                <li>• Organic download growth</li>
                <li>• App visibility enhancement</li>
                <li>• User acquisition cost reduction</li>
              </ul>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">Strategic Outcomes</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• #1 rankings for multiple target keywords</li>
                <li>• Boosted organic downloads significantly</li>
                <li>• Improved conversion rates</li>
                <li>• Enhanced brand visibility</li>
                <li>• Enhanced US market presence</li>
                <li>• Reduced customer acquisition costs</li>
              </ul>
            </div>
          </div>

          <div className="space-y-4">
            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Continuous Optimization Process</h4>
              <div className="grid md:grid-cols-3 gap-4 text-sm text-gray-300">
                <div>
                  <strong>Monitor:</strong> Track keyword rankings, conversion rates, and competitor movements
                </div>
                <div>
                  <strong>Analyze:</strong> Identify optimization opportunities and performance gaps
                </div>
                <div>
                  <strong>Iterate:</strong> Implement improvements and measure impact
                </div>
              </div>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Reputation Management</h4>
              <div className="grid md:grid-cols-2 gap-4 text-sm text-gray-300">
                <div>
                  <strong>User Feedback:</strong> Prompt responses to reviews and ratings
                </div>
                <div>
                  <strong>Brand Protection:</strong> Proactive reputation management
                </div>
                <div>
                  <strong>Review Strategy:</strong> Encouraging positive user reviews
                </div>
                <div>
                  <strong>Issue Resolution:</strong> Quick response to user concerns
                </div>
              </div>
            </div>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10 text-center">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Strategic Impact Summary</h4>
            <p className="text-gray-300 text-sm mb-4">
              The comprehensive ASO strategy delivered measurable results: achieved #1 keyword rankings, significantly
              boosted organic downloads, improved conversion rates, and established WisdomTree Prime as a leading
              fintech app in the digital asset space.
            </p>

            {/* App Store Links in Results Section */}
            <div className="flex flex-wrap gap-3 justify-center">
              <a
                href="https://apps.apple.com/us/app/wisdomtree-prime/id1620597330"
                target="_blank"
                rel="noopener noreferrer"
                className="inline-flex items-center gap-2 px-4 py-2 bg-gradient-to-r from-blue-600 to-blue-800 hover:from-blue-700 hover:to-blue-900 text-white rounded-full text-sm font-semibold transition-all duration-300 hover:scale-105 shadow-lg hover:shadow-blue-500/25"
              >
                <span>App Store</span>
                <ExternalLink className="w-3 h-3" />
              </a>
              <a
                href="https://play.google.com/store/apps/details?id=com.wisdomtree.wtprime"
                target="_blank"
                rel="noopener noreferrer"
                className="inline-flex items-center gap-2 px-4 py-2 bg-gradient-to-r from-green-600 to-green-800 hover:from-green-700 hover:to-green-900 text-white rounded-full text-sm font-semibold transition-all duration-300 hover:scale-105 shadow-lg hover:shadow-green-500/25"
              >
                <span>Google Play</span>
                <ExternalLink className="w-3 h-3" />
              </a>
            </div>
          </div>
        </div>
      ),
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  const openFullscreen = (image: string) => {
    setFullscreenImage(image)
    setIsFullscreen(true)
  }

  const closeFullscreen = () => {
    setIsFullscreen(false)
    setFullscreenImage("")
  }

  return (
    <>
      <section id="aso-showcase" className="py-20 bg-black">
        <div className="max-w-6xl mx-auto px-4">
          <div className="text-center mb-16">
            <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
              App Store Optimization
            </h2>
            <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
            <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
              Strategic ASO management for WisdomTree Prime across iOS and Android, driving organic growth through
              data-driven optimization and creative excellence
            </p>
          </div>

          <div className="max-w-4xl mx-auto">
            <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 overflow-hidden">
              {/* Slide Header */}
              <div className="bg-gradient-to-r from-red-500/20 to-red-600/20 p-6 border-b border-white/10">
                <div className="flex items-center gap-4 mb-2">
                  <div className="p-2 bg-white/10 rounded-lg">{slides[currentSlide].icon}</div>
                  <div>
                    <h3 className="text-2xl font-bold text-red-400">{slides[currentSlide].title}</h3>
                    <p className="text-gray-300">{slides[currentSlide].subtitle}</p>
                  </div>
                </div>
              </div>

              {/* Slide Content */}
              <div className="p-8 min-h-[500px]">{slides[currentSlide].content}</div>

              {/* Navigation */}
              <div className="p-6 border-t border-white/10 bg-white/5">
                <div className="flex items-center justify-between">
                  <Button
                    onClick={prevSlide}
                    variant="outline"
                    className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                    disabled={currentSlide === 0}
                  >
                    <ChevronLeft className="w-4 h-4 mr-2" />
                    Previous
                  </Button>

                  {/* Slide Indicators */}
                  <div className="flex gap-2">
                    {slides.map((_, index) => (
                      <button
                        key={index}
                        onClick={() => goToSlide(index)}
                        className={`w-3 h-3 rounded-full transition-all duration-300 ${
                          index === currentSlide
                            ? "bg-gradient-to-r from-red-500 to-red-600"
                            : "bg-white/20 hover:bg-white/40"
                        }`}
                      />
                    ))}
                  </div>

                  <Button
                    onClick={nextSlide}
                    variant="outline"
                    className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                    disabled={currentSlide === slides.length - 1}
                  >
                    Next
                    <ChevronRight className="w-4 h-4 ml-2" />
                  </Button>
                </div>

                <div className="text-center mt-4 text-gray-400 text-sm">
                  Slide {currentSlide + 1} of {slides.length}
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>

      {/* Fullscreen Modal */}
      {isFullscreen && (
        <div className="fixed inset-0 bg-black/95 z-50 flex items-center justify-center p-4">
          <div className="relative w-full h-full max-w-7xl max-h-full">
            <button
              onClick={closeFullscreen}
              className="absolute top-4 right-4 z-10 bg-red-500 hover:bg-red-600 text-white p-2 rounded-full transition-colors duration-300"
            >
              <X className="w-6 h-6" />
            </button>

            <div
              className="w-full h-full overflow-auto bg-white rounded-lg"
              onWheel={(e) => {
                // Prevent event from bubbling up to prevent background scroll
                e.stopPropagation()
              }}
            >
              <img
                src={fullscreenImage || "/placeholder.svg"}
                alt="Fullscreen view"
                className="w-full h-auto"
                style={{ minHeight: "100%", objectFit: "contain" }}
              />
            </div>
          </div>
        </div>
      )}
    </>
  )
}
[V0_FILE]typescriptreact:file="components/crypto-copywriting.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState, useEffect } from "react"
import { ChevronLeft, ChevronRight, Maximize2, X, FileText } from "lucide-react"
import { Button } from "@/components/ui/button"

export function CryptoCopywriting() {
  const [currentSlide, setCurrentSlide] = useState(0)
  const [isFullscreen, setIsFullscreen] = useState(false)
  const [fullscreenImage, setFullscreenImage] = useState("")

  // Prevent body scroll when fullscreen is open
  useEffect(() => {
    if (isFullscreen) {
      document.body.style.overflow = "hidden"
    } else {
      document.body.style.overflow = "unset"
    }

    // Cleanup on unmount
    return () => {
      document.body.style.overflow = "unset"
    }
  }, [isFullscreen])

  const slides = [
    {
      id: 0,
      title: "Original WisdomTree Homepage",
      subtitle: "Traditional Fintech Messaging",
      description:
        "The original homepage used conventional financial services language with promotional offers and traditional marketing approaches that didn't authentically connect with crypto-native audiences.",
      image: "/images/wisdomtree-original.png",
      keyPoints: [
        "'The future of finance is here' - generic fintech messaging",
        "Promotional offers like 'Get $100 in Bitcoin!'",
        "Traditional financial services tone and design",
        "Corporate marketing approach with multiple CTAs",
      ],
    },
    {
      id: 1,
      title: "Crypto-Native Rewrite",
      subtitle: "Web3-Focused Messaging & Positioning",
      description:
        "My rewrite transformed the messaging to speak directly to crypto natives with authentic Web3 language and positioning.",
      image: "/images/wisdomtree-crypto-native.png",
      keyPoints: [
        "'Wisdom Is Your Edge' - powerful, direct messaging",
        "Onchain assets, composable, transparent language",
        "DeFi and Web3 terminology throughout",
        "Crypto-native value propositions",
      ],
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const openFullscreen = (image: string) => {
    setFullscreenImage(image)
    setIsFullscreen(true)
  }

  const closeFullscreen = () => {
    setIsFullscreen(false)
    setFullscreenImage("")
  }

  return (
    <>
      <section id="crypto-copywriting" className="py-20 bg-black">
        <div className="max-w-6xl mx-auto px-4">
          <div className="text-center mb-16">
            <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
              Crypto Native Copywriting
            </h2>
            <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
            <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
              Transforming traditional fintech messaging into authentic crypto-native language that resonates with Web3
              audiences
            </p>
          </div>

          <div className="max-w-5xl mx-auto">
            <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 overflow-hidden">
              {/* Slide Header */}
              <div className="bg-gradient-to-r from-red-500/20 to-red-600/20 p-6 border-b border-white/10">
                <div className="flex items-center gap-4 mb-2">
                  <div className="p-2 bg-white/10 rounded-lg">
                    <FileText className="w-6 h-6" />
                  </div>
                  <div className="flex-1">
                    <h3 className="text-2xl font-bold text-red-400">{slides[currentSlide].title}</h3>
                    <p className="text-gray-300">{slides[currentSlide].subtitle}</p>
                  </div>
                  <div className="text-sm text-gray-400">
                    {currentSlide + 1} of {slides.length}
                  </div>
                </div>
              </div>

              {/* Slide Content */}
              <div className="p-8">
                <div className="grid lg:grid-cols-2 gap-8 items-start">
                  {/* Description & Key Points */}
                  <div className="space-y-6">
                    <div className="bg-white/5 rounded-xl p-6 border border-white/10">
                      <h4 className="text-lg font-semibold text-white mb-3">Overview</h4>
                      <p className="text-gray-300 leading-relaxed">{slides[currentSlide].description}</p>
                    </div>

                    <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
                      <h4 className="text-lg font-semibold text-red-400 mb-4">Key Elements</h4>
                      <ul className="space-y-3">
                        {slides[currentSlide].keyPoints.map((point, index) => (
                          <li key={index} className="flex items-start gap-3">
                            <div className="w-2 h-2 bg-red-500 rounded-full mt-2 flex-shrink-0" />
                            <span className="text-gray-300 text-sm">{point}</span>
                          </li>
                        ))}
                      </ul>
                    </div>

                    {currentSlide === 1 && (
                      <div className="bg-white/5 rounded-xl p-6 border border-white/10">
                        <h4 className="text-lg font-semibold text-white mb-3">Impact</h4>
                        <p className="text-gray-300 text-sm leading-relaxed">
                          The crypto-native rewrite positioned WisdomTree Prime as a Web3-first platform, using
                          authentic terminology that crypto natives understand and trust. This approach bridges
                          traditional finance with DeFi, speaking to both audiences effectively.
                        </p>
                      </div>
                    )}
                  </div>

                  {/* Scrollable Image */}
                  <div className="space-y-4">
                    <div className="relative">
                      <div
                        className="w-full h-[600px] overflow-y-auto bg-white rounded-xl shadow-2xl border-2 border-white/10 cursor-pointer group"
                        style={{
                          scrollbarWidth: "thin",
                          scrollbarColor: "#ef4444 #f1f5f9",
                        }}
                        onClick={() => openFullscreen(slides[currentSlide].image)}
                      >
                        <img
                          src={slides[currentSlide].image || "/placeholder.svg"}
                          alt={slides[currentSlide].title}
                          className="w-full h-auto transition-transform duration-300 group-hover:scale-105"
                          style={{ minHeight: "100%", objectFit: "contain" }}
                        />

                        {/* Expand overlay */}
                        <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all duration-300 flex items-center justify-center opacity-0 group-hover:opacity-100">
                          <div className="bg-red-500 text-white p-3 rounded-full">
                            <Maximize2 className="w-6 h-6" />
                          </div>
                        </div>
                      </div>
                    </div>

                    <div className="text-center">
                      <p className="text-gray-400 text-sm mb-2">Click image to expand to full screen</p>
                      <p className="text-gray-500 text-xs">Scroll within the image above to view the complete page</p>
                    </div>
                  </div>
                </div>
              </div>

              {/* Navigation */}
              <div className="p-6 border-t border-white/10 bg-white/5">
                <div className="flex items-center justify-between">
                  <Button
                    onClick={prevSlide}
                    variant="outline"
                    className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                    disabled={currentSlide === 0}
                  >
                    <ChevronLeft className="w-4 h-4 mr-2" />
                    Previous
                  </Button>

                  {/* Slide Indicators */}
                  <div className="flex gap-2">
                    {slides.map((_, index) => (
                      <button
                        key={index}
                        onClick={() => setCurrentSlide(index)}
                        className={`w-3 h-3 rounded-full transition-all duration-300 ${
                          index === currentSlide
                            ? "bg-gradient-to-r from-red-500 to-red-600"
                            : "bg-white/20 hover:bg-white/40"
                        }`}
                      />
                    ))}
                  </div>

                  <Button
                    onClick={nextSlide}
                    variant="outline"
                    className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                    disabled={currentSlide === slides.length - 1}
                  >
                    Next
                    <ChevronRight className="w-4 h-4 ml-2" />
                  </Button>
                </div>
              </div>
            </div>

            {/* Comparison Summary */}
            <div className="mt-12 bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-2xl p-8 border border-white/10">
              <h3 className="text-2xl font-bold text-red-400 mb-6 text-center">Transformation Summary</h3>
              <div className="grid md:grid-cols-2 gap-8">
                <div className="space-y-4">
                  <h4 className="text-lg font-semibold text-white">Before: Traditional Fintech</h4>
                  <ul className="space-y-2 text-gray-300 text-sm">
                    <li>• Generic "better system" messaging</li>
                    <li>• Corporate financial services tone</li>
                    <li>• Limited crypto terminology</li>
                    <li>• Traditional value propositions</li>
                  </ul>
                </div>
                <div className="space-y-4">
                  <h4 className="text-lg font-semibold text-white">After: Crypto-Native</h4>
                  <ul className="space-y-2 text-gray-300 text-sm">
                    <li>• Direct, powerful "Wisdom Is Your Edge"</li>
                    <li>• Authentic Web3 language throughout</li>
                    <li>• Onchain, composable, DeFi terminology</li>
                    <li>• Crypto-native value propositions</li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>

      {/* Fullscreen Modal */}
      {isFullscreen && (
        <div className="fixed inset-0 bg-black/95 z-50 flex items-center justify-center p-4">
          <div className="relative w-full h-full max-w-7xl max-h-full">
            <button
              onClick={closeFullscreen}
              className="absolute top-4 right-4 z-10 bg-red-500 hover:bg-red-600 text-white p-2 rounded-full transition-colors duration-300"
            >
              <X className="w-6 h-6" />
            </button>

            <div
              className="w-full h-full overflow-auto bg-white rounded-lg"
              onWheel={(e) => {
                // Prevent event from bubbling up to prevent background scroll
                e.stopPropagation()
              }}
            >
              <img
                src={fullscreenImage || "/placeholder.svg"}
                alt="Fullscreen view"
                className="w-full h-auto"
                style={{ minHeight: "100%", objectFit: "contain" }}
              />
            </div>
          </div>
        </div>
      )}
    </>
  )
}
[V0_FILE]typescriptreact:file="components/case-study.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState, useEffect } from "react"
import { ChevronLeft, ChevronRight, Brain, Search, Target, Volume2, Maximize2, X } from "lucide-react"
import { Button } from "@/components/ui/button"

export function CaseStudy() {
  const [currentSlide, setCurrentSlide] = useState(0)
  const [isFullscreen, setIsFullscreen] = useState(false)
  const [fullscreenImage, setFullscreenImage] = useState("")

  // Prevent body scroll when fullscreen is open
  useEffect(() => {
    if (isFullscreen) {
      document.body.style.overflow = "hidden"
    } else {
      document.body.style.overflow = "unset"
    }

    // Cleanup on unmount
    return () => {
      document.body.style.overflow = "unset"
    }
  }, [isFullscreen])

  const slides = [
    {
      id: 0,
      title: "Strategic Ticker Branding Framework",
      subtitle: "Systematic Approach to Financial Product Naming",
      icon: <Target className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-2xl p-8 border border-white/10">
            <h3 className="text-2xl font-bold text-red-400 mb-4">The Strategic Challenge</h3>
            <p className="text-gray-300 text-lg leading-relaxed mb-4">
              Ticker symbols are more than just identifiers—they're the first impression, the mental anchor, and the
              trust signal for financial products. Every character matters.
            </p>
            <p className="text-gray-300 leading-relaxed">
              I developed a comprehensive framework combining psychology, linguistics, and market dynamics to optimize
              ticker selection across multiple WisdomTree products.
            </p>
          </div>

          <div className="grid md:grid-cols-3 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">USDW vs WTUSD</div>
              <div className="text-gray-300 text-sm">Stablecoin Strategy</div>
            </div>
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">CRDT vs CRDY</div>
              <div className="text-gray-300 text-sm">Credit Product Positioning</div>
            </div>
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20 text-center">
              <div className="text-2xl font-bold text-red-400 mb-2">EPIC vs WEPI</div>
              <div className="text-gray-300 text-sm">Equity Fund Branding</div>
            </div>
          </div>

          <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
            <h4 className="text-lg font-semibold text-red-400 mb-3">My Analytical Framework</h4>
            <div className="grid md:grid-cols-2 gap-4 text-sm text-gray-300">
              <div>• Market Alignment & Pattern Recognition</div>
              <div>• Cognitive Fluency & Processing Speed</div>
              <div>• Sound Symbolism & Emotional Resonance</div>
              <div>• Phonetic Intensity & Trust Signals</div>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 1,
      title: "USDW vs WTUSD: Stablecoin Strategy",
      subtitle: "Market Alignment & Trust Patterns",
      icon: <Target className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">The USD Pattern Advantage</h3>
            <p className="text-gray-300 mb-4">
              Dominant stablecoin naming follows a clear convention that users trust and recognize instantly.
            </p>
            <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
              {["USDC", "USDT", "USDG", "USD1"].map((ticker) => (
                <div key={ticker} className="bg-red-500/20 rounded-lg p-3 text-center border border-red-500/30">
                  <div className="text-red-400 font-bold">{ticker}</div>
                </div>
              ))}
            </div>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">USDW Advantages</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Chunked as "USD + W"</li>
                <li>• Vowel-led, familiar pattern</li>
                <li>• 6 syllables, easy flow</li>
                <li>• Instant category recognition</li>
                <li>• Groups with trusted stables</li>
              </ul>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">WTUSD Challenges</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Consonant cluster start</li>
                <li>• 7 syllables, harder parsing</li>
                <li>• Breaks expected pattern</li>
                <li>• Lower discoverability</li>
                <li>• Requires exact search</li>
              </ul>
            </div>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Strategic Outcome</h4>
            <p className="text-gray-300 text-sm">
              <strong>Recommendation: USDW</strong> - Aligns with how humans think, speak, scan, and trust. Category
              clarity first, brand differentiation second.
            </p>
          </div>
        </div>
      ),
    },
    {
      id: 2,
      title: "CRDT vs CRDY: Credit Product Analysis",
      subtitle: "Sound Symbolism & Institutional Trust",
      icon: <Volume2 className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Market Alignment Analysis</h3>
            <p className="text-gray-300 mb-4">
              Both CRDT and CRDY are direct plays on "credit," but their sound, structure, and associations create
              different impressions that matter for institutional branding.
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">CRDT: Sharp Authority</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Hard "T" stop - clean, precise, assertive</li>
                <li>• Aligns with institutional naming trends</li>
                <li>• Firm mouth closure reinforces control</li>
                <li>• Sharp, clipped authority</li>
                <li>• Trust, fluency, professionalism</li>
              </ul>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">CRDY: Softer Approach</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Soft "Y" vowel glide - rounds off energy</li>
                <li>• Opens door to unwanted phonetic slippage</li>
                <li>• Softened ending creates negative homophone risk</li>
                <li>• Less emotional authority</li>
                <li>• Uncertainty, softness, lower recall</li>
              </ul>
            </div>
          </div>

          <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Bouba/Kiki Effect Applied</h4>
            <p className="text-gray-300 text-sm mb-3">
              Research shows sharp sounds are associated with precision and power, while soft sounds suggest passivity
              and lower energy.
            </p>
            <div className="grid md:grid-cols-2 gap-4 text-sm">
              <div className="text-gray-300">
                <strong>CRDT:</strong> Sharp consonants, clear finish, hard stop
              </div>
              <div className="text-gray-300">
                <strong>CRDY:</strong> Angular sounds with soft ending
              </div>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 3,
      title: "EPIC vs WEPI: Equity Fund Positioning",
      subtitle: "Emotional Resonance & Narrative Fit",
      icon: <Brain className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Emotional Resonance Analysis</h3>
            <p className="text-gray-300 mb-4">
              EPIC is powerful, high-fluency, and aspirational. It has brand narrative baked in: bold, memorable, and a
              natural shorthand for a product that aims to define advanced equity income.
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">EPIC: Bold & Energetic</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Strong lip pop with "P"</li>
                <li>• Open "EH" vowel (used in happy expressions)</li>
                <li>• Sharp "K" close that reinforces control</li>
                <li>• Energized articulation = energized perception</li>
                <li>• Clarity, recall, confidence</li>
              </ul>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">WEPI: Soft & Forgettable</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Rounded lips with "W" (like blowing or sighing)</li>
                <li>• Trailing "I" that drifts rather than lands</li>
                <li>• Doesn't land — it leaks</li>
                <li>• Rounded, soft-like shape = low emotional payoff</li>
                <li>• Low signal strength, weaker trust profile</li>
              </ul>
            </div>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10 text-center">
            <h4 className="text-lg font-semibold text-red-400 mb-3">Neuroscience of Sound & Meaning</h4>
            <p className="text-gray-300 text-sm mb-3">
              Research shows high-energy phonemes like "P" and "K" stimulate dopaminergic reward centers in the brain,
              while soft sounds activate emotional associations of sadness or fragility.
            </p>
            <div className="text-center">
              <div className="text-red-400 font-bold">EPIC lights up reward circuits — it feels good to say</div>
              <div className="text-gray-400 text-sm mt-2">
                WEPI has no such impact. Worse, it sounds like "weepy" — not ideal for fund marketing.
              </div>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 4,
      title: "Phonetic Intensity & Linguistic Trust",
      subtitle: "The Science Behind Sound Perception",
      icon: <Search className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Cross-Analysis Patterns</h3>
            <p className="text-gray-300 mb-4">
              Consistent patterns emerge across all three ticker analyses, validating the strategic framework.
            </p>
          </div>

          <div className="grid gap-6">
            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Phonetic Intensity Research</h4>
              <p className="text-gray-300 text-sm mb-3">
                Studies show that fluency directly influences risk perception, recall, and brand credibility. Names that
                are easier to pronounce are judged as more familiar, credible, and safe.
              </p>
              <div className="grid md:grid-cols-3 gap-4 text-sm">
                <div className="bg-white/5 rounded-lg p-3">
                  <div className="text-red-400 font-bold">USDW</div>
                  <div className="text-gray-300">Tightly constructed, clear rhythm</div>
                </div>
                <div className="bg-white/5 rounded-lg p-3">
                  <div className="text-red-400 font-bold">CRDT</div>
                  <div className="text-gray-300">Sharp, precise, authoritative</div>
                </div>
                <div className="bg-white/5 rounded-lg p-3">
                  <div className="text-red-400 font-bold">EPIC</div>
                  <div className="text-gray-300">Bold, energetic, commanding</div>
                </div>
              </div>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Embodied Cognition Impact</h4>
              <p className="text-gray-300 text-sm mb-3">
                How we physically produce sounds affects how we emotionally interpret them. Firm mouth closures suggest
                control and precision, while open glides can suggest uncertainty.
              </p>
              <div className="grid md:grid-cols-2 gap-4 text-sm text-gray-300">
                <div>
                  <strong>Winning Patterns:</strong>
                  <br />• Sharp consonants and clear stops
                  <br />• Familiar phonetic structures
                  <br />• Strong articulatory gestures
                </div>
                <div>
                  <strong>Avoid:</strong>
                  <br />• Soft endings and vowel glides
                  <br />• Consonant clusters at start
                  <br />• Homophone risks
                </div>
              </div>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 5,
      title: "USDW vs WTUSD: Complete Analysis Document",
      subtitle: "Full Strategic Breakdown & Email Communication",
      icon: <Brain className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Original Strategic Analysis Email</h3>
            <p className="text-gray-300 mb-4">
              The complete email analysis that led to the USDW recommendation, including market alignment research,
              cognitive fluency theory, and comprehensive linguistic analysis.
            </p>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl border border-white/10 overflow-hidden">
            <div className="p-4">
              <div
                className="w-full h-[600px] overflow-y-auto bg-white rounded-lg shadow-2xl cursor-pointer group relative"
                style={{
                  scrollbarWidth: "thin",
                  scrollbarColor: "#ef4444 #f1f5f9",
                }}
                onClick={() => openFullscreen("/images/usdw-complete-analysis.png")}
              >
                <img
                  src="/images/usdw-complete-analysis.png"
                  alt="Complete USDW vs WTUSD Strategic Analysis Email"
                  className="w-full h-auto transition-transform duration-300 group-hover:scale-105"
                  style={{ minHeight: "100%", objectFit: "contain" }}
                />

                {/* Expand overlay */}
                <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all duration-300 flex items-center justify-center opacity-0 group-hover:opacity-100">
                  <div className="bg-red-500 text-white p-3 rounded-full">
                    <Maximize2 className="w-6 h-6" />
                  </div>
                </div>
              </div>
            </div>

            <div className="px-4 pb-4">
              <p className="text-center text-gray-400 text-sm mb-2">Click image to expand to full screen</p>
              <p className="text-center text-gray-500 text-xs">
                Scroll within the image above to view the complete document
              </p>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 6,
      title: "CRDT vs CRDY and EPIC vs WEPI Analysis",
      subtitle: "Complete Strategic Breakdown & Email Communication",
      icon: <Brain className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Original Strategic Analysis Email</h3>
            <p className="text-gray-300 mb-4">
              The complete email analysis covering both CRDT vs CRDY and EPIC vs WEPI. This document shows the detailed
              sound symbolism research, Bouba/Kiki effect application, and embodied cognition analysis that led to both
              the CRDT and EPIC recommendations.
            </p>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl border border-white/10 overflow-hidden">
            <div className="p-4">
              <div
                className="w-full h-[600px] overflow-y-auto bg-white rounded-lg shadow-2xl cursor-pointer group relative"
                style={{
                  scrollbarWidth: "thin",
                  scrollbarColor: "#ef4444 #f1f5f9",
                }}
                onClick={() => openFullscreen("/images/crdt-epic-analysis.png")}
              >
                <img
                  src="/images/crdt-epic-analysis.png"
                  alt="Complete CRDT vs CRDY and EPIC vs WEPI Strategic Analysis Email"
                  className="w-full h-auto transition-transform duration-300 group-hover:scale-105"
                  style={{ minHeight: "100%", objectFit: "contain" }}
                />

                {/* Expand overlay */}
                <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-all duration-300 flex items-center justify-center opacity-0 group-hover:opacity-100">
                  <div className="bg-red-500 text-white p-3 rounded-full">
                    <Maximize2 className="w-6 h-6" />
                  </div>
                </div>
              </div>
            </div>

            <div className="px-4 pb-4">
              <p className="text-center text-gray-400 text-sm mb-2">Click image to expand to full screen</p>
              <p className="text-center text-gray-500 text-xs">
                Scroll within the image above to view the complete document
              </p>
            </div>
          </div>
        </div>
      ),
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  const openFullscreen = (image: string) => {
    setFullscreenImage(image)
    setIsFullscreen(true)
  }

  const closeFullscreen = () => {
    setIsFullscreen(false)
    setFullscreenImage("")
  }

  return (
    <>
      <section id="case-study" className="py-20 bg-black">
        <div className="max-w-6xl mx-auto px-4">
          <div className="text-center mb-16">
            <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
              Strategic Ticker Branding
            </h2>
            <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
            <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
              Comprehensive analysis of ticker optimization across multiple WisdomTree products, combining psychology,
              linguistics, and market dynamics
            </p>
          </div>

          <div className="max-w-4xl mx-auto">
            <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 overflow-hidden">
              {/* Slide Header */}
              <div className="bg-gradient-to-r from-red-500/20 to-red-600/20 p-6 border-b border-white/10">
                <div className="flex items-center gap-4 mb-2">
                  <div className="p-2 bg-white/10 rounded-lg">{slides[currentSlide].icon}</div>
                  <div>
                    <h3 className="text-2xl font-bold text-red-400">{slides[currentSlide].title}</h3>
                    <p className="text-gray-300">{slides[currentSlide].subtitle}</p>
                  </div>
                </div>
              </div>

              {/* Slide Content */}
              <div className="p-8 min-h-[500px]">{slides[currentSlide].content}</div>

              {/* Navigation */}
              <div className="p-6 border-t border-white/10 bg-white/5">
                <div className="flex items-center justify-between">
                  <Button
                    onClick={prevSlide}
                    variant="outline"
                    className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                    disabled={currentSlide === 0}
                  >
                    <ChevronLeft className="w-4 h-4 mr-2" />
                    Previous
                  </Button>

                  {/* Slide Indicators */}
                  <div className="flex gap-2">
                    {slides.map((_, index) => (
                      <button
                        key={index}
                        onClick={() => goToSlide(index)}
                        className={`w-3 h-3 rounded-full transition-all duration-300 ${
                          index === currentSlide
                            ? "bg-gradient-to-r from-red-500 to-red-600"
                            : "bg-white/20 hover:bg-white/40"
                        }`}
                      />
                    ))}
                  </div>

                  <Button
                    onClick={nextSlide}
                    variant="outline"
                    className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                    disabled={currentSlide === slides.length - 1}
                  >
                    Next
                    <ChevronRight className="w-4 h-4 ml-2" />
                  </Button>
                </div>

                <div className="text-center mt-4 text-gray-400 text-sm">
                  Slide {currentSlide + 1} of {slides.length}
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>

      {/* Fullscreen Modal */}
      {isFullscreen && (
        <div className="fixed inset-0 bg-black/95 z-50 flex items-center justify-center p-4">
          <div className="relative w-full h-full max-w-7xl max-h-full">
            <button
              onClick={closeFullscreen}
              className="absolute top-4 right-4 z-10 bg-red-500 hover:bg-red-600 text-white p-2 rounded-full transition-colors duration-300"
            >
              <X className="w-6 h-6" />
            </button>

            <div
              className="w-full h-full overflow-auto bg-white rounded-lg"
              onWheel={(e) => {
                // Prevent event from bubbling up to prevent background scroll
                e.stopPropagation()
              }}
            >
              <img
                src={fullscreenImage || "/placeholder.svg"}
                alt="Fullscreen view"
                className="w-full h-auto"
                style={{ minHeight: "100%", objectFit: "contain" }}
              />
            </div>
          </div>
        </div>
      )}
    </>
  )
}
[V0_FILE]typescriptreact:file="components/geo-strategy.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState } from "react"
import { ChevronLeft, ChevronRight, Lightbulb, TrendingUp, Search, Zap, Brain, Target } from "lucide-react"
import { Button } from "@/components/ui/button"

export function GeoStrategy() {
  const [currentSlide, setCurrentSlide] = useState(0)

  const slides = [
    {
      id: 0,
      title: "Strategic Initiative: The AI Discovery Shift",
      subtitle: "Identifying the Future Before It Arrives",
      icon: <Lightbulb className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-2xl p-8 border border-white/10">
            <h3 className="text-2xl font-bold text-red-400 mb-4">The Insight</h3>
            <p className="text-gray-300 text-lg leading-relaxed mb-4">
              "AI is fundamentally changing how people discover content and products. I'd like us to get ahead of this
              shift with a thoughtful, informed strategy."
            </p>
            <p className="text-gray-300 leading-relaxed">
              Instead of scrolling through search results, users are relying on AI-generated answers, summaries, and
              recommendations. This trend is already impacting organic traffic and will only accelerate.
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <div className="text-3xl font-bold text-red-400 mb-2">Before</div>
              <div className="text-gray-300 text-sm">Traditional SEO mindset</div>
            </div>
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <div className="text-3xl font-bold text-red-400 mb-2">After</div>
              <div className="text-gray-300 text-sm">GEO/LLMO strategy</div>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 1,
      title: "Strategic Questions Framework",
      subtitle: "Comprehensive Research Approach",
      icon: <Search className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">My Strategic Research Framework</h3>
            <p className="text-gray-300 mb-4">
              I developed a comprehensive approach to understand and leverage the shift from SEO to GEO:
            </p>
          </div>

          <div className="grid gap-6">
            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">1. Understanding GEO/LLMO</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• How to optimize for AI-generated answers (ChatGPT, Google AI, Perplexity)</li>
                <li>• Factors that increase content citation likelihood</li>
                <li>• Tools and plugins for GEO optimization</li>
              </ul>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">2. ASO Evolution Impact</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• How AI results affect app store listings</li>
                <li>• Crossover between ASO and GEO strategies</li>
                <li>• Future of app discovery</li>
              </ul>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">3. Success Metrics & Best Practices</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Emerging GEO best practices identification</li>
                <li>• Competitive analysis of early adopters</li>
                <li>• Actionable implementation roadmap</li>
              </ul>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 2,
      title: "The Challenge: Black Box Problem",
      subtitle: "Understanding the Complexity",
      icon: <Brain className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Two Fundamental Problems Identified</h3>
            <p className="text-gray-300 mb-4">
              Our research revealed why GEO/LLMO is so challenging compared to traditional SEO:
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">Problem 1: Attribution Mystery</h4>
              <p className="text-gray-300 text-sm mb-3">
                Deciphering the black box of LLM sourcing to correctly attribute citations and references.
              </p>
              <div className="text-xs text-gray-400">Unlike SEO's clear rules, LLMs operate probabilistically</div>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-3">Problem 2: Training Data Opacity</h4>
              <p className="text-gray-300 text-sm mb-3">
                Understanding vector, timing, and frequency of training data and live search functions.
              </p>
              <div className="text-xs text-gray-400">Pattern-based vs deterministic outcomes</div>
            </div>
          </div>

          <div className="bg-gradient-to-br from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
            <h4 className="text-lg font-semibold text-red-400 mb-3">The "Wild West" Phase</h4>
            <p className="text-gray-300 text-sm">
              We're in an ambiguous phase where lack of transparency makes it difficult to plan or optimize confidently.
              LLM providers will eventually need to provide structured guidance similar to how search engines matured.
            </p>
          </div>
        </div>
      ),
    },
    {
      id: 3,
      title: "Tactical Solutions Discovered",
      subtitle: "LLM-Specific Growth Hacks",
      icon: <Zap className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-white/5 rounded-xl p-6 border border-white/10">
            <h3 className="text-xl font-bold text-red-400 mb-4">Emerging GEO Tactics</h3>
            <p className="text-gray-300 mb-4">
              While foundational content strategy remains king, I identified specific LLM optimization tactics:
            </p>
          </div>

          <div className="space-y-4">
            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">1. Press Release Networks</h4>
              <p className="text-gray-300 text-sm mb-2">
                LLMs prioritize content labeled as "press releases" from authoritative sources.
              </p>
              <div className="text-xs text-gray-400">
                Strategy: Distribute interconnected press releases across partner networks
              </div>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">2. Pattern Density Saturation</h4>
              <p className="text-gray-300 text-sm mb-2">
                LLMs are pattern recognition engines - republishing across multiple platforms increases indexing
                frequency.
              </p>
              <div className="text-xs text-gray-400">
                Platforms: WisdomTreePrime.com, Mirror.xyz, Medium, Substack, etc.
              </div>
            </div>

            <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-red-400 mb-3">3. Direct OpenAI Listing</h4>
              <p className="text-gray-300 text-sm mb-2">
                Proactive approach to list funds, app, services, and data platforms directly with OpenAI.
              </p>
              <div className="text-xs text-gray-400">Early adoption of ChatGPT Search Product Discovery</div>
            </div>
          </div>
        </div>
      ),
    },
    {
      id: 4,
      title: "Competitive Advantage: BI Tool Access",
      subtitle: "Peeling Back the LLM Layers",
      icon: <Target className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-2xl p-8 border border-white/10">
            <h3 className="text-2xl font-bold text-red-400 mb-4">The Solution</h3>
            <p className="text-gray-300 text-lg leading-relaxed">
              Access to a business intelligence tool specifically designed to map LLM sourcing and attribution
              preferences - essentially a "prompt-to-source visibility layer."
            </p>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-white/5 rounded-xl p-6 border border-white/10">
              <h4 className="text-lg font-semibold text-white mb-3">What This Enables</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Peek into the LLM "black box"</li>
                <li>• Map sourcing preferences</li>
                <li>• Understand attribution patterns</li>
                <li>• Optimize content strategy accordingly</li>
              </ul>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-semibold text-red-400 mb-3">Strategic Position</h4>
              <p className="text-gray-300 text-sm">
                "We are ahead of most and are in an excellent position to path-find a way through this unexplored
                territory."
              </p>
            </div>
          </div>

          <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10 text-center">
            <h4 className="text-lg font-semibold text-red-400 mb-3">First-Mover Advantage</h4>
            <p className="text-gray-300 text-sm">
              While everyone else is still figuring out the basics, we're already implementing advanced BI tools and
              strategic frameworks for GEO optimization.
            </p>
          </div>
        </div>
      ),
    },
    {
      id: 5,
      title: "Strategic Impact & Leadership",
      subtitle: "Driving Innovation Through Foresight",
      icon: <TrendingUp className="w-8 h-8" />,
      content: (
        <div className="space-y-6">
          <div className="text-center">
            <div className="bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-2xl p-8 border border-white/10 mb-6">
              <h3 className="text-3xl font-bold text-red-400 mb-4">Strategic Leadership in Action</h3>
              <p className="text-gray-300 text-lg">
                Identifying market shifts before they become mainstream and building competitive advantages through
                early adoption
              </p>
            </div>
          </div>

          <div className="grid md:grid-cols-2 gap-6">
            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-4">✅ What I Delivered</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• Identified the SEO → GEO shift early</li>
                <li>• Developed comprehensive research framework</li>
                <li>• Secured access to cutting-edge BI tools</li>
                <li>• Created actionable implementation strategy</li>
                <li>• Positioned team ahead of competition</li>
              </ul>
            </div>

            <div className="bg-red-500/10 rounded-xl p-6 border border-red-500/20">
              <h4 className="text-lg font-bold text-red-400 mb-4">🎯 Strategic Outcomes</h4>
              <ul className="space-y-2 text-gray-300 text-sm">
                <li>• First-mover advantage in GEO/LLMO</li>
                <li>• Advanced tooling for LLM optimization</li>
                <li>• Cross-functional team alignment</li>
                <li>• Future-proofed content strategy</li>
                <li>• Competitive intelligence advantage</li>
              </ul>
            </div>
          </div>

          <div className="bg-gradient-to-r from-red-500/10 to-red-600/10 rounded-xl p-6 border border-white/10 text-center">
            <h4 className="text-lg font-semibold text-red-400 mb-3">The Kelly Reddington Approach</h4>
            <p className="text-gray-300 text-sm">
              Spot emerging trends → Research comprehensively → Build strategic frameworks → Secure competitive
              advantages → Lead implementation
            </p>
          </div>
        </div>
      ),
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  return (
    <section id="geo-strategy" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Strategic Foresight: SEO to GEO
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            How I identified and led the strategic shift from traditional SEO to Generative Engine Optimization,
            positioning our team ahead of the curve in AI-driven discovery
          </p>
        </div>

        <div className="max-w-4xl mx-auto">
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 overflow-hidden">
            {/* Slide Header */}
            <div className="bg-gradient-to-r from-red-500/20 to-red-600/20 p-6 border-b border-white/10">
              <div className="flex items-center gap-4 mb-2">
                <div className="p-2 bg-white/10 rounded-lg">{slides[currentSlide].icon}</div>
                <div>
                  <h3 className="text-2xl font-bold text-red-400">{slides[currentSlide].title}</h3>
                  <p className="text-gray-300">{slides[currentSlide].subtitle}</p>
                </div>
              </div>
            </div>

            {/* Slide Content */}
            <div className="p-8 min-h-[500px]">{slides[currentSlide].content}</div>

            {/* Navigation */}
            <div className="p-6 border-t border-white/10 bg-white/5">
              <div className="flex items-center justify-between">
                <Button
                  onClick={prevSlide}
                  variant="outline"
                  className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                  disabled={currentSlide === 0}
                >
                  <ChevronLeft className="w-4 h-4 mr-2" />
                  Previous
                </Button>

                {/* Slide Indicators */}
                <div className="flex gap-2">
                  {slides.map((_, index) => (
                    <button
                      key={index}
                      onClick={() => goToSlide(index)}
                      className={`w-3 h-3 rounded-full transition-all duration-300 ${
                        index === currentSlide
                          ? "bg-gradient-to-r from-red-500 to-red-600"
                          : "bg-white/20 hover:bg-white/40"
                      }`}
                    />
                  ))}
                </div>

                <Button
                  onClick={nextSlide}
                  variant="outline"
                  className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                  disabled={currentSlide === slides.length - 1}
                >
                  Next
                  <ChevronRight className="w-4 h-4 ml-2" />
                </Button>
              </div>

              <div className="text-center mt-4 text-gray-400 text-sm">
                Slide {currentSlide + 1} of {slides.length}
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/meme-showcase.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { useState } from "react"
import { Zap, ExternalLink, ChevronLeft, ChevronRight, Play } from "lucide-react"
import { Button } from "@/components/ui/button"

export function MemeShowcase() {
  const [currentSlide, setCurrentSlide] = useState(0)

  const slideshows = [
    {
      id: 0,
      title: "Meme Marketing Portfolio",
      subtitle: "Original Viral Content Collection",
      embedSrc: "https://www.canva.com/design/DAGTI0yzUQI/AjMeynilyDQRVzAmK0Dy1Q/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGTI0yzUQI/AjMeynilyDQRVzAmK0Dy1Q/view?utm_content=DAGTI0yzUQI&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Full Meme Slideshow",
      paddingTop: "100.0000%",
      icon: <Zap className="w-6 h-6" />,
      isVideo: false,
    },
    {
      id: 1,
      title: "Extended Meme Collection",
      subtitle: "Additional Viral Content & Community Engagement",
      embedSrc: "https://www.canva.com/design/DAGTOuJMOk4/A8-gHxdrhP_aC9DeZtM9uQ/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGTOuJMOk4/A8-gHxdrhP_aC9DeZtM9uQ/view?utm_content=DAGTOuJMOk4&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Extended Meme Collection",
      paddingTop: "100.0000%",
      icon: <Zap className="w-6 h-6" />,
      isVideo: false,
    },
    {
      id: 2,
      title: "Meme Video Examples",
      subtitle: "Dynamic Video Content & Animated Memes",
      embedSrc: "https://www.canva.com/design/DAGTPJjruMg/I65kmuVC8n1mTQ2lQvMY0g/watch?embed",
      viewLink:
        "https://www.canva.com/design/DAGTPJjruMg/I65kmuVC8n1mTQ2lQvMY0g/watch?utm_content=DAGTPJjruMg&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Meme Video Examples",
      paddingTop: "100.0000%",
      icon: <Play className="w-6 h-6" />,
      isVideo: true,
    },
    {
      id: 3,
      title: "Advanced Meme Video Collection",
      subtitle: "Extended Video Content & Creative Animations",
      embedSrc: "https://www.canva.com/design/DAGYM0C2Wdw/ca8omqgNjH3-gNtViWlcCQ/watch?embed",
      viewLink:
        "https://www.canva.com/design/DAGYM0C2Wdw/ca8omqgNjH3-gNtViWlcCQ/watch?utm_content=DAGYM0C2Wdw&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Advanced Meme Videos",
      paddingTop: "100.0000%",
      icon: <Play className="w-6 h-6" />,
      isVideo: true,
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slideshows.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slideshows.length) % slideshows.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  return (
    <section id="meme-showcase" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Meme Marketing & Viral Content
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            Strategic meme marketing and viral content creation that drives engagement and builds authentic connections
            with crypto-native audiences
          </p>
        </div>

        <div className="max-w-4xl mx-auto">
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 overflow-hidden">
            {/* Header */}
            <div className="bg-gradient-to-r from-red-500/20 to-red-600/20 p-6 border-b border-white/10">
              <div className="flex items-center gap-4 mb-2">
                <div className="p-2 bg-white/10 rounded-lg">{slideshows[currentSlide].icon}</div>
                <div className="flex-1">
                  <h3 className="text-2xl font-bold text-red-400">{slideshows[currentSlide].title}</h3>
                  <p className="text-gray-300">{slideshows[currentSlide].subtitle}</p>
                </div>
                <div className="text-sm text-gray-400">
                  {currentSlide + 1} of {slideshows.length}
                </div>
              </div>
            </div>

            {/* Slideshow Container */}
            <div className="p-8">
              <div
                style={{
                  position: "relative",
                  width: "100%",
                  height: 0,
                  paddingTop: slideshows[currentSlide].paddingTop,
                  paddingBottom: 0,
                  boxShadow: "0 2px 8px 0 rgba(63,69,81,0.16)",
                  marginTop: "1.6em",
                  marginBottom: "0.9em",
                  overflow: "hidden",
                  borderRadius: "8px",
                  willChange: "transform",
                }}
              >
                <iframe
                  key={currentSlide} // Force re-render when slide changes
                  loading="lazy"
                  style={{
                    position: "absolute",
                    width: "100%",
                    height: "100%",
                    top: 0,
                    left: 0,
                    border: "none",
                    padding: 0,
                    margin: 0,
                    ...(slideshows[currentSlide].isVideo && {
                      objectFit: "contain",
                    }),
                  }}
                  src={slideshows[currentSlide].embedSrc}
                  allowFullScreen={true}
                  allow="fullscreen"
                />
              </div>

              <div className="text-center mt-6">
                <a
                  href={slideshows[currentSlide].viewLink}
                  target="_blank"
                  rel="noopener noreferrer"
                  className="inline-flex items-center gap-2 px-6 py-3 bg-gradient-to-r from-red-600 to-red-800 hover:from-red-700 hover:to-red-900 text-white rounded-full font-semibold transition-all duration-300 hover:scale-105 shadow-lg hover:shadow-red-500/25"
                >
                  <span>{slideshows[currentSlide].linkText}</span>
                  <ExternalLink className="w-4 h-4" />
                </a>
                <p className="text-sm text-gray-400 mt-2">by Kelly Reddington</p>
              </div>
            </div>

            {/* Navigation */}
            <div className="p-6 border-t border-white/10 bg-white/5">
              <div className="flex items-center justify-between">
                <Button
                  onClick={prevSlide}
                  variant="outline"
                  className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                  disabled={currentSlide === 0}
                >
                  <ChevronLeft className="w-4 h-4 mr-2" />
                  Previous
                </Button>

                {/* Slide Indicators */}
                <div className="flex gap-2">
                  {slideshows.map((_, index) => (
                    <button
                      key={index}
                      onClick={() => goToSlide(index)}
                      className={`w-3 h-3 rounded-full transition-all duration-300 ${
                        index === currentSlide
                          ? "bg-gradient-to-r from-red-500 to-red-600"
                          : "bg-white/20 hover:bg-white/40"
                      }`}
                    />
                  ))}
                </div>

                <Button
                  onClick={nextSlide}
                  variant="outline"
                  className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                  disabled={currentSlide === slideshows.length - 1}
                >
                  Next
                  <ChevronRight className="w-4 h-4 ml-2" />
                </Button>
              </div>

              <div className="text-center mt-4 text-gray-400 text-sm">
                Slide {currentSlide + 1} of {slideshows.length}
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/work-samples.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { ExternalLink, FileText, Zap } from "lucide-react"

export function WorkSamples() {
  const samples = [
    {
      category: "Product Marketing",
      icon: <Zap className="w-6 h-6" />,
      description:
        "The aim of my Product Marketing efforts is to translate the product vision into adoption. At the heart of great product marketing is the ability to understand the product, the market, and the end user, ensuring that every message resonates with the right audience.",
      approach: [
        "Positioning: Crafting compelling product narratives that align with market needs, current events, cultural relevance",
        "Go-to-Market Strategy: Developing end-to-end product marketing strategies, including launch plans and retention campaigns",
        "Cross-Functional Collaboration: Working closely with product, sales, and design teams",
        "Data-Driven Insights: Leveraging analytics and client feedback to refine messaging and boost engagement",
      ],
    },
    {
      category: "Content Marketing",
      icon: <FileText className="w-6 h-6" />,
      items: [
        "RWA.xyz Joint Whitepaper",
        "Blog Strategy and Writing (named author and ghostwriter)",
        "Storytelling for Brand awareness and employee advocacy",
        "Copywriting & Creative Ideation",
        "Podcast guest outreach and show notes",
        "Website copy examples",
      ],
    },
  ]

  return (
    <section id="work-samples" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Work Samples & Expertise
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            Examples of viral content, strategic campaigns, and product marketing that drive real results
          </p>
        </div>

        <div className="space-y-12">
          {samples.map((sample, index) => (
            <div
              key={index}
              className="bg-white/5 backdrop-blur-sm rounded-2xl p-8 border border-white/10 hover:bg-white/10 transition-all duration-300"
            >
              <div className="flex items-center gap-4 mb-6">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  {sample.icon}
                </div>
                <h3 className="text-2xl font-bold text-red-400">{sample.category}</h3>
              </div>

              {sample.description && <p className="text-gray-300 leading-relaxed mb-6">{sample.description}</p>}

              {sample.approach && (
                <div className="space-y-3 mb-6">
                  <h4 className="text-lg font-semibold text-white">My Approach:</h4>
                  {sample.approach.map((item, idx) => (
                    <div key={idx} className="flex items-start gap-3">
                      <div className="w-2 h-2 bg-red-500 rounded-full mt-2 flex-shrink-0" />
                      <span className="text-gray-300">{item}</span>
                    </div>
                  ))}
                </div>
              )}

              {sample.items && (
                <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-3">
                  {sample.items.map((item, idx) => (
                    <div
                      key={idx}
                      className="flex items-center gap-2 p-3 bg-white/5 rounded-lg border border-white/10 hover:bg-white/10 transition-colors duration-300"
                    >
                      <ExternalLink className="w-4 h-4 text-red-400 flex-shrink-0" />
                      <span className="text-gray-300 text-sm">{item}</span>
                    </div>
                  ))}
                </div>
              )}
            </div>
          ))}
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/certifications.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { Award, GraduationCap } from "lucide-react"

export function Certifications() {
  const certifications = [
    "Google AI for Anyone Certification",
    "Product Marketing Alliance - Core",
    "The Complete Solidity Course - Blockchain - Zero to Expert (Udemy)",
    "Appsflyer Essentials Certified - Mobile App Analytics",
    "Level Access Certified - Website & Content Accessibility (WCAG)",
    "Sprout Social Certified",
    "Hubspot Social Media Marketing Certified",
    "Hootsuite Social Media Marketing Certified",
    "BuildSpace Nights & Weekends",
  ]

  const education = [
    {
      institution: "University At Buffalo",
      degree: "Business Administration - Finance & Marketing Concentrations",
      gpa: "3.7 GPA",
    },
    {
      institution: "Hilbert College",
      degree: "CyberSecurity/Infosec",
      gpa: "3.8 GPA",
    },
  ]

  return (
    <section id="certifications" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Education & Certifications
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            Continuous learning and professional development in marketing, technology, and business strategy
          </p>
        </div>

        <div className="grid lg:grid-cols-2 gap-12">
          {/* Certifications - Left Side */}
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 p-8">
            <div className="flex items-center gap-3 mb-8">
              <div className="p-3 bg-gradient-to-r from-red-500 to-red-600 rounded-lg">
                <Award className="w-6 h-6 text-white" />
              </div>
              <h3 className="text-2xl font-bold text-white">Professional Certifications</h3>
            </div>
            <div className="space-y-4">
              {certifications.map((cert, index) => (
                <div key={index} className="flex items-start gap-3 group">
                  <div className="w-2 h-2 bg-red-500 rounded-full mt-2 flex-shrink-0 group-hover:bg-red-400 transition-colors" />
                  <span className="text-gray-300 group-hover:text-white transition-colors leading-relaxed">{cert}</span>
                </div>
              ))}
            </div>
          </div>

          {/* Education - Right Side */}
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 p-8">
            <div className="flex items-center gap-3 mb-8">
              <div className="p-3 bg-gradient-to-r from-red-500 to-red-600 rounded-lg">
                <GraduationCap className="w-6 h-6 text-white" />
              </div>
              <h3 className="text-2xl font-bold text-white">Education</h3>
            </div>
            <div className="space-y-8">
              {education.map((edu, index) => (
                <div key={index} className="group">
                  <h4 className="text-xl font-semibold text-white mb-2 group-hover:text-red-400 transition-colors">
                    {edu.institution}
                  </h4>
                  <p className="text-gray-300 mb-2 leading-relaxed">{edu.degree}</p>
                  <div className="inline-block px-3 py-1 bg-gradient-to-r from-red-500/20 to-red-600/20 border border-red-500/30 rounded-full">
                    <span className="text-red-400 font-semibold text-sm">{edu.gpa}</span>
                  </div>
                </div>
              ))}
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/resume-viewer.tsx" isEdit="true" isQuickEdit="true" isMerged="true"
"use client"

import { FileText, ExternalLink } from "lucide-react"

export function ResumeViewer() {
  return (
    <section id="resume" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Resume
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
        </div>

        <div className="max-w-5xl mx-auto">
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 overflow-hidden">
            {/* Header */}
            <div className="bg-gradient-to-r from-red-500/20 to-red-600/20 p-6 border-b border-white/10">
              <div className="flex items-center gap-4">
                <div className="p-2 bg-white/10 rounded-lg">
                  <FileText className="w-6 h-6" />
                </div>
                <div>
                  <h3 className="text-2xl font-bold text-red-400">Resume</h3>
                  <p className="text-gray-300">Kelly Reddington</p>
                </div>
              </div>
            </div>

            {/* Canva Embed Container */}
            <div className="p-8">
              <div
                style={{
                  position: "relative",
                  width: "100%",
                  height: 0,
                  paddingTop: "129.4118%",
                  paddingBottom: 0,
                  boxShadow: "0 2px 8px 0 rgba(63,69,81,0.16)",
                  overflow: "hidden",
                  borderRadius: "12px",
                  willChange: "transform",
                }}
              >
                <iframe
                  loading="lazy"
                  style={{
                    position: "absolute",
                    width: "100%",
                    height: "100%",
                    top: 0,
                    left: 0,
                    border: "none",
                    padding: 0,
                    margin: 0,
                  }}
                  src="https://www.canva.com/design/DAGCiqwnmWA/wOVV_p2Py1HdGIi7_5QI9w/view?embed"
                  allowFullScreen={true}
                  allow="fullscreen"
                />
              </div>

              <div className="text-center mt-6">
                <a
                  href="https://www.canva.com/design/DAGCiqwnmWA/wOVV_p2Py1HdGIi7_5QI9w/view?utm_content=DAGCiqwnmWA&utm_campaign=designshare&utm_medium=embeds&utm_source=link"
                  target="_blank"
                  rel="noopener noreferrer"
                  className="inline-flex items-center gap-2 px-6 py-3 bg-gradient-to-r from-red-600 to-red-800 hover:from-red-700 hover:to-red-900 text-white rounded-full font-semibold transition-all duration-300 hover:scale-105 shadow-lg hover:shadow-red-500/25"
                >
                  <span>View Full Resume</span>
                  <ExternalLink className="w-4 h-4" />
                </a>
                <p className="text-sm text-gray-400 mt-2">by Kelly Reddington</p>
              </div>
            </div>

            {/* Footer */}
            <div className="p-4 border-t border-white/10 bg-white/5 text-center">
              <p className="text-gray-400 text-sm">
                Interactive resume powered by Canva • Click expand for fullscreen view • Download directly from viewer
              </p>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/skills.tsx" isEdit="true" isMerged="true"
import { Brain, Code, TrendingUp, Zap } from "lucide-react"

export function Skills() {
  const skillCategories = [
    {
      icon: <TrendingUp className="w-8 h-8" />,
      title: "Marketing & Growth",
      skills: [
        "Product Marketing",
        "Growth Hacking",
        "Storytelling",
        "Social Media Growth (X, LinkedIn, YouTube, TikTok, Discord, Farcaster)",
        "SEO",
        "ASO",
        "GEO/LLMO",
        "Email Marketing",
        "Influencer Outreach",
        "Community Building",
      ],
    },
    {
      icon: <Code className="w-8 h-8" />,
      title: "Crypto & Blockchain",
      skills: [
        "EVM Compatibility",
        "Solidity",
        "Smart Contracts",
        "OpenZeppelin",
        "Tokenomics Analysis",
        "DeFi",
        "Tokenization",
        "DAOs",
        "Web3",
        "Reward Loops",
        "Gamification",
        "Decentralized Social (DeSo)",
        "Liquid Staking",
        "LSTs",
        "Restaking",
        "Lido",
        "JitoSOL",
        "MEV",
        "EigenLayer",
        "AVSs",
        "CESR (Composite Ether Staking Rate)",
        "ChainLink",
        "Interoperability",
      ],
    },
    {
      icon: <Brain className="w-8 h-8" />,
      title: "AI & Emerging Tech",
      skills: [
        "Artificial Intelligence",
        "Custom GPT Development",
        "AI Marketing Applications",
        "AI-Generated Content",
        "Google Veo3 Video generation",
        "Gemini Flash 2.5",
        "Midjourney",
        "Lumen5",
        "Murf.ai",
        "V0 Vercel",
      ],
    },
    {
      icon: <Zap className="w-8 h-8" />,
      title: "Data & Strategy",
      skills: [
        "Market Research",
        "Growth Hacking",
        "Analytics & Engagement Optimization",
        "Funnel Strategy",
        "Audience Segmentation",
        "A/B Testing",
        "Appsflyer OneLinks",
        "Meme Marketing",
      ],
    },
  ]

  return (
    <section id="skills" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Key Skills
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
        </div>

        <div className="grid md:grid-cols-2 gap-8 mb-16">
          {skillCategories.map((category, index) => (
            <div
              key={index}
              className="bg-white/5 backdrop-blur-sm rounded-2xl p-8 border border-white/10 hover:bg-white/10 transition-all duration-300 group"
            >
              <div className="flex items-center gap-4 mb-6">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10 group-hover:scale-110 transition-transform duration-300">
                  {category.icon}
                </div>
                <h3 className="text-xl font-bold text-white">{category.title}</h3>
              </div>
              <div className="flex flex-wrap gap-2">
                {category.skills.map((skill, idx) => (
                  <span
                    key={idx}
                    className="px-3 py-1 bg-white/10 rounded-full text-sm text-gray-300 border border-white/20 hover:bg-white/20 transition-colors duration-300"
                  >
                    {skill}
                  </span>
                ))}
              </div>
            </div>
          ))}
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/portfolio.tsx" isEdit="true" isMerged="true"
"use client"

import { useState } from "react"
import { ExternalLink, ChevronLeft, ChevronRight, Building2, Zap, MessageSquare, Users } from "lucide-react"
import { Button } from "@/components/ui/button"

export function Portfolio() {
  const [currentSlide, setCurrentSlide] = useState(0)

  const slideshows = [
    {
      id: 0,
      title: "Corporate Communications",
      subtitle: "Professional Corporate & Business Communications",
      embedSrc: "https://www.canva.com/design/DAGxAZTkRlE/JfsM5skp-0yC6K6aJIoEKw/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGxAZTkRlE/JfsM5skp-0yC6K6aJIoEKw/view?utm_content=DAGxAZTkRlE&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Corporate Communications Portfolio",
      paddingTop: "100.0000%",
      icon: <Building2 className="w-6 h-6" />,
      description:
        "Professional corporate communications, business presentations, and strategic messaging designed for executive and institutional audiences.",
    },
    {
      id: 1,
      title: "Advertisement Portfolio",
      subtitle: "High-Impact Advertisements & Social Media Campaigns",
      embedSrc: "https://www.canva.com/design/DAGT5I_f7jk/f9WITpF4AcHdPHR3nXNTuw/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGT5I_f7jk/f9WITpF4AcHdPHR3nXNTuw/view?utm_content=DAGT5I_f7jk&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Full Advertisement Portfolio",
      paddingTop: "100.0000%",
      icon: <Zap className="w-6 h-6" />,
      description:
        "Explore my collection of high-impact advertisements, social media campaigns, and creative content that achieved 6x industry benchmark engagement rates.",
    },
    {
      id: 2,
      title: "Twitter Threads Portfolio",
      subtitle: "Strategic Thread Content for Retail & Institutional Audiences",
      embedSrc: "https://www.canva.com/design/DAGTguOp3Zc/9zT7A86K8SZiFeubP_URoA/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGTguOp3Zc/9zT7A86K8SZiFeubP_URoA/view?utm_content=DAGTguOp3Zc&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Twitter Threads Portfolio",
      paddingTop: "100.0000%",
      icon: <MessageSquare className="w-6 h-6" />,
      description:
        "I have experience crafting Twitter threads for both retail and institutional audiences. This slideshow features a few examples of my work. Click/tap the image to be taken to the full thread on X.",
    },
    {
      id: 3,
      title: "Social Media Post Examples",
      subtitle: "Influencer-Style Content & Engagement-Driven Posts",
      embedSrc: "https://www.canva.com/design/DAGT3ktaMd0/7y8CsDDLg4AaAqFkB_T2YA/view?embed",
      viewLink:
        "https://www.canva.com/design/DAGT3ktaMd0/7y8CsDDLg4AaAqFkB_T2YA/view?utm_content=DAGT3ktaMd0&utm_campaign=designshare&utm_medium=embeds&utm_source=link",
      linkText: "View Social Media Examples",
      paddingTop: "100.0000%",
      icon: <Users className="w-6 h-6" />,
      description:
        "Examples of social media posts designed to drive engagement and build authentic connections with audiences across multiple platforms.",
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slideshows.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slideshows.length) % slideshows.length)
  }

  const goToSlide = (index: number) => {
    setCurrentSlide(index)
  }

  return (
    <section id="portfolio" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent leading-tight pb-2">
            Ads, Threads, Social Posts
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-700 mx-auto rounded-full mt-4" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            A showcase of viral content, strategic campaigns, and high-engagement social media posts that achieved 6x
            industry benchmark engagement rates
          </p>
        </div>

        <div className="max-w-4xl mx-auto">
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl border border-white/10 overflow-hidden">
            {/* Header */}
            <div className="bg-gradient-to-r from-red-500/20 to-red-600/20 p-6 border-b border-white/10">
              <div className="flex items-center gap-4 mb-2">
                <div className="p-2 bg-white/10 rounded-lg">{slideshows[currentSlide].icon}</div>
                <div className="flex-1">
                  <h3 className="text-2xl font-bold text-red-400">{slideshows[currentSlide].title}</h3>
                  <p className="text-gray-300">{slideshows[currentSlide].subtitle}</p>
                </div>
                <div className="text-sm text-gray-400">
                  {currentSlide + 1} of {slideshows.length}
                </div>
              </div>
            </div>

            {/* Content Description */}
            <div className="px-8 pt-6">
              <p className="text-gray-300 text-center leading-relaxed">{slideshows[currentSlide].description}</p>
            </div>

            {/* Canva Embed Container */}
            <div className="p-8">
              <div
                style={{
                  position: "relative",
                  width: "100%",
                  height: 0,
                  paddingTop: slideshows[currentSlide].paddingTop,
                  paddingBottom: 0,
                  boxShadow: "0 2px 8px 0 rgba(63,69,81,0.16)",
                  marginTop: "1.6em",
                  marginBottom: "0.9em",
                  overflow: "hidden",
                  borderRadius: "12px",
                  willChange: "transform",
                }}
              >
                <iframe
                  key={currentSlide} // Force re-render when slide changes
                  loading="lazy"
                  style={{
                    position: "absolute",
                    width: "100%",
                    height: "100%",
                    top: 0,
                    left: 0,
                    border: "none",
                    padding: 0,
                    margin: 0,
                  }}
                  src={slideshows[currentSlide].embedSrc}
                  allowFullScreen={true}
                  allow="fullscreen"
                />
              </div>

              <div className="text-center mt-6">
                <a
                  href={slideshows[currentSlide].viewLink}
                  target="_blank"
                  rel="noopener noreferrer"
                  className="inline-flex items-center gap-2 px-6 py-3 bg-gradient-to-r from-red-600 to-red-800 hover:from-red-700 hover:to-red-900 text-white rounded-full font-semibold transition-all duration-300 hover:scale-105 shadow-lg hover:shadow-red-500/25"
                >
                  <span>{slideshows[currentSlide].linkText}</span>
                  <ExternalLink className="w-4 h-4" />
                </a>
                <p className="text-sm text-gray-400 mt-2">by Kelly Reddington</p>
              </div>
            </div>

            {/* Navigation */}
            <div className="p-6 border-t border-white/10 bg-white/5">
              <div className="flex items-center justify-between">
                <Button
                  onClick={prevSlide}
                  variant="outline"
                  className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                  disabled={currentSlide === 0}
                >
                  <ChevronLeft className="w-4 h-4 mr-2" />
                  Previous
                </Button>

                {/* Slide Indicators */}
                <div className="flex gap-2">
                  {slideshows.map((_, index) => (
                    <button
                      key={index}
                      onClick={() => goToSlide(index)}
                      className={`w-3 h-3 rounded-full transition-all duration-300 ${
                        index === currentSlide
                          ? "bg-gradient-to-r from-red-500 to-red-600"
                          : "bg-white/20 hover:bg-white/40"
                      }`}
                    />
                  ))}
                </div>

                <Button
                  onClick={nextSlide}
                  variant="outline"
                  className="border-red-500/40 text-red-400 hover:bg-red-500/20 hover:border-red-400 bg-transparent transition-all duration-300"
                  disabled={currentSlide === slideshows.length - 1}
                >
                  Next
                  <ChevronRight className="w-4 h-4 ml-2" />
                </Button>
              </div>

              <div className="text-center mt-4 text-gray-400 text-sm">
                Slide {currentSlide + 1} of {slideshows.length}
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]json:file="package.json" isMerged="true"
{
  "name": "my-v0-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "eslint ."
  },
  "dependencies": {
    "@hookform/resolvers": "^3.10.0",
    "@radix-ui/react-accordion": "1.2.2",
    "@radix-ui/react-alert-dialog": "1.1.4",
    "@radix-ui/react-aspect-ratio": "1.1.1",
    "@radix-ui/react-avatar": "1.1.2",
    "@radix-ui/react-checkbox": "1.1.3",
    "@radix-ui/react-collapsible": "1.1.2",
    "@radix-ui/react-context-menu": "2.2.4",
    "@radix-ui/react-dialog": "1.1.4",
    "@radix-ui/react-dropdown-menu": "2.1.4",
    "@radix-ui/react-hover-card": "1.1.4",
    "@radix-ui/react-label": "2.1.1",
    "@radix-ui/react-menubar": "1.1.4",
    "@radix-ui/react-navigation-menu": "1.2.3",
    "@radix-ui/react-popover": "1.1.4",
    "@radix-ui/react-progress": "1.1.1",
    "@radix-ui/react-radio-group": "1.2.2",
    "@radix-ui/react-scroll-area": "1.2.2",
    "@radix-ui/react-select": "2.1.4",
    "@radix-ui/react-separator": "1.1.1",
    "@radix-ui/react-slider": "1.2.2",
    "@radix-ui/react-slot": "1.1.1",
    "@radix-ui/react-switch": "1.1.2",
    "@radix-ui/react-tabs": "1.1.2",
    "@radix-ui/react-toast": "1.2.4",
    "@radix-ui/react-toggle": "1.1.1",
    "@radix-ui/react-toggle-group": "1.1.1",
    "@radix-ui/react-tooltip": "1.1.6",
    "@vercel/analytics": "1.3.1",
    "autoprefixer": "^10.4.20",
    "class-variance-authority": "^0.7.1",
    "clsx": "^2.1.1",
    "cmdk": "1.0.4",
    "date-fns": "4.1.0",
    "embla-carousel-react": "8.5.1",
    "geist": "^1.3.1",
    "input-otp": "1.4.1",
    "lucide-react": "^0.454.0",
    "next": "14.2.35",
    "next-themes": "^0.4.6",
    "react": "^19",
    "react-day-picker": "9.8.0",
    "react-dom": "^19",
    "react-hook-form": "^7.60.0",
    "react-resizable-panels": "^2.1.7",
    "recharts": "2.15.4",
    "sonner": "^1.7.4",
    "tailwind-merge": "^3.3.1",
    "tailwindcss-animate": "^1.0.7",
    "vaul": "^0.9.9",
    "zod": "3.25.67"
  },
  "devDependencies": {
    "@tailwindcss/postcss": "^4.1.9",
    "@types/node": "^22",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "postcss": "^8.5",
    "tailwindcss": "^4.1.9",
    "tw-animate-css": "1.3.3",
    "typescript": "^5"
  }
}
[V0_FILE]typescriptreact:file="components/hero.tsx" isEdit="true" isMerged="true"
"use client"

import { ArrowDown, Linkedin, Mail, BookOpen } from "lucide-react"
import { Button } from "@/components/ui/button"

export function Hero() {
  const scrollToNextSection = () => {
    const skillsSection = document.getElementById("skills")
    if (skillsSection) {
      skillsSection.scrollIntoView({ behavior: "smooth" })
    }
  }

  return (
    <section className="relative min-h-screen flex items-center justify-center overflow-hidden bg-black">
      {/* Background Image */}
      <div
        className="absolute inset-0 bg-cover bg-center bg-no-repeat opacity-30"
        style={{ backgroundImage: "url(/images/hero-bg.png)" }}
      />

      {/* Gradient Overlay */}
      <div className="absolute inset-0 bg-gradient-to-br from-black via-black/90 to-black" />

      {/* Animated Background Elements */}
      <div className="absolute inset-0">
        <div className="absolute top-1/4 left-1/4 w-96 h-96 bg-red-500/10 rounded-full blur-3xl animate-pulse" />
        <div className="absolute bottom-1/4 right-1/4 w-96 h-96 bg-red-500/10 rounded-full blur-3xl animate-pulse delay-1000" />
      </div>

      <div className="relative z-10 text-center max-w-4xl mx-auto px-4">
        <div className="mb-8 animate-fade-in">
          <h1 className="text-5xl md:text-7xl font-bold mb-6 bg-gradient-to-r from-red-500 to-red-600 bg-clip-text text-transparent leading-tight pb-2">
            Kelly Reddington
          </h1>
          <div className="text-xl md:text-2xl text-gray-300 mb-4">
            Marketing & Growth Strategist | Crypto | Fintech | AI{" "}
          </div>
          <div className="text-lg text-gray-400 max-w-2xl mx-auto leading-relaxed">
            Blending technical fluency with narrative clarity to drive adoption. Specializing in education-first
            content, go-to-market strategy, and institutional messaging that bridges complex infrastructure and
            real-world outcomes.
          </div>
        </div>

        {/* Contact Info */}
        <div className="flex flex-wrap justify-center gap-6 mb-12 text-gray-300">
          <a
            href="https://kellyreddington.substack.com/"
            target="_blank"
            rel="noopener noreferrer"
            className="flex items-center gap-2 bg-white/5 backdrop-blur-sm rounded-full px-4 py-2 border border-white/10 hover:bg-white/10 transition-all duration-300"
          >
            <BookOpen size={16} />
            <span>Substack</span>
          </a>
          <div className="flex items-center gap-2 bg-white/5 backdrop-blur-sm rounded-full px-4 py-2 border border-white/10">
            <Mail size={16} />
            <span>kreddington41@gmail.com</span>
          </div>
          <a
            href="https://www.linkedin.com/in/kellyreddington"
            target="_blank"
            rel="noopener noreferrer"
            className="flex items-center gap-2 bg-white/5 backdrop-blur-sm rounded-full px-4 py-2 border border-white/10 hover:bg-white/10 transition-all duration-300"
          >
            <Linkedin size={16} />
            <span>LinkedIn</span>
          </a>
        </div>

        {/* CTA Button */}
        <div className="flex justify-center mb-16">
          <Button
            size="lg"
            onClick={scrollToNextSection}
            className="bg-gradient-to-r from-red-600 to-red-700 hover:from-red-700 hover:to-red-800 text-white border-0 rounded-full px-8 py-3 text-lg font-semibold shadow-2xl hover:shadow-red-500/25 transition-all duration-300 hover:scale-105 cursor-pointer"
          >
            View My Work
          </Button>
        </div>

        {/* Scroll Indicator */}
        <div className="animate-bounce">
          <ArrowDown className="mx-auto text-gray-400" size={32} />
        </div>
      </div>
    </section>
  )
}
[V0_FILE]typescriptreact:file="components/contact.tsx" isEdit="true" isMerged="true"
"use client"

import { Mail, BookOpen, Linkedin, MapPin } from "lucide-react"

export function Contact() {
  return (
    <section id="contact" className="py-20 bg-black">
      <div className="max-w-6xl mx-auto px-4">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold mb-6 bg-gradient-to-r from-red-500 to-red-600 bg-clip-text text-transparent leading-tight pb-2">
            Let's Connect
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto rounded-full mt-4" />
          <p className="text-gray-300 mt-6 text-lg max-w-2xl mx-auto">
            Let's discuss how we can work together.
          </p>
        </div>

        <div className="max-w-2xl mx-auto">
          {/* Contact Info */}
          <div className="bg-white/5 backdrop-blur-sm rounded-2xl p-8 border border-white/10">
            <h3 className="text-2xl font-bold text-white mb-8 text-center">Get In Touch</h3>
            <div className="space-y-6">
              <div className="flex items-center gap-4">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  <BookOpen className="w-5 h-5" />
                </div>
                <div>
                  <p className="text-gray-400 text-sm">Substack</p>
                  <a
                    href="https://kellyreddington.substack.com/"
                    target="_blank"
                    rel="noopener noreferrer"
                    className="text-red-400 font-medium hover:text-red-300 transition-colors duration-300"
                  >
                    Read my Substack
                  </a>
                </div>
              </div>

              <div className="flex items-center gap-4">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  <Mail className="w-5 h-5" />
                </div>
                <div>
                  <p className="text-gray-400 text-sm">Email</p>
                  <p className="text-white font-medium">kreddington41@gmail.com</p>
                </div>
              </div>

              <div className="flex items-center gap-4">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  <MapPin className="w-5 h-5" />
                </div>
                <div>
                  <p className="text-gray-400 text-sm">Location</p>
                  <p className="text-white font-medium">New York</p>
                </div>
              </div>

              <div className="flex items-center gap-4">
                <div className="p-3 bg-gradient-to-br from-red-500/20 to-red-600/20 rounded-xl border border-white/10">
                  <Linkedin className="w-5 h-5" />
                </div>
                <div>
                  <p className="text-gray-400 text-sm">LinkedIn</p>
                  <a
                    href="https://www.linkedin.com/in/kellyreddington"
                    target="_blank"
                    rel="noopener noreferrer"
                    className="text-red-400 font-medium hover:text-red-300 transition-colors duration-300"
                  >
                    Connect with me
                  </a>
                </div>
              </div>
            </div>
          </div>
        </div>

        {/* Footer */}
        <div className="mt-20 pt-8 border-t border-white/10 text-center">
          <p className="text-gray-400">© 2025 Kelly Reddington. All rights reserved.</p>
        </div>
      </div>
    </section>
  )
}
[V0_FILE]plaintext:file="public/favicon.ico" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/K%20%281%29-93VebBiwkopZ7pcddW8RmAOEnWGnpS.png" isMerged="true"
[V0_FILE]png:file="public/icon-192.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/K%20%281%29-93VebBiwkopZ7pcddW8RmAOEnWGnpS.png" isMerged="true"
[V0_FILE]png:file="public/icon-512.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/K%20%281%29-93VebBiwkopZ7pcddW8RmAOEnWGnpS.png" isMerged="true"
[V0_FILE]typescriptreact:file="app/layout.tsx" isFixed="true" isEdit="true" isQuickEdit="true" isMerged="true"
import type React from "react"
import type { Metadata } from "next"
import { Inter } from "next/font/google"
import "./globals.css"
import { Analytics } from "@vercel/analytics/react"
import { Suspense } from "react"

const inter = Inter({ subsets: ["latin"] })

export const metadata: Metadata = {
  title: "Kelly Reddington",
  description: "Marketing strategist specializing in crypto, DeFi, growth hacking, and data-driven campaigns",
  icons: {
    icon: [
      { url: "/favicon.ico" },
      { url: "/icon-192.png", sizes: "192x192", type: "image/png" },
      { url: "/icon-512.png", sizes: "512x512", type: "image/png" },
    ],
    apple: "/icon-192.png",
  },
}

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="en">
      <head>
        <link rel="icon" href="/favicon.ico" sizes="any" />
        <link rel="apple-touch-icon" href="/icon-192.png" />
      </head>
      <body className={inter.className}>
        <Suspense fallback={<div>Loading...</div>}>{children}</Suspense>
        <Analytics />
      </body>
    </html>
  )
}
[V0_FILE]typescriptreact:file="components/navigation.tsx" isMerged="true"
"use client"

import { useState, useEffect } from "react"
import { Menu, X } from "lucide-react"

export function Navigation() {
  const [isOpen, setIsOpen] = useState(false)
  const [scrolled, setScrolled] = useState(false)

  useEffect(() => {
    const handleScroll = () => {
      setScrolled(window.scrollY > 50)
    }
    window.addEventListener("scroll", handleScroll)
    return () => window.removeEventListener("scroll", handleScroll)
  }, [])

  const navItems = [
    { href: "#skills", label: "Skills" },
    { href: "#kraken-institutional", label: "Kraken Institutional" },
    { href: "#portfolio", label: "Portfolio" },
    { href: "#meme-showcase", label: "Meme Marketing" },
    { href: "#work-samples", label: "Work Samples" },
    { href: "#crypto-copywriting", label: "Copywriting" },
    { href: "#case-study", label: "Case Study" },
    { href: "#geo-strategy", label: "GEO Strategy" },
    { href: "#datavis-showcase", label: "DataVIS" },
    { href: "#aso-showcase", label: "ASO" },
    { href: "#certifications", label: "Certifications" },
    { href: "#resume", label: "Resume" },
    { href: "#contact", label: "Contact" },
  ]

  return (
    <nav
      className={`fixed top-0 w-full z-50 transition-all duration-300 ${
        scrolled ? "bg-black/80 backdrop-blur-xl border-b border-white/10" : "bg-transparent"
      }`}
    >
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <div className="flex justify-between items-center py-4">
          <div className="text-2xl font-bold bg-gradient-to-r from-white to-gray-400 bg-clip-text text-transparent">
            Kelly Reddington
          </div>

          {/* Hamburger Menu Button */}
          <button
            className="p-2 rounded-xl bg-white/10 backdrop-blur-sm border border-white/20 hover:bg-white/20 transition-all duration-300"
            onClick={() => setIsOpen(!isOpen)}
          >
            {isOpen ? <X size={24} /> : <Menu size={24} />}
          </button>
        </div>

        {/* Expandable Navigation Menu */}
        {isOpen && (
          <div className="absolute top-full left-0 w-full bg-black/95 backdrop-blur-xl border-b border-white/10">
            <div className="px-4 py-6 space-y-4">
              {navItems.map((item) => (
                <a
                  key={item.href}
                  href={item.href}
                  className="block text-gray-300 hover:text-white transition-all duration-300 py-3 relative group"
                  onClick={() => setIsOpen(false)}
                >
                  {item.label}
                  <span className="absolute -bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-red-500 to-red-600 group-hover:w-full transition-all duration-300"></span>
                </a>
              ))}
            </div>
          </div>
        )}
      </div>
    </nav>
  )
}
[V0_FILE]plaintext:file="public/documents/trump-token-1pager.pdf" url="https://blobs.vusercontent.net/blob/OFFICIAL%20TRUMP%20token%201pager%20%281%29-MhpvFMxjQUDKnaTloicSMQoJMSrb7h.pdf" isMerged="true"
Non-image binary files cannot be read directly. It is available at the following URL: https://blobs.vusercontent.net/blob/OFFICIAL%20TRUMP%20token%201pager%20%281%29-MhpvFMxjQUDKnaTloicSMQoJMSrb7h.pdf
[V0_FILE]plaintext:file="public/documents/kraken-prime-asset-managers.pdf" url="https://blobs.vusercontent.net/blob/Kraken%20Prime%20for%20Asset%20Managers-x5sbxdKQFONbA1IbNkW8swm99DWZsv.pdf" isMerged="true"
Non-image binary files cannot be read directly. It is available at the following URL: https://blobs.vusercontent.net/blob/Kraken%20Prime%20for%20Asset%20Managers-x5sbxdKQFONbA1IbNkW8swm99DWZsv.pdf
[V0_FILE]typescriptreact:file="components/kraken-institutional.tsx"
"use client"

import { useState, useEffect } from "react"
import { ChevronLeft, ChevronRight, Building2, ExternalLink, FileText, BookOpen, FolderOpen, Maximize2, X } from "lucide-react"

export function KrakenInstitutional() {
  const [currentSlide, setCurrentSlide] = useState(0)
  const [currentDocSlide, setCurrentDocSlide] = useState(0)
  const [isFullscreen, setIsFullscreen] = useState(false)
  const [fullscreenImage, setFullscreenImage] = useState("")

  // Prevent body scroll when fullscreen is open
  useEffect(() => {
    if (isFullscreen) {
      document.body.style.overflow = "hidden"
    } else {
      document.body.style.overflow = "unset"
    }
    return () => {
      document.body.style.overflow = "unset"
    }
  }, [isFullscreen])

  const slides = [
    {
      title: "Kraken Institutional Content Portfolio",
      subtitle: "Product Marketing & Content Strategy",
      embedUrl: "https://www.canva.com/design/DAHKTm4_J4A/SuOBc7RO9d4QDagQ3NRVTA/view?embed",
      linkUrl: "https://www.canva.com/design/DAHKTm4_J4A/SuOBc7RO9d4QDagQ3NRVTA/view",
    },
  ]

  const nextSlide = () => {
    setCurrentSlide((prev) => (prev + 1) % slides.length)
  }

  const prevSlide = () => {
    setCurrentSlide((prev) => (prev - 1 + slides.length) % slides.length)
  }

  const documentSlides = [
    {
      title: "Infrastructure for the OFFICIAL TRUMP Token Ecosystem",
      description: "Product 1-pager covering qualified custody, OTC execution, derivatives access, collateral capabilities, and broader strategic partnership opportunities.",
      imageUrl: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/official_trump_token_single-tHLmA33k3vqR1JXbJCqP3xyiLM5DH7.png",
    },
    {
      title: "BTC Covered Calls Strategy Spotlight",
      description: "Strategy spotlight explaining covered call strategies for BTC holders, including strategy overview, why Kraken VIP, and steady premium capture performance metrics.",
      imageUrl: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/btc_covered_calls_single_image-qL5M1SzCXGGNNavyHrba03q0FazK7o.png",
    },
    {
      title: "Kraken Prime for Hedge Funds",
      description: "Comprehensive product marketing for hedge funds covering qualified custody, execution & OTC liquidity, capital efficiency, regulated derivatives, and staking & yield.",
      imageUrl: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/kraken_prime_hedge_funds_single-yU6We9bXMdX89AQ5uFXGY32yRSFs0q.png",
    },
    {
      title: "Kraken Prime for Venture Capitalists",
      description: "Product marketing for VCs covering token custody & vesting, execution & OTC liquidity, LP reporting & governance, staking, yield, and financing.",
      imageUrl: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/kraken_prime_vcs_single-1Q3zCuxJv2cRRpfCqpkdWwjd46v1oI.png",
    },
    {
      title: "OTC Options Primer",
      description: "Educational content explaining OTC options, pricing mechanics, option strategies, and how to trade OTC options with Kraken.",
      imageUrl: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/otc_options_primer_page_1.png-b2TlN0pLOvnhxMbyy8hd9Kjwe55dWs.jpeg",
    },
  ]

  const nextDocSlide = () => {
    setCurrentDocSlide((prev) => (prev + 1) % documentSlides.length)
  }

  const prevDocSlide = () => {
    setCurrentDocSlide((prev) => (prev - 1 + documentSlides.length) % documentSlides.length)
  }

  return (
    <section id="kraken-institutional" className="py-20 px-4 sm:px-6 lg:px-8 bg-black">
      <div className="max-w-6xl mx-auto">
        <div className="text-center mb-16">
          <h2 className="text-4xl md:text-5xl font-bold bg-gradient-to-r from-red-500 to-red-600 bg-clip-text text-transparent leading-tight pb-2">
            Kraken Institutional
          </h2>
          <div className="w-24 h-1 bg-gradient-to-r from-red-500 to-red-600 mx-auto mt-4 mb-8"></div>
          <p className="text-gray-400 max-w-4xl mx-auto text-lg leading-relaxed">
            I joined Kraken Institutional as a product marketer focusing on content strategy. I created social posts, animations, sales enablement material, decks for Payward Services (B2B offering), Prime brokerage, Exchange trading, Brochures for events, wrote blog posts, long-form educational primers, and more. I focused on broad strategy, tying our product offerings to industry narratives to trendjack and growth hack our social presence and to increase our MQLs in the pipeline.
          </p>
          <p className="text-white font-bold max-w-4xl mx-auto text-lg leading-relaxed mt-4">
            I blend institutional positioning, infrastructure narratives, regulated financial messaging, and complex product abstraction to create content systems.
          </p>
        </div>

        {/* Slideshow */}
        <div className="relative">
          {/* Slide Header */}
          <div className="text-center mb-6">
            <div className="flex items-center justify-center gap-3 mb-2">
              <Building2 className="w-6 h-6 text-red-500" />
              <h3 className="text-2xl font-bold text-white">{slides[currentSlide].title}</h3>
            </div>
            <p className="text-gray-400">{slides[currentSlide].subtitle}</p>
          </div>

          {/* Canva Embed */}
          <div className="relative rounded-2xl overflow-hidden border border-white/10 bg-white/5">
            <div style={{ position: "relative", width: "100%", height: 0, paddingTop: "56.25%", overflow: "hidden" }}>
              <iframe
                key={currentSlide}
                loading="lazy"
                style={{ position: "absolute", width: "100%", height: "100%", top: 0, left: 0, border: "none" }}
                src={slides[currentSlide].embedUrl}
                allowFullScreen
                allow="fullscreen"
              />
            </div>
          </div>

          {/* View Full Slideshow Link */}
          <div className="text-center mt-6">
            <a
              href={slides[currentSlide].linkUrl}
              target="_blank"
              rel="noopener noreferrer"
              className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors"
            >
              <ExternalLink className="w-4 h-4" />
              View Full Slideshow
            </a>
          </div>

          {/* Navigation Buttons - Only show if more than 1 slide */}
          {slides.length > 1 && (
            <>
              <button
                onClick={prevSlide}
                className="absolute left-4 top-1/2 -translate-y-1/2 p-3 rounded-full bg-black/50 border border-white/20 hover:bg-red-500/20 hover:border-red-400 transition-all duration-300"
              >
                <ChevronLeft className="w-6 h-6" />
              </button>
              <button
                onClick={nextSlide}
                className="absolute right-4 top-1/2 -translate-y-1/2 p-3 rounded-full bg-black/50 border border-white/20 hover:bg-red-500/20 hover:border-red-400 transition-all duration-300"
              >
                <ChevronRight className="w-6 h-6" />
              </button>
            </>
          )}
        </div>

        {/* Slide Indicators - Only show if more than 1 slide */}
        {slides.length > 1 && (
          <div className="flex justify-center gap-2 mt-8">
            {slides.map((_, index) => (
              <button
                key={index}
                onClick={() => setCurrentSlide(index)}
                className={`w-3 h-3 rounded-full transition-all duration-300 ${
                  index === currentSlide ? "bg-red-500 w-8" : "bg-white/30 hover:bg-white/50"
                }`}
              />
            ))}
          </div>
        )}

        {/* Blog Posts Section */}
        <div className="mt-20">
          <div className="text-center mb-12">
            <div className="flex items-center justify-center gap-3 mb-4">
              <BookOpen className="w-6 h-6 text-red-500" />
              <h3 className="text-2xl font-bold text-white">Blog Posts I Wrote While at Kraken</h3>
            </div>
            <p className="text-gray-400 max-w-3xl mx-auto">
              These blog posts display clear product marketing principles, content logic ladders, and oftentimes tie into the company&apos;s mission for impactful conclusions.
            </p>
          </div>

          <div className="space-y-8">
            {/* Product Integration Announcement */}
            <div className="bg-white/5 border border-white/10 rounded-xl p-6 hover:border-red-500/30 transition-all duration-300">
              <div className="flex items-start gap-4">
                <div className="p-3 rounded-lg bg-red-500/10">
                  <FileText className="w-5 h-5 text-red-500" />
                </div>
                <div className="flex-1">
                  <h4 className="text-lg font-semibold text-white mb-2">Product Integration Announcement</h4>
                  <a
                    href="https://blog.kraken.com/product/ramp/now-live-on-onramper"
                    target="_blank"
                    rel="noopener noreferrer"
                    className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                  >
                    <ExternalLink className="w-4 h-4" />
                    Now Live on Onramper
                  </a>
                </div>
              </div>
            </div>

            {/* Kraken 360 Thought Leadership */}
            <div className="bg-white/5 border border-white/10 rounded-xl p-6 hover:border-red-500/30 transition-all duration-300">
              <div className="flex items-start gap-4">
                <div className="p-3 rounded-lg bg-red-500/10">
                  <FileText className="w-5 h-5 text-red-500" />
                </div>
                <div className="flex-1">
                  <h4 className="text-lg font-semibold text-white mb-3">Kraken 360 Thought Leadership Content System</h4>
                  <div className="grid grid-cols-2 md:grid-cols-3 gap-3">
                    <a
                      href="https://blog.kraken.com/product/360/the-tge-checklist"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 1: The TGE Checklist
                    </a>
                    <a
                      href="https://blog.kraken.com/product/360/pre-tge-playbook-part-2"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 2: Pre-TGE Playbook
                    </a>
                    <a
                      href="https://blog.kraken.com/product/360/pre-tge-playbook-part-3"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 3: Pre-TGE Playbook
                    </a>
                    <a
                      href="https://blog.kraken.com/product/360/pre-tge-playbook-part-4"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 4: Pre-TGE Playbook
                    </a>
                    <a
                      href="https://blog.kraken.com/product/360/the-vendor-sprawl-problem"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 5: Vendor Sprawl Problem
                    </a>
                    <a
                      href="https://blog.kraken.com/product/360/6-vendors-to-lock-in-before-mint"
                      target="_blank"
                      rel="noopener noreferrer"
                      className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                    >
                      <ExternalLink className="w-3 h-3" />
                      Part 6: 6 Vendors to Lock In
                    </a>
                  </div>
                </div>
              </div>
            </div>

            {/* Exchange Trading API Unlocked */}
            <div className="bg-white/5 border border-white/10 rounded-xl p-6 hover:border-red-500/30 transition-all duration-300">
              <div className="flex items-start gap-4">
                <div className="p-3 rounded-lg bg-red-500/10">
                  <FileText className="w-5 h-5 text-red-500" />
                </div>
                <div className="flex-1">
                  <h4 className="text-lg font-semibold text-white mb-2">Exchange Trading &apos;API Unlocked&apos; Content System</h4>
                  <a
                    href="https://blog.kraken.com/category/product/api"
                    target="_blank"
                    rel="noopener noreferrer"
                    className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                  >
                    <ExternalLink className="w-4 h-4" />
                    View API Content Series
                  </a>
                </div>
              </div>
            </div>

            {/* Kraken Custody SPL Token Support */}
            <div className="bg-white/5 border border-white/10 rounded-xl p-6 hover:border-red-500/30 transition-all duration-300">
              <div className="flex items-start gap-4">
                <div className="p-3 rounded-lg bg-red-500/10">
                  <FileText className="w-5 h-5 text-red-500" />
                </div>
                <div className="flex-1">
                  <h4 className="text-lg font-semibold text-white mb-2">Kraken Custody Expanded Asset Support</h4>
                  <a
                    href="https://blog.kraken.com/product/kraken-institutional/spl-token-support-for-solana"
                    target="_blank"
                    rel="noopener noreferrer"
                    className="inline-flex items-center gap-2 text-red-400 hover:text-red-300 transition-colors text-sm"
                  >
                    <ExternalLink className="w-4 h-4" />
                    SPL Token Support for Solana
                  </a>
                  <p className="text-gray-500 text-xs mt-2">
                    This post taps into the internet capital markets narrative popularized by the Solana ecosystem, naturally segues into a Kraken 360 product spotlight, and ends with an inter-weaving of Solana&apos;s mission and Kraken&apos;s founding mission.
                  </p>
                </div>
              </div>
            </div>
          </div>
        </div>

        {/* Institutional Product Marketing Section */}
        <div className="mt-20">
          <div className="text-center mb-12">
            <div className="flex items-center justify-center gap-3 mb-4">
              <Building2 className="w-6 h-6 text-red-500" />
              <h3 className="text-2xl font-bold text-white">Institutional Product Marketing</h3>
            </div>
            <p className="text-gray-400 max-w-4xl mx-auto mb-4">
              Specialized in translating complex crypto and financial infrastructure into clear institutional narratives across Kraken Institutional&apos;s custody, execution, staking, financing, derivatives, and token lifecycle offerings.
            </p>
            <p className="text-gray-400 max-w-4xl mx-auto">
              The work combined product marketing, infrastructure positioning, educational content, and strategic storytelling to help institutional audiences understand how digital asset systems integrate into real-world operational, treasury, trading, governance, and investment workflows. The focus consistently centered on clarity, trust, regulatory alignment, and simplifying complexity without diluting technical sophistication.
            </p>
          </div>

          {/* Google Drive Link */}
          <div className="text-center mb-10">
            <a
              href="https://drive.google.com/drive/folders/166hffHZf2GWonoiyctOyKO0KQDL1WSX9?usp=sharing"
              target="_blank"
              rel="noopener noreferrer"
              className="inline-flex items-center gap-3 px-6 py-3 bg-white/5 border border-white/10 rounded-xl hover:border-red-500/30 hover:bg-red-500/5 transition-all duration-300"
            >
              <FolderOpen className="w-5 h-5 text-red-500" />
              <span className="text-white font-medium">Click to view Google Drive folder</span>
              <ExternalLink className="w-4 h-4 text-gray-400" />
            </a>
          </div>

          {/* Document Slideshow */}
          <div className="relative">
            {/* Slide Header */}
            <div className="text-center mb-6">
              <h4 className="text-xl font-semibold text-white mb-2">{documentSlides[currentDocSlide].title}</h4>
              <p className="text-gray-400 text-sm max-w-2xl mx-auto">{documentSlides[currentDocSlide].description}</p>
            </div>

            {/* Image Display with Scroll */}
            <div className="relative rounded-2xl overflow-hidden border border-white/10 bg-white/5">
              <div
                className="w-full h-[600px] overflow-y-auto bg-gray-900 cursor-pointer group"
                style={{
                  scrollbarWidth: "thin",
                  scrollbarColor: "#ef4444 #1f2937",
                }}
                onClick={() => {
                  setFullscreenImage(documentSlides[currentDocSlide].imageUrl)
                  setIsFullscreen(true)
                }}
              >
                <img
                  key={currentDocSlide}
                  src={documentSlides[currentDocSlide].imageUrl}
                  alt={documentSlides[currentDocSlide].title}
                  className="w-full h-auto transition-transform duration-300"
                  style={{ minHeight: "100%", objectFit: "contain" }}
                />
              </div>
              {/* Expand Button */}
              <button
                onClick={() => {
                  setFullscreenImage(documentSlides[currentDocSlide].imageUrl)
                  setIsFullscreen(true)
                }}
                className="absolute top-4 right-4 p-2 rounded-lg bg-black/50 border border-white/20 hover:bg-red-500/20 hover:border-red-400 transition-all duration-300"
              >
                <Maximize2 className="w-5 h-5" />
              </button>
            </div>

            <div className="text-center mt-4">
              <p className="text-gray-400 text-sm">Click image to expand to full screen</p>
              <p className="text-gray-500 text-xs mt-1">Scroll within the image above to view the complete document</p>
            </div>

            {/* Navigation Buttons */}
            {documentSlides.length > 1 && (
              <>
                <button
                  onClick={prevDocSlide}
                  className="absolute left-4 top-1/2 -translate-y-1/2 p-3 rounded-full bg-black/50 border border-white/20 hover:bg-red-500/20 hover:border-red-400 transition-all duration-300"
                >
                  <ChevronLeft className="w-6 h-6" />
                </button>
                <button
                  onClick={nextDocSlide}
                  className="absolute right-4 top-1/2 -translate-y-1/2 p-3 rounded-full bg-black/50 border border-white/20 hover:bg-red-500/20 hover:border-red-400 transition-all duration-300"
                >
                  <ChevronRight className="w-6 h-6" />
                </button>
              </>
            )}
          </div>

          {/* Slide Indicators */}
          {documentSlides.length > 1 && (
            <div className="flex justify-center gap-2 mt-8">
              {documentSlides.map((_, index) => (
                <button
                  key={index}
                  onClick={() => setCurrentDocSlide(index)}
                  className={`w-3 h-3 rounded-full transition-all duration-300 ${
                    index === currentDocSlide ? "bg-red-500 w-8" : "bg-white/30 hover:bg-white/50"
                  }`}
                />
              ))}
            </div>
          )}

          {/* Slide Counter */}
          <div className="text-center mt-4 text-gray-500 text-sm">
            {currentDocSlide + 1} of {documentSlides.length}
          </div>
        </div>

        {/* Fullscreen Modal */}
        {isFullscreen && (
          <div
            className="fixed inset-0 bg-black/95 z-50 flex items-center justify-center p-4"
            onClick={() => setIsFullscreen(false)}
          >
            <button
              onClick={() => setIsFullscreen(false)}
              className="absolute top-4 right-4 p-3 rounded-full bg-white/10 hover:bg-red-500/20 transition-all duration-300 z-50"
            >
              <X className="w-6 h-6" />
            </button>
            <div
              className="max-w-7xl max-h-[90vh] overflow-auto overscroll-contain"
              onClick={(e) => e.stopPropagation()}
            >
              <img
                src={fullscreenImage}
                alt="Fullscreen view"
                className="w-full h-auto"
              />
            </div>
          </div>
        )}
      </div>
    </section>
  )
}40:["$","$L5c",null,{"params":{"chatId":"evQt7mukU4u"},"promises":{"attributes":"$@5d","externalMeta":"$@5e","latest":"$@83","messagesRange":"$@84","messages":"$@85","template":"$@62","passwordProtection":"$@86","gitStatus":"$@87"},"children":["$","$L88",null,{"chatId":"evQt7mukU4u","children":["$","$L89",null,{"seedOnlyKeys":["@\"chat:state\",\"evQt7mukU4u\","],"data":{"project:id":null,"block:output:initial":{"id":"b_YiFrqRedxkD","file":"$undefined","result":"$@8a"},"/chat/api/snapshots/latest?blockId=b_YiFrqRedxkD&v=v2&scope=kreddington41-4601":"$@8b","@\"block:mappings\",\"evQt7mukU4u\",":{"sqlBlockExecutionStates":"$Q8c","blocksForkedFrom":"$Q8d","blocksTemplateIds":"$Q8e","blocksCreatedAt":"$Q8f","blocksShared":"$Q90","blocksDeployed":"$Q91","blocksSubdomains":"$Q92","brandedBlocks":"$Q93","unlistedBlocks":"$Q94","blockOutputs":"$Q95"},"@\"chat:sql-exec-provider\",\"evQt7mukU4u\",":null,"@\"chat:drafts\",null,":null,"@\"chat:state\",\"evQt7mukU4u\",":{"messages":[{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"QMP4CEf0Xauiq9x34VRAH4GbiBcgOKdp","parentId":"$undefined","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[],"isContentLoading":true,"role":"assistant","id":"fWJC8xh83NTGocCM735mm2mPI8WIAEN5","streaming":false,"finishReason":"stop","parentId":"QMP4CEf0Xauiq9x34VRAH4GbiBcgOKdp","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"lTiyonoFR5iHi2OPmsiOaAm5qDPx9WKa","parentId":"fWJC8xh83NTGocCM735mm2mPI8WIAEN5","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_vqvDqxBReWw","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"E31kn3gpM0tTRIublwtHAp5PipGohIbz","streaming":false,"finishReason":"stop","parentId":"lTiyonoFR5iHi2OPmsiOaAm5qDPx9WKa","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"zrLVqCbSKHopdddecytCkdTK7zGLUocY","parentId":"E31kn3gpM0tTRIublwtHAp5PipGohIbz","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_bwG7R7q14uo","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"fz6wLnLpUiqbArqmgZxNzs7wDEriSqPp","streaming":false,"finishReason":"stop","parentId":"zrLVqCbSKHopdddecytCkdTK7zGLUocY","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"KcAjqGERW0622lhjdMHy9RvNzAcR52xX","parentId":"fz6wLnLpUiqbArqmgZxNzs7wDEriSqPp","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_DzLPMiH3NAI","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"KdOmClQZcKgi77BEYx3uaniiEgkoaueM","streaming":false,"finishReason":"stop","parentId":"KcAjqGERW0622lhjdMHy9RvNzAcR52xX","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"YlRqbojvErkJRaYZmfBI29BCWQvO6iZ5","parentId":"KdOmClQZcKgi77BEYx3uaniiEgkoaueM","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_GeAWS7nZ3vB","type":"code-project","isVersioned":false},{"blockId":"b_w4OQjhROBIi","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"8RN04YSgBLbx7cKUCseFL430hwj1JKBm","streaming":false,"finishReason":"stop","parentId":"YlRqbojvErkJRaYZmfBI29BCWQvO6iZ5","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"rlty0nZVi7mdbBDonDuBLHj7YigYYHHd","parentId":"8RN04YSgBLbx7cKUCseFL430hwj1JKBm","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_im78CrhW9Lq","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"xzMS26ckwVury3uITBLa0OGO4K9wREax","streaming":false,"finishReason":"stop","parentId":"rlty0nZVi7mdbBDonDuBLHj7YigYYHHd","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"dWNqPeVdpHqxkTB4Nt0YDZIJCcAhlOha","parentId":"xzMS26ckwVury3uITBLa0OGO4K9wREax","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_B33i3lzEvYh","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"9jrbubrb4AW653eeD6FDHLQU9MIW5XBf","streaming":false,"finishReason":"stop","parentId":"dWNqPeVdpHqxkTB4Nt0YDZIJCcAhlOha","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"4Z7ljI58ktGU3KYEKRlOa7BQYO0VPZcc","parentId":"fz6wLnLpUiqbArqmgZxNzs7wDEriSqPp","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_Kdi5S5rZRLm","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"oXRkVh6MLNO1z5SgysH5I4riO6wlTZaS","streaming":false,"finishReason":"stop","parentId":"4Z7ljI58ktGU3KYEKRlOa7BQYO0VPZcc","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"SjF40gyNcntOjNbPdh179RHx4sGdEY9D","parentId":"oXRkVh6MLNO1z5SgysH5I4riO6wlTZaS","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_ViFxR94bhAD","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"9GizHK5ViNVggseTirF3JM0OWxdPbqIs","streaming":false,"finishReason":"stop","parentId":"SjF40gyNcntOjNbPdh179RHx4sGdEY9D","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"3criXsoaagV93rXAt9y1El2Yf4wvrfYU","parentId":"9GizHK5ViNVggseTirF3JM0OWxdPbqIs","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[],"isContentLoading":true,"role":"assistant","id":"B6D32eBr5f0OztbRFEUl9307EVe4yFUL","streaming":false,"finishReason":"stop","parentId":"3criXsoaagV93rXAt9y1El2Yf4wvrfYU","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"VDUy50qScYPm8dEqb4al3Ltw0Eojnm1v","parentId":"B6D32eBr5f0OztbRFEUl9307EVe4yFUL","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_RHTX4MbtDNp","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"NKlIwpvDjsWpM6jFMPpxPI7nADQdFXN5","streaming":false,"finishReason":"stop","parentId":"VDUy50qScYPm8dEqb4al3Ltw0Eojnm1v","type":"message"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_A7LUC9PAfna","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"a4KzIPUEaApLGdCpWSsh0Iww1Yc7epA1","streaming":false,"finishReason":"stop","parentId":"VDUy50qScYPm8dEqb4al3Ltw0Eojnm1v","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"xsLoch73CPXHEoCVqNx8YwxT745aoVfN","parentId":"a4KzIPUEaApLGdCpWSsh0Iww1Yc7epA1","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_MRGCPKBsNNQ","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"hlh3vvdCs6aONDM1dk3HMLosBgGt8V6X","streaming":false,"finishReason":"stop","parentId":"xsLoch73CPXHEoCVqNx8YwxT745aoVfN","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"FPlwupWlNbGi37mfywnsceRbBrG4vArr","parentId":"hlh3vvdCs6aONDM1dk3HMLosBgGt8V6X","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_ZO0Eff4GoE7","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"eV6lDbNZiB1OBAoAFSoXvv9jBpvoTVaJ","streaming":false,"finishReason":"stop","parentId":"FPlwupWlNbGi37mfywnsceRbBrG4vArr","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"WesAvhejhSuAet4vWzvp1C665NZ31yiI","parentId":"eV6lDbNZiB1OBAoAFSoXvv9jBpvoTVaJ","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_ebcxcBUv6R9","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"AtGodRRwzqawBoI4k5h0HKzlCvru7Mr8","streaming":false,"finishReason":"stop","parentId":"WesAvhejhSuAet4vWzvp1C665NZ31yiI","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"pD17CMwdho7dCxlMHSbY6j0JkuBNJwD2","parentId":"AtGodRRwzqawBoI4k5h0HKzlCvru7Mr8","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_LHpb0Jqjr5W","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"INC30p7Snu05JGRWpShviXXTPVMyB05x","streaming":false,"finishReason":"stop","parentId":"pD17CMwdho7dCxlMHSbY6j0JkuBNJwD2","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"ZX07mnxc1rGo552chGJ3XHlr9TmABte9","parentId":"INC30p7Snu05JGRWpShviXXTPVMyB05x","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_lJYzIrBMqum","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"cjZxGRKtHjMxeC24qjhhT1HDSYejFabl","streaming":false,"finishReason":"stop","parentId":"ZX07mnxc1rGo552chGJ3XHlr9TmABte9","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"iv7IXBagNLSK0BntR1l172QMIHFME3xt","parentId":"cjZxGRKtHjMxeC24qjhhT1HDSYejFabl","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_vcNzBIh1I3J","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"3sdNfCLsXKVWeuCn8zIp3jJQkStQlWJY","streaming":false,"finishReason":"stop","parentId":"iv7IXBagNLSK0BntR1l172QMIHFME3xt","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"MWxNdC9hOSF0aKHA1MSQ15hm2VSZeMkg","parentId":"3sdNfCLsXKVWeuCn8zIp3jJQkStQlWJY","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_UgSQIazwHac","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"ZtiuCczhI3Qx85hxs3oMRvvAe4mLHzst","streaming":false,"finishReason":"stop","parentId":"MWxNdC9hOSF0aKHA1MSQ15hm2VSZeMkg","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"3RzkH95Igzq5ZglZRugv7JF5Plpfs4Qp","parentId":"ZtiuCczhI3Qx85hxs3oMRvvAe4mLHzst","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_dhmxt5hjUWP","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"rjnBmoDmey8zwIUoLt7VRYJJ2VqJDOCZ","streaming":false,"finishReason":"stop","parentId":"3RzkH95Igzq5ZglZRugv7JF5Plpfs4Qp","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"Wa0ADELaZh9lHH92lPKQBesV2szfxZdV","parentId":"rjnBmoDmey8zwIUoLt7VRYJJ2VqJDOCZ","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_QezMcekGqlU","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"wfasPChfjYMriF6ltyfWdSMjlD2ks3fi","streaming":false,"finishReason":"stop","parentId":"Wa0ADELaZh9lHH92lPKQBesV2szfxZdV","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"itqr1tBHnm1cZ3znGHaKq0UYdArfqJK8","parentId":"wfasPChfjYMriF6ltyfWdSMjlD2ks3fi","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_sB6R3LZVIbO","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"HsjVPv5IFdSdHBPNWFJDPyRNoF3Uj2TI","streaming":false,"finishReason":"stop","parentId":"itqr1tBHnm1cZ3znGHaKq0UYdArfqJK8","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"5dv6eS4YVOT6w1gSssoZhqUim6bfHX9Q","parentId":"HsjVPv5IFdSdHBPNWFJDPyRNoF3Uj2TI","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_zBD7s4SHHZV","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"k9exeI79UR7UYHW9RKvD3LULaX7hzS3l","streaming":false,"finishReason":"stop","parentId":"5dv6eS4YVOT6w1gSssoZhqUim6bfHX9Q","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"KZmEMke8ELHwBO2zZpThbdSZQr31wmln","parentId":"k9exeI79UR7UYHW9RKvD3LULaX7hzS3l","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_R3miHHaepWX","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"tDQIbvwlH2nbIQZDxdarbTsmgIu49Cly","streaming":false,"finishReason":"stop","parentId":"KZmEMke8ELHwBO2zZpThbdSZQr31wmln","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"EWpBf0KoDU4m3W84SzYbNABiDtsWmVjA","parentId":"tDQIbvwlH2nbIQZDxdarbTsmgIu49Cly","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[],"isContentLoading":true,"role":"assistant","id":"p51EWAkWh2LDzbjvAfAb6QuW6j8CgEfs","streaming":false,"finishReason":"stop","parentId":"EWpBf0KoDU4m3W84SzYbNABiDtsWmVjA","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"lpYA7huY4pL020cAvgrjueDNRP0Gpql8","parentId":"p51EWAkWh2LDzbjvAfAb6QuW6j8CgEfs","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_QjvhnZYTDwd","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"ygiyvEpVUMr3i7ghaUAn22tkd875GSy9","streaming":false,"finishReason":"stop","parentId":"lpYA7huY4pL020cAvgrjueDNRP0Gpql8","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"tX5eoyDv1NMOvnN3viejRPDnNEjQcpI1","parentId":"ygiyvEpVUMr3i7ghaUAn22tkd875GSy9","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_61QjKJ4ZQ2K","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"PNWbnDT3NRCMZnR4A6Ysj05MDW57C1T7","streaming":false,"finishReason":"stop","parentId":"tX5eoyDv1NMOvnN3viejRPDnNEjQcpI1","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"hcqaahm9xfLwyzN3vqF78NYxl8QbKrk3","parentId":"PNWbnDT3NRCMZnR4A6Ysj05MDW57C1T7","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_neli2el5cBr","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"4v5q9pkzvhs4wFNyhAROozuGvdmN4hG7","streaming":false,"finishReason":"stop","parentId":"hcqaahm9xfLwyzN3vqF78NYxl8QbKrk3","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"dwOM2LbnHg4HXPbF2EzzO4gY2B2ohWF1","parentId":"4v5q9pkzvhs4wFNyhAROozuGvdmN4hG7","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_h52POXQGVzR","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"9VEZRgGhwpf6AmuzKJlZOapzBKQnlt9E","streaming":false,"finishReason":"stop","parentId":"dwOM2LbnHg4HXPbF2EzzO4gY2B2ohWF1","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"dr8s6UkMd0UVoJ6EX7jKphgUZPWfxgQ1","parentId":"9VEZRgGhwpf6AmuzKJlZOapzBKQnlt9E","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_eqacLucJsnt","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"V4yEGdjvGKuhXHym3f5yhDlbmcT8ci8x","streaming":false,"finishReason":"stop","parentId":"dr8s6UkMd0UVoJ6EX7jKphgUZPWfxgQ1","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"BpD1KYz8gZjJO8tBxqyYBsdAsCddQQ6h","parentId":"V4yEGdjvGKuhXHym3f5yhDlbmcT8ci8x","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_SBzy1wTVZ3n","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"LFtIAskGTJraMYEcv5pfkwDfW7xYcSTF","streaming":false,"finishReason":"stop","parentId":"BpD1KYz8gZjJO8tBxqyYBsdAsCddQQ6h","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"hZsR7HHG1OQoARzscD4tb4ZKtzK4Oxot","parentId":"LFtIAskGTJraMYEcv5pfkwDfW7xYcSTF","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_KrnzHd9Rk77","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"y4zUwStQ7MOjfaYU0Pxw4VFwbc3HxDf6","streaming":false,"finishReason":"stop","parentId":"hZsR7HHG1OQoARzscD4tb4ZKtzK4Oxot","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"8cODfV2HsrfzVklveH16Essxeu07QISI","parentId":"y4zUwStQ7MOjfaYU0Pxw4VFwbc3HxDf6","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[],"isContentLoading":true,"role":"assistant","id":"3cDnGnjkA2Hx3eLlfXb76B1l2kQpBmYh","streaming":false,"finishReason":"stop","parentId":"8cODfV2HsrfzVklveH16Essxeu07QISI","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"9fs1H9bCfgbUUT1RWfajen1nizkEWTpi","parentId":"3cDnGnjkA2Hx3eLlfXb76B1l2kQpBmYh","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_3xpkEw0a1WC","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"HkrzDQSvn6lxUpM80uCktefYOwGKlBq7","streaming":false,"finishReason":"stop","parentId":"9fs1H9bCfgbUUT1RWfajen1nizkEWTpi","type":"message"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_BgQDuTJvRmk","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"s5MRAMnkCDUqQ0H4o3dCrHSKHT9BO1yx","streaming":false,"finishReason":"stop","parentId":"9fs1H9bCfgbUUT1RWfajen1nizkEWTpi","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"faZuyDHv7RpPzqYYb80LO73hcHkjltcf","parentId":"s5MRAMnkCDUqQ0H4o3dCrHSKHT9BO1yx","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_9CpUUa2wCNu","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"32nmSJyZ7hBCBIrllKl7xInxYKBuUe77","streaming":false,"finishReason":"stop","parentId":"faZuyDHv7RpPzqYYb80LO73hcHkjltcf","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"hTd2jc3kMsvZZw1AAuJKU640blNGh8cs","parentId":"32nmSJyZ7hBCBIrllKl7xInxYKBuUe77","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_hEWU2W1GML6","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"yPnQecgRxreFJUPqgoTKZI1GVxiWxwe6","streaming":false,"finishReason":"stop","parentId":"hTd2jc3kMsvZZw1AAuJKU640blNGh8cs","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"gCpYcEJyqMD5lVex5uTNIuJ6G083hFcg","parentId":"yPnQecgRxreFJUPqgoTKZI1GVxiWxwe6","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_bXF53Xomuej","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"8GnYwzkZ56Mmq4ufPXgFM3bUGZcfxSwS","streaming":false,"finishReason":"stop","parentId":"gCpYcEJyqMD5lVex5uTNIuJ6G083hFcg","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"11nrv6xiYJnzmc73mQGad3vBu19yCKgo","parentId":"8GnYwzkZ56Mmq4ufPXgFM3bUGZcfxSwS","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_LKJwX6peyVo","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"tk5Ob0ghxqzJcjk2FgfJe4b0nFVzJYlW","streaming":false,"finishReason":"stop","parentId":"11nrv6xiYJnzmc73mQGad3vBu19yCKgo","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"KHX4SUtKwr2cXPsKFw2qd5BWJv2KhhDb","parentId":"tk5Ob0ghxqzJcjk2FgfJe4b0nFVzJYlW","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_DNhgH2QApv5","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"P8JwH7SCDZGNFqIq1jo2aRfjlwebeGZJ","streaming":false,"finishReason":"stop","parentId":"KHX4SUtKwr2cXPsKFw2qd5BWJv2KhhDb","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"PNvmgMbdPwGXAH1XvsO8BB0jDoUsv55a","parentId":"P8JwH7SCDZGNFqIq1jo2aRfjlwebeGZJ","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_fJg03LhnU4n","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"Vt2j9JAtmOQWT4ghHkEpbWrko6To06nw","streaming":false,"finishReason":"stop","parentId":"PNvmgMbdPwGXAH1XvsO8BB0jDoUsv55a","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"HMQKobbvyGXLajXqTWmMuwVfRviFzLbm","parentId":"Vt2j9JAtmOQWT4ghHkEpbWrko6To06nw","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_sHu7MgD0E8a","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"nEZiv6MJJsZs7nxWublQGmy4QklaHwqi","streaming":false,"finishReason":"stop","parentId":"HMQKobbvyGXLajXqTWmMuwVfRviFzLbm","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"9dOzLfyYwitRLXVPchuZJA5HVK50wA60","parentId":"nEZiv6MJJsZs7nxWublQGmy4QklaHwqi","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_5RXkeReg8mg","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"2Y3NVxuLKpWB4lqXYRF5YF1b86vySiic","streaming":false,"finishReason":"stop","parentId":"9dOzLfyYwitRLXVPchuZJA5HVK50wA60","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"yMvgTurVBxmFFAa4GJLsL1k3fwBBmVsD","parentId":"2Y3NVxuLKpWB4lqXYRF5YF1b86vySiic","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_MeeSUIMHGGv","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"ihLHlIRZ0DO3eqnUFG5qGgcHCXdFXNHR","streaming":false,"finishReason":"stop","parentId":"yMvgTurVBxmFFAa4GJLsL1k3fwBBmVsD","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"xKYYBRl8G3jwZh45Qfr2WlgoA6yZn1jJ","parentId":"ihLHlIRZ0DO3eqnUFG5qGgcHCXdFXNHR","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_Q8uAVslS2wd","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"Qy47ZCW1Hybe0vzEsd6Ya9qgroIQHcYo","streaming":false,"finishReason":"stop","parentId":"xKYYBRl8G3jwZh45Qfr2WlgoA6yZn1jJ","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"TeQkE6yjRfyFbTfU09ebYBKAnYPlf3qH","parentId":"Qy47ZCW1Hybe0vzEsd6Ya9qgroIQHcYo","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_F8bpzktSfwq","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"bUxPp1dJYLdBYAr1S8NBKduuE0eDpEVd","streaming":false,"finishReason":"stop","parentId":"TeQkE6yjRfyFbTfU09ebYBKAnYPlf3qH","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"3Kc3w8qxOAySYBhqTRx9ZrMlGZS5pFIv","parentId":"bUxPp1dJYLdBYAr1S8NBKduuE0eDpEVd","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_BEMTszIIN8g","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"Xm8UXBnp2ij03f0rFUGZhURnlBna3lIn","streaming":false,"finishReason":"stop","parentId":"3Kc3w8qxOAySYBhqTRx9ZrMlGZS5pFIv","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"rbRTbRcf5cS5579FkAbPuAJBNSyzaIwl","parentId":"Xm8UXBnp2ij03f0rFUGZhURnlBna3lIn","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_30fwIFcLbGE","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"8iAhmvJzLlj1GbqPUHuY43MpeISVqydk","streaming":false,"finishReason":"stop","parentId":"rbRTbRcf5cS5579FkAbPuAJBNSyzaIwl","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"8nBO1v0QhzHbDyVhA3CfuMUQwo3O14bq","parentId":"8iAhmvJzLlj1GbqPUHuY43MpeISVqydk","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_jKAJRaEWbfI","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"O79jwv59t9y4Hj0omdZ9twIEEKE16EZs","streaming":false,"finishReason":"stop","parentId":"8nBO1v0QhzHbDyVhA3CfuMUQwo3O14bq","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"N2KmWdWmJ7eDwLUpSEOCbPJuaLxzIPym","parentId":"O79jwv59t9y4Hj0omdZ9twIEEKE16EZs","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_NZ5M3jUGIj5","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"RrC8naczCNFGyGqacpdNLsIak54P3l1G","streaming":false,"finishReason":"stop","parentId":"N2KmWdWmJ7eDwLUpSEOCbPJuaLxzIPym","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"bTcLPRFovN04rGsfE8zUN7FwOJ7sU1Eo","parentId":"RrC8naczCNFGyGqacpdNLsIak54P3l1G","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_3UaMLxBMPAk","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"ySTsT21df6eDf4p42Y5iign4BTENqmNM","streaming":false,"finishReason":"stop","parentId":"bTcLPRFovN04rGsfE8zUN7FwOJ7sU1Eo","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"5Q8luJ6p4BKpnRhM0nivNTOkEl6yKhaZ","parentId":"ySTsT21df6eDf4p42Y5iign4BTENqmNM","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_GjSXyRwHc98","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"2NNHgETipivKtVUSiBH7dfF6Kju2uSIN","streaming":false,"finishReason":"stop","parentId":"5Q8luJ6p4BKpnRhM0nivNTOkEl6yKhaZ","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"mClm55BnGFeQv6g91LSWaiL7OG2uiEpf","parentId":"2NNHgETipivKtVUSiBH7dfF6Kju2uSIN","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_0rndl6o42vm","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"8pTEq1gUWYhlPxvT5seI8i7btOABqzSS","streaming":false,"finishReason":"stop","parentId":"mClm55BnGFeQv6g91LSWaiL7OG2uiEpf","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"4whDpORizNhLlnCvpSembpUrK3BdiZbM","parentId":"8pTEq1gUWYhlPxvT5seI8i7btOABqzSS","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_QbTROLRGmy5","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"Qic71caLCzBBcU76ktaCPFSSUOmernfp","streaming":false,"finishReason":"stop","parentId":"4whDpORizNhLlnCvpSembpUrK3BdiZbM","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"QR7QJqWZDLQK4LK0Jfv4DvzmalOiRzYS","parentId":"Qic71caLCzBBcU76ktaCPFSSUOmernfp","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[],"isContentLoading":true,"role":"assistant","id":"VVYNZgWDOfjQXS6nEl226pMufoellkfh","streaming":false,"finishReason":"stop","parentId":"QR7QJqWZDLQK4LK0Jfv4DvzmalOiRzYS","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"FRvS8VDgEAP9l4Sy8ao6sDzSCO2z2ViK","parentId":"VVYNZgWDOfjQXS6nEl226pMufoellkfh","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_dzr1ZYSqICK","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"cxBVtbukP9yMdT5MospOpUhHhX94MNfp","streaming":false,"finishReason":"stop","parentId":"FRvS8VDgEAP9l4Sy8ao6sDzSCO2z2ViK","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"pIiFTgYc5wXStrFw7W3yBm8qip2mg8z6","parentId":"cxBVtbukP9yMdT5MospOpUhHhX94MNfp","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_JvURXAcpbNS","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"gfQi419rqWTnCOBk4BkT8Dw6yzxFcnWa","streaming":false,"finishReason":"stop","parentId":"pIiFTgYc5wXStrFw7W3yBm8qip2mg8z6","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"LDMNBzfSDiPSC1MuHFFotNvxuNbbrK4B","parentId":"gfQi419rqWTnCOBk4BkT8Dw6yzxFcnWa","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_zmTt5g6xI1L","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"qM5Oc9gghXFn2RdcTIvDa3C4BjoNjwbl","streaming":false,"finishReason":"stop","parentId":"LDMNBzfSDiPSC1MuHFFotNvxuNbbrK4B","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"GC2rxlqhdt1QX4JCh6WDL1mr0pqOPMD5","parentId":"qM5Oc9gghXFn2RdcTIvDa3C4BjoNjwbl","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_ec9wqamiPlc","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"RRdwySVIqhgK6B1I5R7z7rrR4smZlf7x","streaming":false,"finishReason":"stop","parentId":"GC2rxlqhdt1QX4JCh6WDL1mr0pqOPMD5","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"QQViwOaaLYJeF9hYC4nT4OZw5dNCUgDo","parentId":"RRdwySVIqhgK6B1I5R7z7rrR4smZlf7x","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_b8EjgnvaGSM","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"OeMXcnz2AoLe0XWsckEE7whROKyfNrBS","streaming":false,"finishReason":"stop","parentId":"QQViwOaaLYJeF9hYC4nT4OZw5dNCUgDo","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"T5ASTAd1BInHTlYEL0TSYSkO1iMvua3O","parentId":"OeMXcnz2AoLe0XWsckEE7whROKyfNrBS","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_UvP0h7wtK6x","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"1R7vW1LlFlAEHgq4M0lOTedQDOMn2p7D","streaming":false,"finishReason":"stop","parentId":"T5ASTAd1BInHTlYEL0TSYSkO1iMvua3O","type":"message"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_6xX7oreW8z7","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"1rs0bHB5BBEcizpwK5PPOs4rnZwf3gMU","streaming":false,"finishReason":"stop","parentId":"T5ASTAd1BInHTlYEL0TSYSkO1iMvua3O","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"VWBLTCxGZ7pOSg1zvelzT5aQAQ74uPAx","parentId":"1rs0bHB5BBEcizpwK5PPOs4rnZwf3gMU","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_vZ2VKu6rZWv","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"ANjdMh6LmrXGbzszZNoqKMj17lzZT9pO","streaming":false,"finishReason":"stop","parentId":"VWBLTCxGZ7pOSg1zvelzT5aQAQ74uPAx","type":"message"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_eTkCA2oL10P","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"XAo6ngtuxmWxN3Q2jWVB5nXVg8MPZo9K","streaming":false,"finishReason":"stop","parentId":"VWBLTCxGZ7pOSg1zvelzT5aQAQ74uPAx","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"DXIscwXN8wetz0riO3H06OE7H5VR6nKh","parentId":"XAo6ngtuxmWxN3Q2jWVB5nXVg8MPZo9K","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_WHYRKR6msXD","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"aDbiskqyJbRhNJudmEPB3xKHbjbw574y","streaming":false,"finishReason":"stop","parentId":"DXIscwXN8wetz0riO3H06OE7H5VR6nKh","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"S5DCLKghuhwKYDEJ4xpdeSMarqvJCpFM","parentId":"aDbiskqyJbRhNJudmEPB3xKHbjbw574y","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_m1htK4Yn5sa","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"BjUuZYXFgJIvAHZ41ZlkLIJzvL8rsNSh","streaming":false,"finishReason":"stop","parentId":"S5DCLKghuhwKYDEJ4xpdeSMarqvJCpFM","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"znRAjIErTzughWhjeBnAXldNDYBeAcTx","parentId":"BjUuZYXFgJIvAHZ41ZlkLIJzvL8rsNSh","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_t5TTVbPoxFI","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"rnT5ahAkjEsICuqgp72kvnaRiZ2fTrti","streaming":false,"finishReason":"stop","parentId":"znRAjIErTzughWhjeBnAXldNDYBeAcTx","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"6e6hRDkYX8JQOIqneLxeHd1L5VBVe1xF","parentId":"rnT5ahAkjEsICuqgp72kvnaRiZ2fTrti","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_uirNwKscRlz","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"mRWvJh2aDDXfKk2zyZeWXgPQp0kpbvzt","streaming":false,"finishReason":"stop","parentId":"6e6hRDkYX8JQOIqneLxeHd1L5VBVe1xF","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"an6D1porQimW0uikRJz61QSUT8ga7xnC","parentId":"mRWvJh2aDDXfKk2zyZeWXgPQp0kpbvzt","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_deZN6LBu4xo","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"ZVm7aSkclARXiNv8gYUByQNQTq8d0XFK","streaming":false,"finishReason":"stop","parentId":"an6D1porQimW0uikRJz61QSUT8ga7xnC","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"0ywb2GVKrzYyIzrdIco3wDzIFuwt5heT","parentId":"ZVm7aSkclARXiNv8gYUByQNQTq8d0XFK","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_ro9Sia5xLws","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"hztC5RFc7ipfYvVAC2ZiuTLazuJpISFL","streaming":false,"finishReason":"stop","parentId":"0ywb2GVKrzYyIzrdIco3wDzIFuwt5heT","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"O0sGBKjwmWqGVntCkWHpukLNnu7HkcVb","parentId":"hztC5RFc7ipfYvVAC2ZiuTLazuJpISFL","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_RFBkWEZznbB","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"CEnVbr1pzdPFBynLi2MSkJhp66UIarCu","streaming":false,"finishReason":"stop","parentId":"O0sGBKjwmWqGVntCkWHpukLNnu7HkcVb","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"0RjrIElFXbx64mt3218ZFysifzj18ug6","parentId":"CEnVbr1pzdPFBynLi2MSkJhp66UIarCu","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_1ynOwruXnkX","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"puuKIy4qsT6DLpdU6kSxO0rKFVCmQZ0u","streaming":false,"finishReason":"stop","parentId":"0RjrIElFXbx64mt3218ZFysifzj18ug6","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"sTT5YATR3EONfwZj8G6vfe5jIqyJFEQa","parentId":"puuKIy4qsT6DLpdU6kSxO0rKFVCmQZ0u","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_bSsiOEVqbPw","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"vAgfR4sPJWQGcv4fh0yuRZw2qaL1r78v","streaming":false,"finishReason":"stop","parentId":"sTT5YATR3EONfwZj8G6vfe5jIqyJFEQa","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"TWlh2XGiay3smurRF1pPFHBW9Dafbn6q","parentId":"vAgfR4sPJWQGcv4fh0yuRZw2qaL1r78v","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_wCPW61dmI2R","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"28PHW9upXtFC8SIHflzmNPos2forpxgz","streaming":false,"finishReason":"stop","parentId":"TWlh2XGiay3smurRF1pPFHBW9Dafbn6q","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"l4E9KWQOyLavr3dJWBqXZioKXxagVyrz","parentId":"28PHW9upXtFC8SIHflzmNPos2forpxgz","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_VFBljzV49n1","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"eG1BIXXJicO0ZSSLNoZgK6nuHFD7LohZ","streaming":false,"finishReason":"stop","parentId":"l4E9KWQOyLavr3dJWBqXZioKXxagVyrz","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"lO23XxS4lseIHEfH5ZmPJBrrweXuoRJy","parentId":"eG1BIXXJicO0ZSSLNoZgK6nuHFD7LohZ","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_67zxp5BJCWS","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"1GWgxFzMZ3d3ppAriZfFejRHQd9u6z2j","streaming":false,"finishReason":"stop","parentId":"lO23XxS4lseIHEfH5ZmPJBrrweXuoRJy","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"ZnGCJDhPOO9EjvESwMPXcER3f0GROj8T","parentId":"1GWgxFzMZ3d3ppAriZfFejRHQd9u6z2j","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_qxhZAYDFHK8","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"grb0pt4aJOOFtIL7Rdxnl0alccEthzri","streaming":false,"finishReason":"stop","parentId":"ZnGCJDhPOO9EjvESwMPXcER3f0GROj8T","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"WqDNxeKknYkM6W79DfqbxjdIou1zRKca","parentId":"grb0pt4aJOOFtIL7Rdxnl0alccEthzri","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_xsfcWdmhbPD","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"r5ZgZfIF1NdrGeNUE8neQaBRcqIeM2Um","streaming":false,"finishReason":"stop","parentId":"WqDNxeKknYkM6W79DfqbxjdIou1zRKca","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"umoWWbKIXo9zWwyqgvgicsEzp7ZbE0DW","parentId":"r5ZgZfIF1NdrGeNUE8neQaBRcqIeM2Um","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_SZsrH7Hns7c","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"zzTQFtP0bW8yWcJ26N0PPY79tB80ICHR","streaming":false,"finishReason":"stop","parentId":"umoWWbKIXo9zWwyqgvgicsEzp7ZbE0DW","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"8kEMzKlv1IWephVxCuVLhLWNSjntnW5n","parentId":"zzTQFtP0bW8yWcJ26N0PPY79tB80ICHR","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_yECVr9R6caR","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"Z3UpHVpODdmzqa4pwyagImsNVjzj3euJ","streaming":false,"finishReason":"stop","parentId":"8kEMzKlv1IWephVxCuVLhLWNSjntnW5n","type":"message"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_N9Y3dPbdIbf","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"auu8H1nxH7j38jHcrb1H00uV4YxpIw9k","streaming":false,"finishReason":"stop","parentId":"8kEMzKlv1IWephVxCuVLhLWNSjntnW5n","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"um6iE9yAZcIFHSmVM9wdnzecWqh3EHMY","parentId":"auu8H1nxH7j38jHcrb1H00uV4YxpIw9k","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_fd9fAr24aCv","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"BHT4TqLtaGTGwK0IVkMRYX8WuRJCwev4","streaming":false,"finishReason":"stop","parentId":"um6iE9yAZcIFHSmVM9wdnzecWqh3EHMY","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"p3izOhd3AzFSQVFrO42Gt4l8HK7crPkI","parentId":"BHT4TqLtaGTGwK0IVkMRYX8WuRJCwev4","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_EbqYcco2A1B","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"So7Br64M2GlHcfl2NfPwJEhxPkO3DwGn","streaming":false,"finishReason":"stop","parentId":"p3izOhd3AzFSQVFrO42Gt4l8HK7crPkI","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"u3y9GDL94kPgXkfoGxhiSxiZMMh4TU6b","parentId":"So7Br64M2GlHcfl2NfPwJEhxPkO3DwGn","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_ilP027Cx0uI","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"uFuKBrkEfK48bT4eujS7vRil5AMW1KLS","streaming":false,"finishReason":"stop","parentId":"u3y9GDL94kPgXkfoGxhiSxiZMMh4TU6b","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"svZItPn92mm0EbFUtsd0qGXyuPirbZIf","parentId":"uFuKBrkEfK48bT4eujS7vRil5AMW1KLS","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_sZ0hUxbfet5","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"wYQS5yDQqu2d3iRlU8y7zjO3ma3T75oK","streaming":false,"finishReason":"stop","parentId":"svZItPn92mm0EbFUtsd0qGXyuPirbZIf","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"rrFjQxkyR8fyZMm0wpZEpqR03jQNoWWt","parentId":"wYQS5yDQqu2d3iRlU8y7zjO3ma3T75oK","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_cflLL68fHJE","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"Xgs5rkI1lg76DDPJZDHk9rSIm8fMF9wo","streaming":false,"finishReason":"stop","parentId":"rrFjQxkyR8fyZMm0wpZEpqR03jQNoWWt","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"kaC2kwVbzmpIoII46JcYduUQbP1f8QEc","parentId":"Xgs5rkI1lg76DDPJZDHk9rSIm8fMF9wo","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_bCtAHqhntIE","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"vWTo2jTMVug80iAqXxOS1SakX4KNG0kv","streaming":false,"finishReason":"stop","parentId":"kaC2kwVbzmpIoII46JcYduUQbP1f8QEc","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"vEqH2ID8QdS7SaRYGSeVX6np0wDOdTpY","parentId":"vWTo2jTMVug80iAqXxOS1SakX4KNG0kv","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[],"isContentLoading":true,"role":"assistant","id":"KAn7B86joKqavhvBngd4iWuw9zOGXIXJ","streaming":false,"finishReason":"stop","parentId":"vEqH2ID8QdS7SaRYGSeVX6np0wDOdTpY","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"Fa1yLEpIO4XEYHY8HJh9ZcMFrCbUYFLA","parentId":"KAn7B86joKqavhvBngd4iWuw9zOGXIXJ","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[],"isContentLoading":true,"role":"assistant","id":"qWxnypTySo6KU8wJg9bQmWG4lSOfA0yy","streaming":false,"finishReason":"stop","parentId":"Fa1yLEpIO4XEYHY8HJh9ZcMFrCbUYFLA","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"9lItHDHgyywnizbwBlkIJ6SoTUKxQWq7","parentId":"qWxnypTySo6KU8wJg9bQmWG4lSOfA0yy","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_Q546JkWCMM7","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"0GaxN8hU2S14Xf4ZpXDrw8qqmpZ07lCj","streaming":false,"finishReason":"stop","parentId":"9lItHDHgyywnizbwBlkIJ6SoTUKxQWq7","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"pGSt4x3PdsySTTc79v2CriVQOXkDTxGw","parentId":"0GaxN8hU2S14Xf4ZpXDrw8qqmpZ07lCj","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_pA5C7ji8KW1","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"N27RWbxwCp3rjpdC0l5fSV0s7PDweelQ","streaming":false,"finishReason":"stop","parentId":"pGSt4x3PdsySTTc79v2CriVQOXkDTxGw","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"MhwNC386vX1K6Ll6YQulqLXuloUigJuS","parentId":"N27RWbxwCp3rjpdC0l5fSV0s7PDweelQ","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_nr7G6GTctDQ","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"5Z2J9SpK23EQN69HOmpXLa95vRvylmXG","streaming":false,"finishReason":"stop","parentId":"MhwNC386vX1K6Ll6YQulqLXuloUigJuS","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"KzMgX28bD8gCiijOpnxU88kWPoq9HrN4","parentId":"5Z2J9SpK23EQN69HOmpXLa95vRvylmXG","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_KLAWAqqKodO","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"BaDSGvZ090ruuXhFpFYvqxSXrbXeZrt2","streaming":false,"finishReason":"stop","parentId":"KzMgX28bD8gCiijOpnxU88kWPoq9HrN4","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"e1ELNcSFRSTAT2OvxAkFGnp6Qb9YVQHg","parentId":"BaDSGvZ090ruuXhFpFYvqxSXrbXeZrt2","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[],"isContentLoading":true,"role":"assistant","id":"jua2g9q6gXdM7MMq6AvywCaxl40gXud5","streaming":false,"finishReason":"stop","parentId":"e1ELNcSFRSTAT2OvxAkFGnp6Qb9YVQHg","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"10MpxNghFDYwxRW6aVXAZ4PKFeerAYZh","parentId":"jua2g9q6gXdM7MMq6AvywCaxl40gXud5","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_Ph4QCgckW2Q","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"XWJ5hpGaRVIDobYcByzW5h9n2AQ2ELx6","streaming":false,"finishReason":"stop","parentId":"10MpxNghFDYwxRW6aVXAZ4PKFeerAYZh","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"r6R4wVl4AXSXgxHAl6eBftFvtInIosnD","parentId":"XWJ5hpGaRVIDobYcByzW5h9n2AQ2ELx6","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_i4Ld73ZBrTZ","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"WwNN3zKNC9sxuV2P71Extr3tHO0V29qQ","streaming":false,"finishReason":"stop","parentId":"r6R4wVl4AXSXgxHAl6eBftFvtInIosnD","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"0ITp62JB2iWnfkhZpAsaNELLoHMUXHjB","parentId":"WwNN3zKNC9sxuV2P71Extr3tHO0V29qQ","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_gd7zpFSwy2d","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"2bb0R2VRKqdxc7Rrlanpfl92ZydydzVA","streaming":false,"finishReason":"stop","parentId":"0ITp62JB2iWnfkhZpAsaNELLoHMUXHjB","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"OmTtCGaqDtt3lJq4PRu17hhBL9hkNorm","parentId":"2bb0R2VRKqdxc7Rrlanpfl92ZydydzVA","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_YCCCQUHQuTE","type":"code-project","isVersioned":false},{"blockId":"b_uqdV2JRYjF6","type":"code-project","isVersioned":false},{"blockId":"b_PE6liYsWK7N","type":"code-project","isVersioned":false},{"blockId":"b_DQCTTmbi9gB","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"Ux0A2crpgnDWM6Hh40z152JrfnN4KMiP","streaming":false,"finishReason":"stop","parentId":"OmTtCGaqDtt3lJq4PRu17hhBL9hkNorm","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"TJ8ZCUodM8HDury5K6kpK6lCBfB4Nvyy","parentId":"Ux0A2crpgnDWM6Hh40z152JrfnN4KMiP","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_qkVRCHwgz5I","type":"code-project","isVersioned":false},{"blockId":"b_r2ys6ljz9hE","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"kMxX9TqQEIKv7ITLoINILXTXYKtVGUSX","streaming":false,"finishReason":"stop","parentId":"TJ8ZCUodM8HDury5K6kpK6lCBfB4Nvyy","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"sFyOE7iub3FcZi1Rt714Yn2hJeRclutW","parentId":"kMxX9TqQEIKv7ITLoINILXTXYKtVGUSX","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_NGnptJgu5ev","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"1xez9F1Yoo0WvlmAi3mEsZ6TzpyEQaxc","streaming":false,"finishReason":"stop","parentId":"sFyOE7iub3FcZi1Rt714Yn2hJeRclutW","type":"message"},{"content":{"type":"parts","parts":[],"version":1},"role":"user","id":"nrBQTmo1a0O76EhDMwuX1BZ2hWO6OSt3","parentId":"1xez9F1Yoo0WvlmAi3mEsZ6TzpyEQaxc","type":"message","isContentLoading":true,"authorId":"","createdAt":"$D2026-07-12T09:57:06.494Z"},{"content":{"type":"message-binary-format","value":[[0,[["p",{},["text",{},"Loading..."]]]],[1,{"title":"Loading message"}]]},"loadingBlocks":[{"blockId":"b_CJb7QynN6hR","type":"code-project","isVersioned":false},{"blockId":"b_kGoEqjMdfg8","type":"code-project","isVersioned":false},{"blockId":"b_rxWoTUcKj8A","type":"code-project","isVersioned":false},{"blockId":"b_ehwA770GuYe","type":"code-project","isVersioned":false},{"blockId":"b_Gl9XQqYg1l1","type":"code-project","isVersioned":true}],"isContentLoading":true,"role":"assistant","id":"vjuBO03KxD07U8J1KdXWGgz3P4FRJUZR","streaming":false,"finishReason":"stop","parentId":"nrBQTmo1a0O76EhDMwuX1BZ2hWO6OSt3","type":"message"},{"content":{"type":"parts","parts":[{"type":"mdx","content":"Actually, I have an idea. How about the slideshow is these image's I have uploaded here. Please use the same format you used for DataVIS Initiative slideshow for this \"Institutional Product Marketing\" slideshow"}],"version":1},"role":"user","id":"ZsWcGaWmoplCZN5vEM51JTk0oLlrvnbL","attachments":[{"url":"https://hebbkx1anhila5yf.public.blob.vercel-storage.com/otc_options_primer_page_1.png-b2TlN0pLOvnhxMbyy8hd9Kjwe55dWs.jpeg","name":"otc_options_primer_page_1.png","size":749190,"contentType":"image/jpeg"},{"url":"https://hebbkx1anhila5yf.public.blob.vercel-storage.com/kraken_prime_hedge_funds_single-yU6We9bXMdX89AQ5uFXGY32yRSFs0q.png","name":"kraken_prime_hedge_funds_single.png","size":862982,"contentType":"image/png"},{"url":"https://hebbkx1anhila5yf.public.blob.vercel-storage.com/official_trump_token_single-tHLmA33k3vqR1JXbJCqP3xyiLM5DH7.png","name":"official_trump_token_single.png","size":644720,"contentType":"image/png"},{"url":"https://hebbkx1anhila5yf.public.blob.vercel-storage.com/kraken_prime_vcs_single-1Q3zCuxJv2cRRpfCqpkdWwjd46v1oI.png","name":"kraken_prime_vcs_single.png","size":961631,"contentType":"image/png"},{"url":"https://hebbkx1anhila5yf.public.blob.vercel-storage.com/btc_covered_calls_single_image-qL5M1SzCXGGNNavyHrba03q0FazK7o.png","name":"btc_covered_calls_single_image.png","size":1104605,"contentType":"image/png"}],"attachedSkills":"$undefined","attachedDesignSystemSkill":"$undefined","parentId":"vjuBO03KxD07U8J1KdXWGgz3P4FRJUZR","type":"message","authorId":"LhDwXuIl97aqv3MBizvNBCyE","createdAt":"$D2026-05-22T14:22:59.848Z"},{"v0ModelId":"v0-max","content":{"type":"message-binary-format","value":[[0,[["AssistantMessageContentPart",{"part":{"createdAt":1779459788325,"finishedAt":1779459798378,"lastPartSentAt":1779459798378,"taskNameActive":null,"id":"i2rjumAYEfpJa19l","type":"task-thinking-v1","parts":[{"type":"thinking-end","duration":10,"thought":"$96"}]}}],["AssistantMessageContentPart",{"part":{"type":"task-grouped-tasks-v1","id":"7J5rKzk6szjoVbR1-eSvvo09GUcxskRtX","parts":[{"createdAt":1779459798656,"finishedAt":1779459802438,"lastPartSentAt":null,"taskNameActive":"Reading DataVIS component","taskNameComplete":"Read DataVIS component","toolCallId":"tooluse_KQFeCM2lyTtlHDdNcYF8ow","agentTurnId":"turn_4xkq3RjxuqtVjdZ6","filePath":null,"id":"7J5rKzk6szjoVbR1","type":"task-read-file-v1","parts":[]},{"createdAt":1779459799387,"finishedAt":1779459802489,"lastPartSentAt":1779459802440,"taskNameActive":"Reading Kraken component","taskNameComplete":"Read Kraken component","toolCallId":"tooluse_sg2hUcVXZC25TkVTELqKJk","agentTurnId":"turn_4xkq3RjxuqtVjdZ6","filePath":null,"id":"eSvvo09GUcxskRtX","type":"task-read-file-v1","parts":[{"type":"reading-file","filePath":"components/kraken-institutional.tsx"}]}],"createdAt":0,"finishedAt":1,"lastPartSentAt":1,"taskNameActive":"Explore • 2 Files","taskNameComplete":"Explore • 2 Files"},"id":"7J5rKzk6szjoVbR1-eSvvo09GUcxskRtX"}],["p",{},["text",{},"Now I'll update the Kraken Institutional component to replace the PDF slideshow with an image-based slideshow similar to the DataVIS format, with fullscreen capabilities:"]],["AssistantMessageContentPart",{"part":{"type":"task-coding-v1","id":"block-b_ypVdXp4fRBT","parts":[{"type":"code-project","isVersioned":false,"isSourceless":false,"changedFiles":[{"fileName":"components/kraken-institutional.tsx","baseName":"kraken-institutional.tsx","isActive":false,"isTerminated":false,"isDeleted":false,"isMoved":false}],"source":"[V0_FILE]tsx:file=\"components/kraken-institutional.tsx\" \nGENERATING","latestDeploymentInfo":"$undefined","lastDeployedAt":"$undefined","lastEditedAt":"$undefined","sourceVersionKey":"v_1_sk2ve_s3","needsBlockSource":true,"isAllImages":false,"blockId":"b_ypVdXp4fRBT","meta":{"taskNameActive":"Adding fullscreen state","taskNameComplete":"Added fullscreen state","type":"code-project","id":"Code"},"closed":true,"lang":"typescriptreact"}],"createdAt":0,"finishedAt":1,"lastPartSentAt":1,"taskNameActive":"Adding fullscreen state","taskNameComplete":"Added fullscreen state"},"id":"block-b_ypVdXp4fRBT"}],["AssistantMessageContentPart",{"part":{"type":"task-coding-v1","id":"block-b_qpvhGuZI7qx","parts":[{"type":"code-project","isVersioned":false,"isSourceless":false,"changedFiles":[{"fileName":"components/kraken-institutional.tsx","baseName":"kraken-institutional.tsx","isActive":false,"isTerminated":false,"isDeleted":false,"isMoved":false}],"source":"[V0_FILE]tsx:file=\"components/kraken-institutional.tsx\" \nGENERATING","latestDeploymentInfo":"$undefined","lastDeployedAt":"$undefined","lastEditedAt":"$undefined","sourceVersionKey":"v_1_4ih6o_s3","needsBlockSource":true,"isAllImages":false,"blockId":"b_qpvhGuZI7qx","meta":{"taskNameActive":"Updating document slides","taskNameComplete":"Updated document slides","type":"code-project","id":"Code"},"closed":true,"lang":"typescriptreact"}],"createdAt":0,"finishedAt":1,"lastPartSentAt":1,"taskNameActive":"Updating document slides","taskNameComplete":"Updated document slides"},"id":"block-b_qpvhGuZI7qx"}],["AssistantMessageContentPart",{"part":{"type":"task-coding-v1","id":"block-b_35tKRpMdmAB","parts":[{"type":"code-project","isVersioned":true,"isSourceless":false,"changedFiles":[{"fileName":"components/kraken-institutional.tsx","baseName":"kraken-institutional.tsx","isActive":false,"isTerminated":false,"isDeleted":false,"isMoved":false}],"source":"[V0_FILE]tsx:file=\"components/kraken-institutional.tsx\" \nGENERATING","latestDeploymentInfo":"$undefined","lastDeployedAt":"$undefined","lastEditedAt":"$undefined","sourceVersionKey":"v_1_vegy4_s3","needsBlockSource":true,"isAllImages":false,"blockId":"b_35tKRpMdmAB","meta":{"taskNameActive":"Updating slideshow format","taskNameComplete":"Updated slideshow format","type":"code-project","id":"Code"},"closed":true,"lang":"typescriptreact"}],"createdAt":0,"finishedAt":1,"lastPartSentAt":1,"taskNameActive":"Updating slideshow format","taskNameComplete":"Updated slideshow format"},"id":"block-b_35tKRpMdmAB"}],["p",{},["text",{},"I replaced the PDF-based slideshow in the Institutional Product Marketing section with an image-based slideshow matching the DataVIS Initiative format. The slideshow now includes 5 slides: OTC Options Primer, Kraken Prime for Hedge Funds, OFFICIAL TRUMP Token Infrastructure, Kraken Prime for Venture Capitalists, and BTC Covered Calls Strategy Spotlight. Each slide displays the image with click-to-fullscreen functionality, navigation arrows, slide indicators, and a fullscreen modal with scroll lock prevention to keep the background from scrolling."]],["AssistantMessageContentPart",{"part":{"createdAt":1779459872292,"finishedAt":1779459886069,"lastPartSentAt":1779459886050,"id":"hDg2SCYsht2l4tpY","type":"task-diagnostics-v1","blockId":"b_35tKRpMdmAB","parts":[{"type":"fetching-diagnostics"},{"type":"diagnostics-passed"}]}}]]],[1,{}]]},"context":[],"isContentLoading":false,"role":"assistant","id":"WLO3m5ritkrXJ07ltT1NwX3c8PcFzQop","streaming":false,"finishReason":"stop","vote":"$undefined","parentId":"ZsWcGaWmoplCZN5vEM51JTk0oLlrvnbL","type":"message","creditCost":0.938919,"workMetrics":{"diffMap":{"components/kraken-institutional.tsx":{"addedLines":83,"removedLines":14}},"imageGenerationCost":"$undefined","imageGenerationCount":"$undefined","linesRead":377,"agentActions":5},"createdAt":"$D2026-05-22T14:22:59.849Z","updatedAt":"$D2026-05-22T14:24:46.266Z"},{"content":{"type":"parts","parts":[{"type":"mdx","content":"for the Institutional Product Marketing slideshow. Put the Options Primer at the end of it, move the OFFICIAL TRUMP TOKEN to the front, with the BTC Covered Calls document as the second slide.\n\nAlso, provide the ability to slide the PNG's up and down using a scroller like how you have for the \"Crypto Native copywriting\" section slideshow. This scrollability will allow the image to appear larger and then the visitor to our website can scroll down to view it in its entirety. "}],"version":1},"role":"user","id":"7VIYXL7uChhpdVUqL5YpRZLADE84VxAH","attachments":[],"attachedSkills":"$undefined","attachedDesignSystemSkill":"$undefined","parentId":"WLO3m5ritkrXJ07ltT1NwX3c8PcFzQop","type":"message","authorId":"LhDwXuIl97aqv3MBizvNBCyE","createdAt":"$D2026-05-22T14:28:49.293Z"},{"v0ModelId":"v0-max","content":{"type":"message-binary-format","value":[[0,[["AssistantMessageContentPart",{"part":{"createdAt":1779460138491,"finishedAt":1779460140315,"lastPartSentAt":1779460140315,"taskNameActive":null,"id":"wHibndfmbs85dQRE","type":"task-thinking-v1","parts":[{"type":"thinking-end","duration":2,"thought":"The user wants me to:\n1. Reorder the Institutional Product Marketing slideshow - TRUMP token first, BTC Covered Calls second, then move Options Primer to the end\n2. Add scrollability to the slideshow images similar to the Crypto Native Copywriting section\n\nLet me read the current kraken-institutional.tsx file and the crypto-copywriting.tsx file to understand the scrolling implementation."}]}}],["AssistantMessageContentPart",{"part":{"type":"task-grouped-tasks-v1","id":"luh2dDUwjBj1jUpw-UbdbkmksfB8W90WM","parts":[{"createdAt":1779460141230,"finishedAt":1779460142327,"lastPartSentAt":null,"taskNameActive":"Reading Kraken component","taskNameComplete":"Read Kraken component","toolCallId":"tooluse_IIYSVm7ItTFDYFDeXlD1oi","agentTurnId":"turn_FylyVvT44U7giN3K","filePath":null,"id":"luh2dDUwjBj1jUpw","type":"task-read-file-v1","parts":[]},{"createdAt":1779460142082,"finishedAt":1779460142368,"lastPartSentAt":1779460142331,"taskNameActive":"Reading Crypto Copywriting","taskNameComplete":"Read Crypto Copywriting","toolCallId":"tooluse_An2IQ8Zw4mhbO4UhSn3l3N","agentTurnId":"turn_FylyVvT44U7giN3K","filePath":null,"id":"UbdbkmksfB8W90WM","type":"task-read-file-v1","parts":[{"type":"reading-file","filePath":"components/crypto-copywriting.tsx"}]}],"createdAt":0,"finishedAt":1,"lastPartSentAt":1,"taskNameActive":"Explore • 2 Files","taskNameComplete":"Explore • 2 Files"},"id":"luh2dDUwjBj1jUpw-UbdbkmksfB8W90WM"}],["p",{},["text",{},"Now I'll update the Kraken Institutional component with the reordered slides and scrollable image display:"]],["AssistantMessageContentPart",{"part":{"type":"task-coding-v1","id":"block-b_p1x6AV2TtEf","parts":[{"type":"code-project","isVersioned":false,"isSourceless":false,"changedFiles":[{"fileName":"components/kraken-institutional.tsx","baseName":"kraken-institutional.tsx","isActive":false,"isTerminated":false,"isDeleted":false,"isMoved":false}],"source":"[V0_FILE]tsx:file=\"components/kraken-institutional.tsx\" \nGENERATING","latestDeploymentInfo":"$undefined","lastDeployedAt":"$undefined","lastEditedAt":"$undefined","sourceVersionKey":"v_1_epsl3_s3","needsBlockSource":true,"isAllImages":false,"blockId":"b_p1x6AV2TtEf","meta":{"taskNameActive":"Reordering slides","taskNameComplete":"Reordered slides","type":"code-project","id":"Code"},"closed":true,"lang":"typescriptreact"}],"createdAt":0,"finishedAt":1,"lastPartSentAt":1,"taskNameActive":"Reordering slides","taskNameComplete":"Reordered slides"},"id":"block-b_p1x6AV2TtEf"}],["AssistantMessageContentPart",{"part":{"type":"task-coding-v1","id":"block-b_YiFrqRedxkD","parts":[{"type":"code-project","isVersioned":true,"isSourceless":false,"changedFiles":[{"fileName":"components/kraken-institutional.tsx","baseName":"kraken-institutional.tsx","isActive":false,"isTerminated":false,"isDeleted":false,"isMoved":false}],"source":"$97","latestDeploymentInfo":"$91:4:1","lastDeployedAt":"2026-06-12T02:55:11.410Z","lastEditedAt":"$undefined","sourceVersionKey":"v_1_2b3cp_s3","needsBlockSource":false,"isAllImages":false,"blockId":"b_YiFrqRedxkD","meta":{"taskNameActive":"Adding scrollable display","taskNameComplete":"Added scrollable display","type":"code-project","id":"Code"},"closed":true,"lang":"typescriptreact"}],"createdAt":0,"finishedAt":1,"lastPartSentAt":1,"taskNameActive":"Adding scrollable display","taskNameComplete":"Added scrollable display"},"id":"block-b_YiFrqRedxkD"}],["p",{},["text",{},"I've made two changes to the Institutional Product Marketing slideshow: First, I reordered the slides so OFFICIAL TRUMP Token is now first, BTC Covered Calls is second, followed by Hedge Funds, Venture Capitalists, and the OTC Options Primer is now last. Second, I added a scrollable container (600px height) with a styled scrollbar so visitors can scroll through the full-length document images without expanding to fullscreen, similar to the Crypto Native Copywriting section. I also added helper text below the image explaining the scroll and click-to-expand functionality."]],["AssistantMessageContentPart",{"part":{"createdAt":1779460197401,"finishedAt":1779460211394,"lastPartSentAt":1779460211374,"id":"CPx4wOHOrzp1kl7z","type":"task-diagnostics-v1","blockId":"b_YiFrqRedxkD","parts":[{"type":"fetching-diagnostics"},{"type":"diagnostics-passed"}]}}]]],[1,{}]]},"context":[],"isContentLoading":false,"role":"assistant","id":"l8VLrUyJTZSKWTDlOWEfEJJW4SSKucWD","streaming":false,"finishReason":"stop","vote":"$undefined","parentId":"7VIYXL7uChhpdVUqL5YpRZLADE84VxAH","type":"message","creditCost":0.823019,"workMetrics":{"diffMap":{"components/kraken-institutional.tsx":{"addedLines":40,"removedLines":29}},"imageGenerationCost":"$undefined","imageGenerationCount":"$undefined","linesRead":277,"agentActions":4},"createdAt":"$D2026-05-22T14:28:49.294Z","updatedAt":"$D2026-05-22T14:30:11.502Z"},{"content":{"type":"parts","parts":[{"type":"mdx","content":"please update the footer from 2025 to 2026"}],"version":1},"role":"user","id":"4aULjD9ySEZsUdIomungLb8qrQvCbHLP","attachments":[],"attachedSkills":"$undefined","attachedDesignSystemSkill":"$undefined","parentId":"l8VLrUyJTZSKWTDlOWEfEJJW4SSKucWD","type":"message","authorId":"LhDwXuIl97aqv3MBizvNBCyE","createdAt":"$D2026-05-22T14:32:06.160Z"},{"v0ModelId":"v0-max","content":{"type":"message-binary-format","value":[[0,[["AssistantMessageContentPart",{"part":{"createdAt":1779460333009,"finishedAt":1779460333595,"lastPartSentAt":1779460333595,"taskNameActive":null,"id":"JXkTh1Xiv8XcQ79T","type":"task-thinking-v1","parts":[{"type":"thinking-end","duration":1,"thought":"The user wants me to update the copyright year in the footer from 2025 to 2026. Let me find where the footer is located and make the change."}]}}],["AssistantMessageContentPart",{"part":{"createdAt":1779460334817,"finishedAt":1779460335256,"lastPartSentAt":1779460335228,"taskNameActive":"Finding 2025 references","taskNameComplete":"Found 2025 references","toolCallId":"tooluse_IfC2qyP9Rc5NSDCD70d35e","agentTurnId":"turn_o5rOnU0bBufiRGtC","filePath":null,"id":"Z0Z1sFEi29GHhc6F","type":"task-grep-repo-v1","parts":[{"type":"grepping-repo","pattern":"2025"},{"type":"grep-file-results","numFileMatches":5}]}}],["AssistantMessageContentPart",{"part":{"createdAt":1779460342606,"finishedAt":1779460342897,"lastPartSentAt":1779460342877,"taskNameActive":"Reading footer context","taskNameComplete":"Read footer context","toolCallId":"tooluse_P4yoSBLSP8p7W3IXnStAvV","agentTurnId":"turn_p1PSxhyvN0Po6SJx","filePath":null,"id":"UeKO9URC1wrp1Kpj","type":"task-grep-repo-v1","parts":[{"type":"grepping-repo","pattern":"2025","path":"/components/contact.tsx"},{"type":"grep-file-results","numFileMatches":1}]}}],["AssistantMessageContentPart",{"part":{"createdAt":1779460342952,"finishedAt":1779460342952,"lastPartSentAt":1779460342952,"id":"daQvqw7ys0a1S8sE","type":"task-stopped-v1","parts":[{"type":"out-of-credits"}]}}]]],[1,{}]]},"context":[],"isContentLoading":false,"role":"assistant","id":"1OSwBiE7p3iYCxbDdPq3J7qhdv9oMODr","streaming":false,"finishReason":"tool-calls","vote":"$undefined","parentId":"4aULjD9ySEZsUdIomungLb8qrQvCbHLP","type":"message","creditCost":0.58034425,"workMetrics":{"diffMap":{},"imageGenerationCost":"$undefined","imageGenerationCount":"$undefined","linesRead":"$undefined","agentActions":2},"createdAt":"$D2026-05-22T14:32:06.161Z","updatedAt":"$D2026-05-22T14:32:22.995Z"}],"isLoading":false,"lastSyncedAt":1783847736166,"undo":null,"activeForkKey":["QMP4CEf0Xauiq9x34VRAH4GbiBcgOKdp","fWJC8xh83NTGocCM735mm2mPI8WIAEN5","lTiyonoFR5iHi2OPmsiOaAm5qDPx9WKa","E31kn3gpM0tTRIublwtHAp5PipGohIbz","zrLVqCbSKHopdddecytCkdTK7zGLUocY","fz6wLnLpUiqbArqmgZxNzs7wDEriSqPp","4Z7ljI58ktGU3KYEKRlOa7BQYO0VPZcc","oXRkVh6MLNO1z5SgysH5I4riO6wlTZaS","SjF40gyNcntOjNbPdh179RHx4sGdEY9D","9GizHK5ViNVggseTirF3JM0OWxdPbqIs","3criXsoaagV93rXAt9y1El2Yf4wvrfYU","B6D32eBr5f0OztbRFEUl9307EVe4yFUL","VDUy50qScYPm8dEqb4al3Ltw0Eojnm1v","a4KzIPUEaApLGdCpWSsh0Iww1Yc7epA1","xsLoch73CPXHEoCVqNx8YwxT745aoVfN","hlh3vvdCs6aONDM1dk3HMLosBgGt8V6X","FPlwupWlNbGi37mfywnsceRbBrG4vArr","eV6lDbNZiB1OBAoAFSoXvv9jBpvoTVaJ","WesAvhejhSuAet4vWzvp1C665NZ31yiI","AtGodRRwzqawBoI4k5h0HKzlCvru7Mr8","pD17CMwdho7dCxlMHSbY6j0JkuBNJwD2","INC30p7Snu05JGRWpShviXXTPVMyB05x","ZX07mnxc1rGo552chGJ3XHlr9TmABte9","cjZxGRKtHjMxeC24qjhhT1HDSYejFabl","iv7IXBagNLSK0BntR1l172QMIHFME3xt","3sdNfCLsXKVWeuCn8zIp3jJQkStQlWJY","MWxNdC9hOSF0aKHA1MSQ15hm2VSZeMkg","ZtiuCczhI3Qx85hxs3oMRvvAe4mLHzst","3RzkH95Igzq5ZglZRugv7JF5Plpfs4Qp","rjnBmoDmey8zwIUoLt7VRYJJ2VqJDOCZ","Wa0ADELaZh9lHH92lPKQBesV2szfxZdV","wfasPChfjYMriF6ltyfWdSMjlD2ks3fi","itqr1tBHnm1cZ3znGHaKq0UYdArfqJK8","HsjVPv5IFdSdHBPNWFJDPyRNoF3Uj2TI","5dv6eS4YVOT6w1gSssoZhqUim6bfHX9Q","k9exeI79UR7UYHW9RKvD3LULaX7hzS3l","KZmEMke8ELHwBO2zZpThbdSZQr31wmln","tDQIbvwlH2nbIQZDxdarbTsmgIu49Cly","EWpBf0KoDU4m3W84SzYbNABiDtsWmVjA","p51EWAkWh2LDzbjvAfAb6QuW6j8CgEfs","lpYA7huY4pL020cAvgrjueDNRP0Gpql8","ygiyvEpVUMr3i7ghaUAn22tkd875GSy9","tX5eoyDv1NMOvnN3viejRPDnNEjQcpI1","PNWbnDT3NRCMZnR4A6Ysj05MDW57C1T7","hcqaahm9xfLwyzN3vqF78NYxl8QbKrk3","4v5q9pkzvhs4wFNyhAROozuGvdmN4hG7","dwOM2LbnHg4HXPbF2EzzO4gY2B2ohWF1","9VEZRgGhwpf6AmuzKJlZOapzBKQnlt9E","dr8s6UkMd0UVoJ6EX7jKphgUZPWfxgQ1","V4yEGdjvGKuhXHym3f5yhDlbmcT8ci8x","BpD1KYz8gZjJO8tBxqyYBsdAsCddQQ6h","LFtIAskGTJraMYEcv5pfkwDfW7xYcSTF","hZsR7HHG1OQoARzscD4tb4ZKtzK4Oxot","y4zUwStQ7MOjfaYU0Pxw4VFwbc3HxDf6","8cODfV2HsrfzVklveH16Essxeu07QISI","3cDnGnjkA2Hx3eLlfXb76B1l2kQpBmYh","9fs1H9bCfgbUUT1RWfajen1nizkEWTpi","s5MRAMnkCDUqQ0H4o3dCrHSKHT9BO1yx","faZuyDHv7RpPzqYYb80LO73hcHkjltcf","32nmSJyZ7hBCBIrllKl7xInxYKBuUe77","hTd2jc3kMsvZZw1AAuJKU640blNGh8cs","yPnQecgRxreFJUPqgoTKZI1GVxiWxwe6","gCpYcEJyqMD5lVex5uTNIuJ6G083hFcg","8GnYwzkZ56Mmq4ufPXgFM3bUGZcfxSwS","11nrv6xiYJnzmc73mQGad3vBu19yCKgo","tk5Ob0ghxqzJcjk2FgfJe4b0nFVzJYlW","KHX4SUtKwr2cXPsKFw2qd5BWJv2KhhDb","P8JwH7SCDZGNFqIq1jo2aRfjlwebeGZJ","PNvmgMbdPwGXAH1XvsO8BB0jDoUsv55a","Vt2j9JAtmOQWT4ghHkEpbWrko6To06nw","HMQKobbvyGXLajXqTWmMuwVfRviFzLbm","nEZiv6MJJsZs7nxWublQGmy4QklaHwqi","9dOzLfyYwitRLXVPchuZJA5HVK50wA60","2Y3NVxuLKpWB4lqXYRF5YF1b86vySiic","yMvgTurVBxmFFAa4GJLsL1k3fwBBmVsD","ihLHlIRZ0DO3eqnUFG5qGgcHCXdFXNHR","xKYYBRl8G3jwZh45Qfr2WlgoA6yZn1jJ","Qy47ZCW1Hybe0vzEsd6Ya9qgroIQHcYo","TeQkE6yjRfyFbTfU09ebYBKAnYPlf3qH","bUxPp1dJYLdBYAr1S8NBKduuE0eDpEVd","3Kc3w8qxOAySYBhqTRx9ZrMlGZS5pFIv","Xm8UXBnp2ij03f0rFUGZhURnlBna3lIn","rbRTbRcf5cS5579FkAbPuAJBNSyzaIwl","8iAhmvJzLlj1GbqPUHuY43MpeISVqydk","8nBO1v0QhzHbDyVhA3CfuMUQwo3O14bq","O79jwv59t9y4Hj0omdZ9twIEEKE16EZs","N2KmWdWmJ7eDwLUpSEOCbPJuaLxzIPym","RrC8naczCNFGyGqacpdNLsIak54P3l1G","bTcLPRFovN04rGsfE8zUN7FwOJ7sU1Eo","ySTsT21df6eDf4p42Y5iign4BTENqmNM","5Q8luJ6p4BKpnRhM0nivNTOkEl6yKhaZ","2NNHgETipivKtVUSiBH7dfF6Kju2uSIN","mClm55BnGFeQv6g91LSWaiL7OG2uiEpf","8pTEq1gUWYhlPxvT5seI8i7btOABqzSS","4whDpORizNhLlnCvpSembpUrK3BdiZbM","Qic71caLCzBBcU76ktaCPFSSUOmernfp","QR7QJqWZDLQK4LK0Jfv4DvzmalOiRzYS","VVYNZgWDOfjQXS6nEl226pMufoellkfh","FRvS8VDgEAP9l4Sy8ao6sDzSCO2z2ViK","cxBVtbukP9yMdT5MospOpUhHhX94MNfp","pIiFTgYc5wXStrFw7W3yBm8qip2mg8z6","gfQi419rqWTnCOBk4BkT8Dw6yzxFcnWa","LDMNBzfSDiPSC1MuHFFotNvxuNbbrK4B","qM5Oc9gghXFn2RdcTIvDa3C4BjoNjwbl","GC2rxlqhdt1QX4JCh6WDL1mr0pqOPMD5","RRdwySVIqhgK6B1I5R7z7rrR4smZlf7x","QQViwOaaLYJeF9hYC4nT4OZw5dNCUgDo","OeMXcnz2AoLe0XWsckEE7whROKyfNrBS","T5ASTAd1BInHTlYEL0TSYSkO1iMvua3O","1rs0bHB5BBEcizpwK5PPOs4rnZwf3gMU","VWBLTCxGZ7pOSg1zvelzT5aQAQ74uPAx","XAo6ngtuxmWxN3Q2jWVB5nXVg8MPZo9K","DXIscwXN8wetz0riO3H06OE7H5VR6nKh","aDbiskqyJbRhNJudmEPB3xKHbjbw574y","S5DCLKghuhwKYDEJ4xpdeSMarqvJCpFM","BjUuZYXFgJIvAHZ41ZlkLIJzvL8rsNSh","znRAjIErTzughWhjeBnAXldNDYBeAcTx","rnT5ahAkjEsICuqgp72kvnaRiZ2fTrti","6e6hRDkYX8JQOIqneLxeHd1L5VBVe1xF","mRWvJh2aDDXfKk2zyZeWXgPQp0kpbvzt","an6D1porQimW0uikRJz61QSUT8ga7xnC","ZVm7aSkclARXiNv8gYUByQNQTq8d0XFK","0ywb2GVKrzYyIzrdIco3wDzIFuwt5heT","hztC5RFc7ipfYvVAC2ZiuTLazuJpISFL","O0sGBKjwmWqGVntCkWHpukLNnu7HkcVb","CEnVbr1pzdPFBynLi2MSkJhp66UIarCu","0RjrIElFXbx64mt3218ZFysifzj18ug6","puuKIy4qsT6DLpdU6kSxO0rKFVCmQZ0u","sTT5YATR3EONfwZj8G6vfe5jIqyJFEQa","vAgfR4sPJWQGcv4fh0yuRZw2qaL1r78v","TWlh2XGiay3smurRF1pPFHBW9Dafbn6q","28PHW9upXtFC8SIHflzmNPos2forpxgz","l4E9KWQOyLavr3dJWBqXZioKXxagVyrz","eG1BIXXJicO0ZSSLNoZgK6nuHFD7LohZ","lO23XxS4lseIHEfH5ZmPJBrrweXuoRJy","1GWgxFzMZ3d3ppAriZfFejRHQd9u6z2j","ZnGCJDhPOO9EjvESwMPXcER3f0GROj8T","grb0pt4aJOOFtIL7Rdxnl0alccEthzri","WqDNxeKknYkM6W79DfqbxjdIou1zRKca","r5ZgZfIF1NdrGeNUE8neQaBRcqIeM2Um","umoWWbKIXo9zWwyqgvgicsEzp7ZbE0DW","zzTQFtP0bW8yWcJ26N0PPY79tB80ICHR","8kEMzKlv1IWephVxCuVLhLWNSjntnW5n","auu8H1nxH7j38jHcrb1H00uV4YxpIw9k","um6iE9yAZcIFHSmVM9wdnzecWqh3EHMY","BHT4TqLtaGTGwK0IVkMRYX8WuRJCwev4","p3izOhd3AzFSQVFrO42Gt4l8HK7crPkI","So7Br64M2GlHcfl2NfPwJEhxPkO3DwGn","u3y9GDL94kPgXkfoGxhiSxiZMMh4TU6b","uFuKBrkEfK48bT4eujS7vRil5AMW1KLS","svZItPn92mm0EbFUtsd0qGXyuPirbZIf","wYQS5yDQqu2d3iRlU8y7zjO3ma3T75oK","rrFjQxkyR8fyZMm0wpZEpqR03jQNoWWt","Xgs5rkI1lg76DDPJZDHk9rSIm8fMF9wo","kaC2kwVbzmpIoII46JcYduUQbP1f8QEc","vWTo2jTMVug80iAqXxOS1SakX4KNG0kv","vEqH2ID8QdS7SaRYGSeVX6np0wDOdTpY","KAn7B86joKqavhvBngd4iWuw9zOGXIXJ","Fa1yLEpIO4XEYHY8HJh9ZcMFrCbUYFLA","qWxnypTySo6KU8wJg9bQmWG4lSOfA0yy","9lItHDHgyywnizbwBlkIJ6SoTUKxQWq7","0GaxN8hU2S14Xf4ZpXDrw8qqmpZ07lCj","pGSt4x3PdsySTTc79v2CriVQOXkDTxGw","N27RWbxwCp3rjpdC0l5fSV0s7PDweelQ","MhwNC386vX1K6Ll6YQulqLXuloUigJuS","5Z2J9SpK23EQN69HOmpXLa95vRvylmXG","KzMgX28bD8gCiijOpnxU88kWPoq9HrN4","BaDSGvZ090ruuXhFpFYvqxSXrbXeZrt2","e1ELNcSFRSTAT2OvxAkFGnp6Qb9YVQHg","jua2g9q6gXdM7MMq6AvywCaxl40gXud5","10MpxNghFDYwxRW6aVXAZ4PKFeerAYZh","XWJ5hpGaRVIDobYcByzW5h9n2AQ2ELx6","r6R4wVl4AXSXgxHAl6eBftFvtInIosnD","WwNN3zKNC9sxuV2P71Extr3tHO0V29qQ","0ITp62JB2iWnfkhZpAsaNELLoHMUXHjB","2bb0R2VRKqdxc7Rrlanpfl92ZydydzVA","OmTtCGaqDtt3lJq4PRu17hhBL9hkNorm","Ux0A2crpgnDWM6Hh40z152JrfnN4KMiP","TJ8ZCUodM8HDury5K6kpK6lCBfB4Nvyy","kMxX9TqQEIKv7ITLoINILXTXYKtVGUSX","sFyOE7iub3FcZi1Rt714Yn2hJeRclutW","1xez9F1Yoo0WvlmAi3mEsZ6TzpyEQaxc","nrBQTmo1a0O76EhDMwuX1BZ2hWO6OSt3","vjuBO03KxD07U8J1KdXWGgz3P4FRJUZR","ZsWcGaWmoplCZN5vEM51JTk0oLlrvnbL","WLO3m5ritkrXJ07ltT1NwX3c8PcFzQop","7VIYXL7uChhpdVUqL5YpRZLADE84VxAH","l8VLrUyJTZSKWTDlOWEfEJJW4SSKucWD","4aULjD9ySEZsUdIomungLb8qrQvCbHLP","1OSwBiE7p3iYCxbDdPq3J7qhdv9oMODr"],"isStreaming":false,"isStopping":false,"isAuthor":false,"isRestoring":false,"hashMessageId":null,"initialStreamPromise":"$undefined"},"@\"active-block\",\"evQt7mukU4u\",":{"id":"b_YiFrqRedxkD","meta":{"taskNameActive":"Adding scrollable display","taskNameComplete":"Added scrollable display","type":"code-project","id":"Code"},"initial":true,"type":"code-project","messageId":"l8VLrUyJTZSKWTDlOWEfEJJW4SSKucWD","language":"typescriptreact","source":"$98","resultId":"$undefined","closed":true,"hasSourceBeenEdited":false,"lastEditedAt":"$undefined","lastDeployedAt":"2026-06-12T02:55:11.410Z","latestDeploymentInfo":"$91:4:1","templateVersionId":"$undefined","templateCanonId":"$undefined","forkedFromBlockId":"$undefined","isLoading":false,"needsBlockSource":false},"@\"chat:meta\",\"evQt7mukU4u\",":{"title":"Resume website makeover","isNew":false,"authorId":"LhDwXuIl97aqv3MBizvNBCyE","ownerId":"LhDwXuIl97aqv3MBizvNBCyE","storageEntityType":"github","storageEntityId":"kreddington41/v0-kelly-resume-website","tailwindV4Default":true,"vercelProjectId":"prj_vGi8oPPnowAbASNYPO0G0TEf950v","canWriteToChat":false,"from":"$undefined","nextVersionDefault":"$undefined","nextVersion15Default":"$undefined"},"@\"chat:privacy\",\"evQt7mukU4u\",":"public","@\"chat:vm-mode\",\"evQt7mukU4u\",":true,"@\"chat:persisted\",\"evQt7mukU4u\",":true,"@\"chat:vercel-project\",\"evQt7mukU4u\",":"$undefined","@\"chat:show-v0-button\",\"evQt7mukU4u\",":false,"@\"team:sensitive-environment-variable-policy\",\"evQt7mukU4u\",":"$undefined","projects:for-user":{"projects":[],"selectedProjectId":null},"project:can-make-project-updates":"$undefined","@\"block-view\",\"evQt7mukU4u\",":true,"integrations:figma":"$@99"},"children":["$L9a","$L9b","$L9c","$L9d"]}]}]}]
</article></body></html>