- DECLEANUP NETWORK
+ {/* Main title — DECLEANUP NETWORK (gradient on NETWORK + pulse) */}
+
+
+ DECLEANUP
+ {" "}
+ NETWORK
- {/* Subheading */}
-
- Turn environmental action into digital assets + {/* Headline */} +
+ Real cleanups. Real proof. Real impact.
- {/* Description */} -- Join the global network of individuals and communities tokenizing - environmental impact of cleanups utilizing DeCleanup Network tools + {/* Subheadline */} +
+ A global platform that verifies environmental cleanups and turns them + into measurable, fundable impact.
- {/* Stylish Breaker */} -- How to Tokenize Impact? + How to Tokenize Impact
++ Three steps from cleanup to verified, tokenized impact. +
{step.title}
@@ -71,15 +79,14 @@ const TokenizeImpactSection = () => {Join the Movement
- -- Connect with our growing community on social media, and explore everything you need to start contributing to a cleaner environment today. +
+ Connect with our community and explore everything you need to + contribute to a cleaner environment.
- - {/* Social Buttons */} -
- Earn DeCleanup Rewards today
+ {/* Section Header — after hero: EARN DECLEANUP REWARDS TODAY */}
+
+
+ EARN DECLEANUP REWARDS TODAY
-
- Choose how you want to log cleanups, earn, and govern our impact
- network.
+
+ Choose your path to impact. Start with our Base Mini App for quick
+ rewards or dive into the full ecosystem on Celo.
@@ -87,10 +87,11 @@ const UseDeCleanupToday = () => {
{/* Base Cards - Side by Side */}
+ {/* Base / Celo CTA cards: Aura-style hover-reactive glow (subtle border + shadow) */}
{apps.slice(0, 2).map((app, index) => (
{/* Chain Label */}
@@ -210,7 +211,7 @@ const UseDeCleanupToday = () => {
href={app.buttonHref}
target="_blank"
rel="noopener noreferrer"
- className="w-full bg-[#FAFF00] text-black font-bold text-sm sm:text-base tracking-wider hover:bg-[#FAFF00]/90 transition-colors duration-200 border-2 border-[#FAFF00] normal-case hover:scale-105 hover:shadow-[0_0_20px_rgba(250,255,0,0.4)] transition-all duration-300 text-center block px-6 py-3"
+ className="w-full bg-[#FAFF00] text-black font-medium text-sm sm:text-base tracking-wider hover:bg-[#FAFF00]/90 transition-colors duration-200 border border-[#FAFF00] normal-case hover:shadow-[0_0_20px_rgba(250,255,0,0.25)] transition-all duration-300 text-center block px-6 py-3 rounded-xl"
style={{ textTransform: "none" }}
>
{app.buttonLabel}
@@ -223,7 +224,7 @@ const UseDeCleanupToday = () => {
href={app.secondButtonHref}
target="_blank"
rel="noopener noreferrer"
- className="w-full bg-black text-[#FAFF00] font-bold text-sm sm:text-base tracking-wider hover:bg-gray-900 transition-colors duration-200 border-2 border-[#FAFF00] normal-case hover:scale-105 hover:shadow-[0_0_20px_rgba(250,255,0,0.4)] transition-all duration-300 text-center block px-6 py-3"
+ className="w-full bg-black text-[#FAFF00] font-medium text-sm sm:text-base tracking-wider hover:bg-gray-900 transition-colors duration-200 border border-[#FAFF00] normal-case hover:shadow-[0_0_20px_rgba(250,255,0,0.2)] transition-all duration-300 text-center block px-6 py-3 rounded-xl"
style={{ textTransform: "none" }}
>
{app.secondButtonLabel}
@@ -234,9 +235,9 @@ const UseDeCleanupToday = () => {
))}
- {/* Celo Card - Full Width */}
+ {/* Celo Card - Full Width; same hover-reactive glow */}
{apps[2] && (
-
+
{/* Chain Label */}
{
href={apps[2].buttonHref}
target="_blank"
rel="noopener noreferrer"
- className="w-full bg-[#FAFF00] text-black font-bold text-sm sm:text-base tracking-wider hover:bg-[#FAFF00]/90 transition-colors duration-200 border-2 border-[#FAFF00] normal-case hover:scale-105 hover:shadow-[0_0_20px_rgba(250,255,0,0.4)] transition-all duration-300 text-center block px-6 py-3"
+ className="w-full bg-[#FAFF00] text-black font-medium text-sm sm:text-base tracking-wider hover:bg-[#FAFF00]/90 transition-colors duration-200 border border-[#FAFF00] normal-case hover:shadow-[0_0_20px_rgba(250,255,0,0.25)] transition-all duration-300 text-center block px-6 py-3 rounded-xl"
style={{ textTransform: "none" }}
>
{apps[2].buttonLabel}
diff --git a/components/WhatIsDecleanUp/WhatIsDeCleanupNetwork.tsx b/components/WhatIsDecleanUp/WhatIsDeCleanupNetwork.tsx
index a14f381..e1f2536 100644
--- a/components/WhatIsDecleanUp/WhatIsDeCleanupNetwork.tsx
+++ b/components/WhatIsDecleanUp/WhatIsDeCleanupNetwork.tsx
@@ -1,107 +1,117 @@
import React from "react";
export default function WhatIsDeCleanupNetwork() {
- const problems = [
- "Lack of incentives for cleanup actions",
- "Limits for recognition and quantification of impact",
- "Weak global coordination",
- ];
-
- const solutions = [
- "Tokenizing impact into Impact Products and tokens",
- "Scalable personal recognition system",
- "Network of coordinated action",
- ];
-
return (
-
-
- {/* Section Header */}
-
-
- What is DeCleanup Network?
-
-
-
- {/* Content Section - Image and Description Side by Side */}
-
- {/* Left: Image with Yellow Frame */}
-
-
-
+
+
+
+ {/* LEFT — Visual DMRV: gradient, concentric circles, placeholders, overlay */}
+
+ {/* Abstract gradient background */}
+ className="absolute inset-0 bg-[radial-gradient(ellipse_at_top_right,_var(--tw-gradient-stops))] from-neutral-800 via-neutral-950 to-black"
+ aria-hidden
+ />
+ {/* Concentric circles animation */}
+
+
+
+
+
-
-
- {/* Right: Description */}
-
-
-
- DeCleanup Network transforms environmental action into transparent, verifiable digital impact.
-
-
- Your cleanups become tokenized assets that unlock rewards, reputation, and community recognition.
-
+ {/* Placeholder: Community impact (nodes / growth) — top-left area */}
+
+
+ Community impact visualization
-
-
- {/* Problem-Solution Section */}
-
-
- {/* Problem Section */}
-
-
+
-
- {problems.map((problem, index) => (
-
-
- {problem}
-
-
- ))}
-
+
- THE SOLUTION
-
-
- {solutions.map((solution, index) => (
-
-
- {solution}
-
+ {/* UI overlay: Total Impact — LIVE (lighter so label and border are visible) */}
+
+
+
+ Total Impact
+
+ LIVE
+
- ))}
+
+
+ {/* RIGHT — DMRV Explanation */}
+
+
+ DMRV: Digital Monitoring, Reporting & Verification
+
+
+ DeCleanup provides an open-source DMRV system that turns real-world
+ cleanup actions into trusted, auditable digital data.
+
+
+
+ NGOs
+
+ Transparent impact verification & reporting
+
+
+
+
+ Corporates
+
+
+ ESG data & sponsored cleanups
+
+
+
+ Sponsors
+
+ Fund & track large-scale actions
+
-
+
);
}
diff --git a/components/WhoIsThisFor/WhoIsThisFor.tsx b/components/WhoIsThisFor/WhoIsThisFor.tsx
new file mode 100644
index 0000000..6883cef
--- /dev/null
+++ b/components/WhoIsThisFor/WhoIsThisFor.tsx
@@ -0,0 +1,113 @@
+import React from "react";
+import Link from "next/link";
+
+export default function WhoIsThisFor() {
+ return (
+
+
+ {/* Section title */}
+
+ Who is this for?
+
+
+ Different ways to take part in DeCleanup.
+
+
+
+ {/* Card 1 — Environmental Activists (People who clean, care, and act) */}
+
+
+ People who clean, care, and act
+
+
+ People who care about the planet
+
+
+ You clean up nature. We help you prove it and get support for it.
+
+
+ - • Join or organize cleanup actions
+ - • Take photos of the result
+ - • Get recognition and rewards for real impact
+
+
+ “Finally, my cleanup actually counts.”
+
+
+ Start a cleanup →
+
+
+ No crypto knowledge needed
+
+
+
+ {/* Card 2 — Impact Builders & Governors (Web3-native, but impact-first) */}
+
+
+ Web3-native, but impact-first
+
+
+ People who build and coordinate impact
+
+
+ Use on-chain tools to coordinate cleanups, rewards, and community
+ governance.
+
+
+ - • Participate in governance and proposals
+ - • Help shape how impact is verified and rewarded
+ - • Build on open, impact-focused infrastructure
+
+
+ “This is public-good Web3 that actually touches the real
+ world.”
+
+
+ Explore how the network works →
+
+
+ For Web3-native users
+
+
+
+ {/* Card 3 — Investors & Impact Sponsors (Capital with intention) */}
+
+
+ Capital with intention
+
+
+ People who fund real-world impact
+
+
+ Support verified environmental cleanups and help scale them
+ globally.
+
+
+ - • Fund cleanup actions at scale
+ - • Support open verification infrastructure
+ - • Hold tokens connected to real-world impact
+
+
+ “My capital supports something real and measurable.”
+
+
+ See how funding works →
+
+
+ Transparent · Trackable · Verifiable
+
+
+
+
+
+ );
+}
+ EARN DECLEANUP REWARDS TODAY
-- Choose how you want to log cleanups, earn, and govern our impact - network. +
+ Choose your path to impact. Start with our Base Mini App for quick + rewards or dive into the full ecosystem on Celo.
- What is DeCleanup Network? -
-- DeCleanup Network transforms environmental action into transparent, verifiable digital impact. -
-- Your cleanups become tokenized assets that unlock rewards, reputation, and community recognition. -
+ {/* Placeholder: Community impact (nodes / growth) — top-left area */} ++
-- {problem} -
-- THE SOLUTION -
-- {solution} -
+ {/* UI overlay: Total Impact — LIVE (lighter so label and border are visible) */} ++ DMRV: Digital Monitoring, Reporting & Verification +
++ DeCleanup provides an open-source DMRV system that turns real-world + cleanup actions into trusted, auditable digital data. +
+NGOs
++ Transparent impact verification & reporting +
++ Corporates +
++ ESG data & sponsored cleanups +
+Sponsors
++ Fund & track large-scale actions +
+ Who is this for? +
++ Different ways to take part in DeCleanup. +
+ ++ People who clean, care, and act +
++ People who care about the planet +
++ You clean up nature. We help you prove it and get support for it. +
+-
+
- • Join or organize cleanup actions +
- • Take photos of the result +
- • Get recognition and rewards for real impact +
+ “Finally, my cleanup actually counts.” +
+ + Start a cleanup → + ++ No crypto knowledge needed +
++ Web3-native, but impact-first +
++ People who build and coordinate impact +
++ Use on-chain tools to coordinate cleanups, rewards, and community + governance. +
+-
+
- • Participate in governance and proposals +
- • Help shape how impact is verified and rewarded +
- • Build on open, impact-focused infrastructure +
+ “This is public-good Web3 that actually touches the real + world.” +
+ + Explore how the network works → + ++ For Web3-native users +
++ Capital with intention +
++ People who fund real-world impact +
++ Support verified environmental cleanups and help scale them + globally. +
+-
+
- • Fund cleanup actions at scale +
- • Support open verification infrastructure +
- • Hold tokens connected to real-world impact +
+ “My capital supports something real and measurable.” +
+ + See how funding works → + ++ Transparent · Trackable · Verifiable +
+