190 lines
9.2 KiB
TypeScript
190 lines
9.2 KiB
TypeScript
import Link from "next/link"
|
|
import { Button } from "@/components/ui/button"
|
|
import { Card, CardContent } from "@/components/ui/card"
|
|
import { Navigation } from "@/components/navigation"
|
|
import { Footer } from "@/components/footer"
|
|
import { Music, Instagram, Sprout, Heart, Users } from "lucide-react"
|
|
|
|
export default function HomePage() {
|
|
return (
|
|
<div className="min-h-screen flex flex-col">
|
|
<Navigation />
|
|
|
|
<section className="relative pt-24 pb-16 px-4 sm:px-6 lg:px-8">
|
|
<div className="absolute inset-0 z-0">
|
|
<img
|
|
src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/IMG_20251102_112213_925-XnDB5Tj5KFyS6c2Wr6RZVmZfqeQ1FG.jpg"
|
|
alt="Stone sculpture with moss crown - embodying the soul speaks soil philosophy"
|
|
className="w-full h-full object-cover"
|
|
/>
|
|
<div className="absolute inset-0 bg-gradient-to-b from-background/80 via-background/70 to-background"></div>
|
|
</div>
|
|
<div className="container mx-auto relative z-10">
|
|
<div className="max-w-4xl mx-auto text-center">
|
|
<div className="inline-flex items-center gap-2 bg-primary/90 text-primary-foreground px-4 py-2 rounded-full text-sm font-medium mb-6 shadow-lg">
|
|
<Sprout className="h-4 w-4" />
|
|
<span>Where Soul Meets Soil</span>
|
|
</div>
|
|
<h1 className="text-5xl sm:text-6xl lg:text-7xl font-display font-bold text-foreground mb-6 text-balance tracking-tight drop-shadow-lg">
|
|
Soul Speaks Soil
|
|
</h1>
|
|
<p className="text-xl text-foreground/90 mb-8 leading-relaxed text-pretty drop-shadow-md">
|
|
Join host Sammy Davies for deep conversations exploring the profound connection between our inner world
|
|
and the earth beneath our feet.
|
|
</p>
|
|
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
|
<Button asChild size="lg" className="text-lg shadow-lg">
|
|
<a href="https://open.spotify.com/show/soul-speaks-soil" target="_blank" rel="noopener noreferrer">
|
|
<Music className="mr-2 h-5 w-5" />
|
|
Listen on Spotify
|
|
</a>
|
|
</Button>
|
|
<Button
|
|
asChild
|
|
variant="outline"
|
|
size="lg"
|
|
className="text-lg bg-background/80 backdrop-blur-sm shadow-lg"
|
|
>
|
|
<Link href="/episodes">Browse Episodes</Link>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section className="py-12 px-4 sm:px-6 lg:px-8 bg-muted/30 organic-texture">
|
|
<div className="container mx-auto">
|
|
<div className="max-w-3xl mx-auto">
|
|
<div className="flex flex-col md:flex-row gap-8 items-center">
|
|
<div className="w-48 h-48 rounded-full overflow-hidden bg-primary/5 shadow-lg flex-shrink-0">
|
|
<img
|
|
src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/images%20%281%29-olhoH5SYKWP3oh7CsSHrhNrGws8GFU.jpeg"
|
|
alt="Sammy Davies - Host of Soul Speaks Soil"
|
|
className="w-full h-full object-cover"
|
|
/>
|
|
</div>
|
|
<div className="text-center md:text-left">
|
|
<h2 className="text-2xl sm:text-3xl font-display font-bold text-foreground mb-3 text-balance">
|
|
Hosted by Sammy Davies
|
|
</h2>
|
|
<p className="text-muted-foreground leading-relaxed text-pretty">
|
|
Director of Sustainability & Brand at EcoSafe Zero Waste, MBA Candidate in Sustainable Innovation, and
|
|
passionate advocate for soil health, composting education, and regenerative storytelling.
|
|
</p>
|
|
<Button asChild variant="outline" className="mt-4 bg-transparent">
|
|
<Link href="/about">Learn More About Sammy</Link>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 mycelial-pattern">
|
|
<div className="container mx-auto">
|
|
<div className="max-w-6xl mx-auto">
|
|
<div className="grid md:grid-cols-2 gap-6">
|
|
<div className="aspect-square rounded-xl overflow-hidden bg-primary/5 shadow-lg">
|
|
<img
|
|
src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/IMG_20251102_112207_223-IXghjBiGqE5Eu3b7U3lVXN1spTvTgn.jpg"
|
|
alt="Vibrant green moss growing on decaying wood - the cycle of life and soil"
|
|
className="w-full h-full object-cover"
|
|
/>
|
|
</div>
|
|
<div className="aspect-square rounded-xl overflow-hidden bg-primary/5 shadow-lg">
|
|
<img
|
|
src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/IMG_20251102_112203_809-qlO7ndE3aT5sOPWioTlv9j69EyUiRF.jpg"
|
|
alt="Sammy Davies in her garden with composting systems and natural elements"
|
|
className="w-full h-full object-cover"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* About Preview Section with organic texture background */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-muted/30 organic-texture">
|
|
<div className="container mx-auto">
|
|
<div className="max-w-4xl mx-auto">
|
|
<div className="grid md:grid-cols-3 gap-8">
|
|
<Card className="border-2">
|
|
<CardContent className="pt-6">
|
|
<div className="flex flex-col items-center text-center">
|
|
<div className="h-12 w-12 rounded-full bg-primary/10 flex items-center justify-center mb-4">
|
|
<Heart className="h-6 w-6 text-primary" />
|
|
</div>
|
|
<h3 className="text-lg font-display font-semibold text-foreground mb-2">Authentic Conversations</h3>
|
|
<p className="text-muted-foreground leading-relaxed">
|
|
Real, unfiltered discussions about sustainability, growth, and connection.
|
|
</p>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="border-2">
|
|
<CardContent className="pt-6">
|
|
<div className="flex flex-col items-center text-center">
|
|
<div className="h-12 w-12 rounded-full bg-primary/10 flex items-center justify-center mb-4">
|
|
<Users className="h-6 w-6 text-primary" />
|
|
</div>
|
|
<h3 className="text-lg font-display font-semibold text-foreground mb-2">Diverse Guests</h3>
|
|
<p className="text-muted-foreground leading-relaxed">
|
|
Featuring farmers, activists, artists, and thought leaders.
|
|
</p>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="border-2">
|
|
<CardContent className="pt-6">
|
|
<div className="flex flex-col items-center text-center">
|
|
<div className="h-12 w-12 rounded-full bg-primary/10 flex items-center justify-center mb-4">
|
|
<Sprout className="h-6 w-6 text-primary" />
|
|
</div>
|
|
<h3 className="text-lg font-display font-semibold text-foreground mb-2">Rooted in Nature</h3>
|
|
<p className="text-muted-foreground leading-relaxed">
|
|
Exploring our relationship with the earth and each other.
|
|
</p>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* CTA Section with deeper earth tones */}
|
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-primary text-primary-foreground relative overflow-hidden">
|
|
<div className="absolute inset-0 opacity-10">
|
|
<div
|
|
className="absolute inset-0"
|
|
style={{
|
|
backgroundImage: `radial-gradient(circle at 30% 50%, currentColor 1px, transparent 1px),
|
|
radial-gradient(circle at 70% 30%, currentColor 1px, transparent 1px),
|
|
radial-gradient(circle at 50% 80%, currentColor 1px, transparent 1px)`,
|
|
backgroundSize: "100px 100px, 150px 150px, 120px 120px",
|
|
}}
|
|
></div>
|
|
</div>
|
|
<div className="container mx-auto relative z-10">
|
|
<div className="max-w-3xl mx-auto text-center">
|
|
<h2 className="text-3xl sm:text-4xl font-display font-bold mb-4 text-balance">Join the Conversation</h2>
|
|
<p className="text-lg mb-8 opacity-90 leading-relaxed text-pretty">
|
|
Follow us on Instagram for behind-the-scenes content, episode updates, and community discussions.
|
|
</p>
|
|
<Button asChild size="lg" variant="secondary" className="text-lg">
|
|
<a href="https://instagram.com/soulspeakssoil" target="_blank" rel="noopener noreferrer">
|
|
<Instagram className="mr-2 h-5 w-5" />
|
|
Follow on Instagram
|
|
</a>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<Footer />
|
|
</div>
|
|
)
|
|
}
|