crypto-commons-gather.ing-w.../app/sponsorships/page.tsx

327 lines
13 KiB
TypeScript

import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import { ArrowRight, Mail, Download } from "lucide-react"
import Image from "next/image"
import Link from "next/link"
import SponsorshipFlipbook from "@/components/sponsorship-flipbook"
export default function SponsorshipsPage() {
return (
<div className="min-h-screen">
{/* Hero Section */}
<section className="relative min-h-[50vh] flex items-center justify-center overflow-hidden">
<div
className="absolute inset-0 bg-cover bg-center z-0"
style={{
backgroundImage: `url('/images/20220505-113225.jpg')`,
}}
/>
<div className="absolute inset-0 bg-gradient-to-b from-background/90 via-background/80 to-background z-[1]" />
<div className="container mx-auto px-4 relative z-10 text-center max-w-4xl py-20">
<p className="text-sm font-mono text-primary mb-3 tracking-wider uppercase">Partner with us</p>
<h1 className="text-4xl md:text-6xl font-black mb-6 text-balance leading-tight">
Sponsor CCG 2026
</h1>
<p className="text-lg md:text-xl text-muted-foreground text-pretty max-w-2xl mx-auto mb-8">
A week-long unconference in the Austrian Alps bringing together 100+ builders, researchers,
and activists shaping regenerative futures. Now in its 6th edition.
</p>
<div className="flex flex-col sm:flex-row gap-4 justify-center">
<Button size="lg" className="gap-2" asChild>
<a href="mailto:contact@cryptocommonsgather.ing?subject=CCG26 Sponsorship Inquiry">
<Mail className="w-4 h-4" />
Get in Touch
</a>
</Button>
<Button size="lg" variant="outline" className="gap-2" asChild>
<a href="/CCG26-Sponsorship-Package.pdf" download>
<Download className="w-4 h-4" />
Download Full Package
</a>
</Button>
</div>
</div>
</section>
{/* Quick Stats + Why */}
<section className="py-16 px-4 bg-muted/30">
<div className="container mx-auto max-w-4xl">
<h2 className="text-2xl font-bold text-center mb-8">Sponsor the continuation of a legacy</h2>
<div className="grid grid-cols-3 gap-4 mb-12">
<div className="text-center">
<div className="text-3xl font-black text-primary">300+</div>
<p className="text-sm text-muted-foreground">Total Attendees</p>
</div>
<div className="text-center">
<div className="text-3xl font-black text-primary">15+</div>
<p className="text-sm text-muted-foreground">Countries</p>
</div>
<div className="text-center">
<div className="text-4xl font-black text-primary leading-none">&infin;</div>
<p className="text-sm text-muted-foreground">Real Value Produced</p>
</div>
</div>
<p className="text-center text-muted-foreground max-w-2xl mx-auto">
Over five editions, CCG has catalyzed movements like <strong className="text-foreground">#ReFi</strong>,{" "}
<strong className="text-foreground">#CoFi</strong>, and{" "}
<strong className="text-foreground">#MycoFi</strong>, and built an active community
of 500+ members. Our attendees include teams from Commons Stack, BlockScience, Regen Network, EthicHub,
Circles UBI, Holochain, Economic Space Agency, zkNetwork, and more.
</p>
</div>
</section>
{/* Photo Strip */}
<section className="py-0 px-0">
<div className="grid grid-cols-3 gap-0">
<div className="relative aspect-[16/10] overflow-hidden">
<Image
src="/images/20220830-104828.jpg"
alt="CCG courtyard gathering"
fill
className="object-cover"
sizes="33vw"
/>
</div>
<div className="relative aspect-[16/10] overflow-hidden">
<Image
src="/images/20220502-103036.jpg"
alt="CCG workshop session"
fill
className="object-cover"
sizes="33vw"
/>
</div>
<div className="relative aspect-[16/10] overflow-hidden">
<Image
src="/images/20220901-085249.jpg"
alt="CCG morning view"
fill
className="object-cover"
sizes="33vw"
/>
</div>
</div>
</section>
{/* Sponsorship Tiers at a Glance */}
<section className="py-24 px-4">
<div className="container mx-auto max-w-4xl">
<div className="text-center mb-12">
<h2 className="text-3xl md:text-4xl font-bold mb-4 text-balance">Sponsorship Tiers</h2>
<p className="text-muted-foreground max-w-xl mx-auto">
We're seeking ~€10,000 in total sponsorship to cover coordination, accessibility,
and documentation costs. Three tiers available:
</p>
</div>
<div className="grid md:grid-cols-3 gap-6 mb-8">
<Card className="border-primary/40 relative overflow-hidden">
<div className="absolute top-0 left-0 right-0 h-1 bg-primary" />
<CardContent className="p-6 pt-8 text-center">
<h3 className="text-xl font-black mb-1">FIRST AMONG EQUALS</h3>
<div className="text-3xl font-black text-primary mb-4">€5,000</div>
<p className="text-sm text-muted-foreground">
2 event tickets, lodging and food, sponsored session, logo everywhere, pre &amp; post-event spotlight
</p>
</CardContent>
</Card>
<Card className="border-primary/20">
<CardContent className="p-6 text-center">
<h3 className="text-xl font-black mb-1">VANGUARD</h3>
<div className="text-3xl font-black text-primary mb-4">€2,500</div>
<p className="text-sm text-muted-foreground">
1 event ticket, logo on site &amp; signage, social media &amp; newsletter mention
</p>
</CardContent>
</Card>
<Card className="border-primary/20">
<CardContent className="p-6 text-center">
<h3 className="text-xl font-black mb-1">COMRADE</h3>
<div className="text-3xl font-black text-primary mb-4">€1,000</div>
<p className="text-sm text-muted-foreground">
50% off event ticket, name on supporters section, social media thank-you
</p>
</CardContent>
</Card>
</div>
<p className="text-center text-sm text-muted-foreground">
We also welcome alternative partnerships: track sponsorship, meal sponsorship, travel grants,
documentation support, and in-kind technology contributions.
</p>
</div>
</section>
{/* Flipbook Deck */}
<section className="py-24 px-4 bg-muted/30">
<div className="container mx-auto max-w-5xl">
<div className="text-center mb-8">
<h2 className="text-3xl font-bold mb-4">Full Sponsorship Deck</h2>
<p className="text-muted-foreground max-w-lg mx-auto">
Browse the complete partnership deck with tier details, audience profile,
budget breakdown, and more.
</p>
</div>
<SponsorshipFlipbook />
<div className="flex justify-center mt-6">
<Button variant="outline" size="sm" className="gap-2" asChild>
<a href="/CCG26-Sponsorship-Package.pdf" download>
<Download className="w-3.5 h-3.5" />
Download PDF
</a>
</Button>
</div>
</div>
</section>
{/* CTA Section */}
<section className="py-24 px-4 relative overflow-hidden">
<div
className="absolute inset-0 bg-cover bg-center"
style={{
backgroundImage: `url('/images/20220430-170329.jpg')`,
}}
/>
<div className="absolute inset-0 bg-primary/90" />
<div className="container mx-auto max-w-3xl text-center relative z-10">
<h2 className="text-3xl md:text-4xl font-bold mb-6 text-balance text-primary-foreground">
Let's Build Together
</h2>
<p className="text-lg text-primary-foreground/90 mb-8 text-pretty max-w-xl mx-auto">
We're seeking partners who share our vision of regenerative, cooperative,
and commons-based futures not just logo placement.
</p>
<div className="flex flex-col sm:flex-row gap-4 justify-center mb-8">
<Button size="lg" variant="secondary" className="gap-2" asChild>
<a href="mailto:contact@cryptocommonsgather.ing?subject=CCG26 Sponsorship Inquiry">
<Mail className="w-4 h-4" />
Reach Out <ArrowRight className="w-4 h-4" />
</a>
</Button>
</div>
<p className="text-sm text-primary-foreground/70">
contact@cryptocommonsgather.ing
</p>
</div>
</section>
{/* Footer */}
<footer className="py-12 px-4 border-t border-border">
<div className="container mx-auto max-w-6xl">
<div className="grid sm:grid-cols-2 md:grid-cols-4 gap-8 mb-8">
<div>
<h3 className="font-bold mb-4">CCG 2026</h3>
<p className="text-sm text-muted-foreground">
Crypto Commons Gathering
<br />
August 16-22, 2026
</p>
</div>
<div>
<h3 className="font-semibold mb-4 text-sm">Links</h3>
<ul className="space-y-2 text-sm">
<li>
<Link href="/register" className="text-muted-foreground hover:text-foreground transition-colors">
Register to Attend
</Link>
</li>
<li>
<Link href="/gallery" className="text-muted-foreground hover:text-foreground transition-colors">
Gallery
</Link>
</li>
<li>
<Link href="/about" className="text-muted-foreground hover:text-foreground transition-colors">
About CCG 2026
</Link>
</li>
<li>
<Link href="/directions" className="text-muted-foreground hover:text-foreground transition-colors">
Directions
</Link>
</li>
<li>
<Link href="/transparency" className="text-muted-foreground hover:text-foreground transition-colors">
Financial Transparency
</Link>
</li>
</ul>
</div>
<div>
<h3 className="font-semibold mb-4 text-sm">Community</h3>
<ul className="space-y-2 text-sm">
<li>
<Link
href="https://t.me/+n5V_wDVKWrk1ZTBh"
className="text-muted-foreground hover:text-foreground transition-colors"
target="_blank"
rel="noopener noreferrer"
>
Join the CCG26 Telegram
</Link>
</li>
<li>
<Link
href="https://t.me/+gZjhNaDswIc0ZDg0"
className="text-muted-foreground hover:text-foreground transition-colors"
target="_blank"
rel="noopener noreferrer"
>
Join the Crypto Commons Association Telegram
</Link>
</li>
</ul>
</div>
<div>
<h3 className="font-semibold mb-4 text-sm">Partners</h3>
<ul className="space-y-2 text-sm">
<li>
<Link
href="https://www.commons-hub.at/"
className="text-muted-foreground hover:text-foreground transition-colors"
target="_blank"
rel="noopener noreferrer"
>
Commons Hub
</Link>
</li>
<li>
<Link
href="https://crypto-commons.org"
className="text-muted-foreground hover:text-foreground transition-colors"
target="_blank"
rel="noopener noreferrer"
>
Crypto Commons Association
</Link>
</li>
<li>
<Link href="/sponsorships" className="text-muted-foreground hover:text-foreground transition-colors">
Sponsorships
</Link>
</li>
</ul>
</div>
</div>
<div className="pt-8 border-t border-border text-center text-sm text-muted-foreground">
<p>This website is under a Creative Commons license. Built with solidarity for the commons.</p>
</div>
</div>
</footer>
</div>
)
}