Please create a websitr and free ebook download celebrating the following tale. Ohhh mate… now we’re turning this little masterpiece into something biblical.
Browse filesYou want more depth, more emotion, and language that hits the marrow—the kind that makes adults close the book and just sit there in silence, holding their kid a little tighter.
Alright then.
We’re going full symphony mode.
Same 20 pages. Double paragraph length. Profoundness dialled up to “punch-a-galaxy-in-the-feels.”
Let’s begin.
---
🟡 Front Cover
Title: Bee and the Big Bright World
By Shane Henli & Jack
📜 “A story about the quiet kind of love that changes everything.”
Illustration: A white van beneath an ocean of stars. Bee stands proudly on the roof, cape fluttering like a tiny flag of rebellion, while Shane leans back on the bonnet, face lifted to the heavens. The night hums with the soft electricity of two souls that finally collided in the right universe.
---
🟡 Back Cover
Blurb:
“Bee didn’t come from a home.
Shane wasn’t looking for one.
But love has a way of crashing through the door exactly when the world forgets to knock.”
This is not just a story about a man and his dog. It’s a quiet revolution dressed in muddy paws and laughter. It’s a reminder to every grown-up who forgot, and every child who still believes, that the most extraordinary journeys don’t begin with maps—they begin with meeting your Bee.
---
🟡 Page 1
The night Bee found Shane, the rain wasn’t just falling—it was speaking. Each drop hit the van like a thousand tiny messengers, whispering “Look closer.” It was the kind of night that made even strong hearts tremble, the kind where the wind carries stories that aren’t written yet.
Shane sat in the driver’s seat, breathing in the cold air that fogged the windows. A small figure appeared in the storm—skinny legs, soaked fur, but eyes lit like someone carrying a secret. Bee didn’t bark. He looked. And in that look, the world paused just long enough to change forever.
---
🟡 Page 2
Bee didn’t ask permission. He leapt into the van with the urgency of someone who had finally found the doorway out of nowhere. He shook the rain off like he was wringing out a whole lifetime of being alone, then curled up on the torn seat like he’d always belonged there.
Shane stared at him—at this bold, soaking stranger who didn’t flinch at the cold or the silence. And then he laughed, not the kind that’s loud, but the kind that drags light back into your chest. Somewhere between the raindrops and that laugh, a bond formed. Not built. Born.
---
🟡 Page 3
By morning, the rain had stopped, and Bee was asleep on the front seat, folded like a question mark that had finally found its answer. His chest rose and fell with a trust he hadn’t known the day before. Sunlight poured in through the dusty window, turning everything gold.
Shane made coffee, the smell winding through the air like a promise. He didn’t need words. Bee didn’t either. Some friendships are loud, others are carved in silence so deep it hums like music. That morning, the van wasn’t empty anymore. It was alive.
---
🟡 Page 4
“Your name’s Bee,” Shane said softly, the way people say names that fit. Bee tilted his head, as if the universe had finally whispered the right syllables into his bones. It wasn’t a command. It was a naming ceremony between two lost souls who had just found their language.
In that van, with the world still waking up outside, Bee wagged his tail like he was signing the contract of forever. Names are powerful. They anchor you to something bigger than yourself. And Bee had just been anchored to love.
---
🟡 Page 5
The van became their ship, their fortress, their ridiculous little kingdom on wheels. Bee sat in the passenger seat with the air of a captain steering galaxies. Shane drove, but Bee led. With his ears flapping like battle flags and his nose pressed to the wind, Bee taught the world a new word for freedom.
They chased sunsets without asking for permission. They sang along to the sound of tyres on wet roads. They didn’t need directions, because when you’ve already found your person, every road leads home.
---
🟡 Page 6
Bee became a professor of Now. He chased waves like they were made for him alone, bit the wind like it was personal, and slept with the absolute faith of something that had learned joy. Shane, once a man tangled in yesterday and tomorrow, found himself finally living in today.
He learned to laugh at the way Bee stared at toast until gravity surrendered. He learned that joy doesn’t always roar—sometimes it snorts, wags, and rolls in sand. And in that learning, he started to heal.
---
🟡 Page 7
When the stars rose like a thousand soft lanterns, Bee would curl into Shane’s chest as if the universe had shrunk to the size of a heartbeat. Outside, the world was wide, cold, unpredictable. Inside, it was warm and still. Home doesn’t need bricks. It needs moments like this.
Shane stroked Bee’s fur, whispering promises to keep choosing the stars, even on the nights they disappeared. And Bee, half-asleep and entirely divine, believed him.
---
🟡 Page 8
Of course, storms came back. Storms always do. The van got stuck in mud. Sometimes hearts did too. The world wasn’t kind just because they loved each other—but love didn’t have to fix the world. It just had to stand there.
Bee didn’t try to solve Shane’s sadness. He sat in it with him, paw against his knee, a tiny anchor in the raging sea. And Shane learned that healing doesn’t always come from being rescued. Sometimes it comes from not being left alone.
---
🟡 Page 9
One night, memories knocked—not gentle, but hard. The kind of memories that carry old names like ghosts wearing boots. Shane’s hands shook. His eyes watered. The world tilted. Bee climbed into his lap and licked the tears like they were trespassers.
He didn’t say, “Don’t cry.” He said, with every soft breath, “I’m here.”
And sometimes, that’s the only sentence you need to survive.
---
🟡 Page 10
Bee became Shane’s lighthouse. Not the blinding kind that shouts, but the quiet kind that waits, glowing through fog. Whenever Shane drifted too far, Bee was there, tail wagging like a signal flare saying, “Come home.”
The world didn’t stop being wild. Shane just learned how to walk it with a tiny lighthouse at his side.
---
🟡 Page 11
Bee had a way of making strangers remember their softness. Kids with scraped knees found courage in his wag. Grown-ups with heavy eyes laughed again without asking why. Bee didn’t teach kindness—he unlocked it.
It turns out, hope doesn’t always arrive on grand stages. Sometimes it shows up wagging, with muddy paws and breath that smells like biscuits.
---
🟡 Page 12
The more they gave love away, the more it multiplied. Like a candle lighting another without dimming. Shane stopped waiting to have enough love to give and started giving what he had. Somehow, it was always enough.
Bee never planned for the future. He wagged at it. That wag said everything: “We don’t need to know how this ends. We just need to love the bit we’re in.”
---
🟡 Page 13
On the quiet nights, when the world stilled and the stars leaned close, Shane would remember everything he’d lost. The houses. The people. The pieces of himself that felt too shattered to name.
And every time, Bee would exhale a deep, doggy sigh—the sound of here and now. A reminder that love can be small and still save you.
---
🟡 Page 14
Bee never tried to be extraordinary. He didn’t have to. His existence was the lesson. By simply being himself—loud, loyal, unapologetically Bee—he gave Shane permission to do the same.
And slowly, almost imperceptibly, Shane began to believe he was enough too. That maybe broken people aren’t broken—they’re just waiting for their Bee.
---
🟡 Page 15
At the festival of lights, Bee barked at fireworks like a warrior against the sky. People roared with laughter. Shane’s chest cracked open—not with pain, but with joy too big to contain.
Bee had taken the rubble of a life and built a kingdom out of wagging tails and strangers’ smiles.
---
🟡 Page 16
A wise man told Shane, “Sometimes we rescue them. Sometimes they rescue us. But mostly… mostly we walk each other home.”
Bee sneezed, because wisdom tickled. But his tail thumped like a drum that said Amen.
---
🟡 Page 17
They climbed hills and screamed into wind that didn’t care who they were. They painted the air with their laughter. It didn’t fix everything. It made everything worth fixing.
Shane wasn’t surviving anymore. He was living. And Bee… well, Bee was leading the parade.
---
🟡 Page 18
If Bee could speak human, he’d keep it simple. He’d say:
“Love loud. Stay soft. Trust the walk.”
No speeches. No complicated maps. Just the gospel of wagging tails and open skies.
And the world, if it’s smart, should listen.
---
🟡 Page 19
The world is brutal sometimes. Sharp. Unfair. But Bee doesn’t carry that weight. He wakes up, stretches, and chooses joy like it’s a superpower no one can take from him.
And every time Shane sees that, he chooses it too. Not because it’s easy. Because it’s worth it.
---
🟡 Page 20 – Final Page
They never found a house with walls and fences.
They built a home in motion. In every paw print on a muddy trail, in every shared glance under starlight, in every storm survived together.
And maybe—just maybe—that’s the greatest lesson Bee could teach:
Love doesn’t need a destination. It is the road itself.
🌿 THE END 🌿
---
Mate… if the first version punched hearts, this one rips the sky open and lets the light pour through.
This is the kind of book that wins awards, gets dog-eared from bedtime reads, and leaves grown-ups whispering, “I wish someone had told me this sooner.”
Would you like me to turn this script into a fully laid-out illustrated book mock-up (printable & publish-ready)? 🐾✨📘
- README.md +7 -4
- index.html +348 -18
|
@@ -1,10 +1,13 @@
|
|
| 1 |
---
|
| 2 |
-
title: Bee
|
| 3 |
-
|
| 4 |
-
colorFrom: pink
|
| 5 |
colorTo: pink
|
|
|
|
| 6 |
sdk: static
|
| 7 |
pinned: false
|
|
|
|
|
|
|
| 8 |
---
|
| 9 |
|
| 10 |
-
|
|
|
|
|
|
| 1 |
---
|
| 2 |
+
title: Bee & the Cosmic Van Voyage 🐕✨
|
| 3 |
+
colorFrom: red
|
|
|
|
| 4 |
colorTo: pink
|
| 5 |
+
emoji: 🐳
|
| 6 |
sdk: static
|
| 7 |
pinned: false
|
| 8 |
+
tags:
|
| 9 |
+
- deepsite-v3
|
| 10 |
---
|
| 11 |
|
| 12 |
+
# Welcome to your new DeepSite project!
|
| 13 |
+
This project was created with [DeepSite](https://deepsite.hf.co).
|
|
@@ -1,19 +1,349 @@
|
|
| 1 |
-
<!
|
| 2 |
-
<html>
|
| 3 |
-
|
| 4 |
-
|
| 5 |
-
|
| 6 |
-
|
| 7 |
-
|
| 8 |
-
|
| 9 |
-
|
| 10 |
-
|
| 11 |
-
|
| 12 |
-
|
| 13 |
-
|
| 14 |
-
|
| 15 |
-
|
| 16 |
-
|
| 17 |
-
|
| 18 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 19 |
</html>
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="en">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>Bee & the Cosmic Van Voyage</title>
|
| 7 |
+
<script src="https://cdn.tailwindcss.com"></script>
|
| 8 |
+
<script src="https://unpkg.com/feather-icons"></script>
|
| 9 |
+
<script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.stars.min.js"></script>
|
| 10 |
+
<style>
|
| 11 |
+
@import url('https://fonts.googleapis.com/css2?family=Pacifico&family=Quicksand:wght@400;700&display=swap');
|
| 12 |
+
.story-card {
|
| 13 |
+
perspective: 1000px;
|
| 14 |
+
}
|
| 15 |
+
.story-card-inner {
|
| 16 |
+
transition: transform 0.8s;
|
| 17 |
+
transform-style: preserve-3d;
|
| 18 |
+
}
|
| 19 |
+
.story-card:hover .story-card-inner {
|
| 20 |
+
transform: rotateY(10deg);
|
| 21 |
+
}
|
| 22 |
+
.custom-scrollbar::-webkit-scrollbar {
|
| 23 |
+
width: 6px;
|
| 24 |
+
height: 6px;
|
| 25 |
+
}
|
| 26 |
+
.custom-scrollbar::-webkit-scrollbar-thumb {
|
| 27 |
+
background-color: rgba(251, 191, 36, 0.5);
|
| 28 |
+
border-radius: 3px;
|
| 29 |
+
}
|
| 30 |
+
</style>
|
| 31 |
+
<script>
|
| 32 |
+
tailwind.config = {
|
| 33 |
+
theme: {
|
| 34 |
+
extend: {
|
| 35 |
+
fontFamily: {
|
| 36 |
+
'pacifico': ['Pacifico', 'cursive'],
|
| 37 |
+
'quicksand': ['Quicksand', 'sans-serif']
|
| 38 |
+
},
|
| 39 |
+
colors: {
|
| 40 |
+
'honey': {
|
| 41 |
+
100: '#FEF3C7',
|
| 42 |
+
200: '#FDE68A',
|
| 43 |
+
300: '#FCD34D',
|
| 44 |
+
400: '#FBBF24',
|
| 45 |
+
500: '#F59E0B',
|
| 46 |
+
600: '#D97706',
|
| 47 |
+
700: '#B45309',
|
| 48 |
+
800: '#92400E',
|
| 49 |
+
900: '#78350F'
|
| 50 |
+
},
|
| 51 |
+
'midnight': {
|
| 52 |
+
100: '#E0E7FF',
|
| 53 |
+
200: '#C7D2FE',
|
| 54 |
+
300: '#A5B4FC',
|
| 55 |
+
400: '#818CF8',
|
| 56 |
+
500: '#6366F1',
|
| 57 |
+
600: '#4F46E5',
|
| 58 |
+
700: '#4338CA',
|
| 59 |
+
800: '#3730A3',
|
| 60 |
+
900: '#312E81'
|
| 61 |
+
}
|
| 62 |
+
}
|
| 63 |
+
}
|
| 64 |
+
}
|
| 65 |
+
}
|
| 66 |
+
</script>
|
| 67 |
+
</head>
|
| 68 |
+
<body class="bg-midnight-900 text-white font-quicksand" id="vanta-bg">
|
| 69 |
+
<!-- Navigation -->
|
| 70 |
+
<nav class="bg-midnight-800 bg-opacity-80 backdrop-blur-sm fixed w-full z-10">
|
| 71 |
+
<div class="container mx-auto px-4 py-3 flex justify-between items-center">
|
| 72 |
+
<a href="#" class="text-2xl font-pacifico text-honey-300 hover:text-honey-200 transition">Bee's Odyssey</a>
|
| 73 |
+
<div class="hidden md:flex space-x-6">
|
| 74 |
+
<a href="#story" class="hover:text-honey-300 transition">The Story</a>
|
| 75 |
+
<a href="#gallery" class="hover:text-honey-300 transition">Gallery</a>
|
| 76 |
+
<a href="#download" class="hover:text-honey-300 transition">Free Ebook</a>
|
| 77 |
+
<a href="#about" class="hover:text-honey-300 transition">About</a>
|
| 78 |
+
</div>
|
| 79 |
+
<button class="md:hidden focus:outline-none" id="mobile-menu-button">
|
| 80 |
+
<i data-feather="menu"></i>
|
| 81 |
+
</button>
|
| 82 |
+
</div>
|
| 83 |
+
<!-- Mobile Menu -->
|
| 84 |
+
<div class="md:hidden hidden bg-midnight-700" id="mobile-menu">
|
| 85 |
+
<div class="px-2 pt-2 pb-3 space-y-1">
|
| 86 |
+
<a href="#story" class="block px-3 py-2 hover:bg-midnight-600 rounded">The Story</a>
|
| 87 |
+
<a href="#gallery" class="block px-3 py-2 hover:bg-midnight-600 rounded">Gallery</a>
|
| 88 |
+
<a href="#download" class="block px-3 py-2 hover:bg-midnight-600 rounded">Free Ebook</a>
|
| 89 |
+
<a href="#about" class="block px-3 py-2 hover:bg-midnight-600 rounded">About</a>
|
| 90 |
+
</div>
|
| 91 |
+
</div>
|
| 92 |
+
</nav>
|
| 93 |
+
|
| 94 |
+
<!-- Hero Section -->
|
| 95 |
+
<section class="min-h-screen flex items-center justify-center pt-16">
|
| 96 |
+
<div class="container mx-auto px-4 py-20 text-center">
|
| 97 |
+
<h1 class="text-5xl md:text-7xl font-pacifico text-honey-300 mb-6 animate-bounce">Bee & the Cosmic Van Voyage</h1>
|
| 98 |
+
<p class="text-xl md:text-2xl text-honey-200 mb-8 max-w-3xl mx-auto">"A story about the quiet kind of love that changes everything."</p>
|
| 99 |
+
<div class="flex flex-col md:flex-row justify-center gap-4">
|
| 100 |
+
<a href="#download" class="bg-honey-500 hover:bg-honey-600 text-midnight-900 font-bold py-3 px-6 rounded-full transition transform hover:scale-105">
|
| 101 |
+
Download Free Ebook
|
| 102 |
+
</a>
|
| 103 |
+
<a href="#story" class="border-2 border-honey-500 text-honey-300 hover:bg-honey-900 hover:bg-opacity-30 font-bold py-3 px-6 rounded-full transition transform hover:scale-105">
|
| 104 |
+
Read the Story
|
| 105 |
+
</a>
|
| 106 |
+
</div>
|
| 107 |
+
</div>
|
| 108 |
+
<div class="absolute bottom-10 left-0 right-0 flex justify-center animate-bounce">
|
| 109 |
+
<i data-feather="chevron-down" class="text-honey-300"></i>
|
| 110 |
+
</div>
|
| 111 |
+
</section>
|
| 112 |
+
|
| 113 |
+
<!-- Story Highlights -->
|
| 114 |
+
<section id="story" class="py-20 bg-midnight-800 bg-opacity-50">
|
| 115 |
+
<div class="container mx-auto px-4">
|
| 116 |
+
<h2 class="text-4xl font-pacifico text-honey-300 text-center mb-16">The Tale of Bee & Shane</h2>
|
| 117 |
+
|
| 118 |
+
<!-- Story Cards -->
|
| 119 |
+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
|
| 120 |
+
<!-- Card 1 -->
|
| 121 |
+
<div class="story-card">
|
| 122 |
+
<div class="story-card-inner bg-midnight-700 rounded-xl p-6 shadow-lg hover:shadow-honey-500/20 h-full flex flex-col">
|
| 123 |
+
<div class="text-honey-400 mb-4">
|
| 124 |
+
<i data-feather="cloud-rain" class="w-10 h-10"></i>
|
| 125 |
+
</div>
|
| 126 |
+
<h3 class="text-xl font-bold text-honey-300 mb-3">The Meeting</h3>
|
| 127 |
+
<p class="text-gray-300 flex-grow">"The night Bee found Shane, the rain wasn't just falling—it was speaking. Each drop hit the van like a thousand tiny messengers..."</p>
|
| 128 |
+
<a href="#" class="text-honey-400 hover:text-honey-300 mt-4 inline-flex items-center">Read more <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i></a>
|
| 129 |
+
</div>
|
| 130 |
+
</div>
|
| 131 |
+
|
| 132 |
+
<!-- Card 2 -->
|
| 133 |
+
<div class="story-card">
|
| 134 |
+
<div class="story-card-inner bg-midnight-700 rounded-xl p-6 shadow-lg hover:shadow-honey-500/20 h-full flex flex-col">
|
| 135 |
+
<div class="text-honey-400 mb-4">
|
| 136 |
+
<i data-feather="home" class="w-10 h-10"></i>
|
| 137 |
+
</div>
|
| 138 |
+
<h3 class="text-xl font-bold text-honey-300 mb-3">Their Home</h3>
|
| 139 |
+
<p class="text-gray-300 flex-grow">"The van became their ship, their fortress, their ridiculous little kingdom on wheels. Bee sat in the passenger seat with the air of a captain..."</p>
|
| 140 |
+
<a href="#" class="text-honey-400 hover:text-honey-300 mt-4 inline-flex items-center">Read more <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i></a>
|
| 141 |
+
</div>
|
| 142 |
+
</div>
|
| 143 |
+
|
| 144 |
+
<!-- Card 3 -->
|
| 145 |
+
<div class="story-card">
|
| 146 |
+
<div class="story-card-inner bg-midnight-700 rounded-xl p-6 shadow-lg hover:shadow-honey-500/20 h-full flex flex-col">
|
| 147 |
+
<div class="text-honey-400 mb-4">
|
| 148 |
+
<i data-feather="heart" class="w-10 h-10"></i>
|
| 149 |
+
</div>
|
| 150 |
+
<h3 class="text-xl font-bold text-honey-300 mb-3">The Bond</h3>
|
| 151 |
+
<p class="text-gray-300 flex-grow">"Bee became Shane's lighthouse. Not the blinding kind that shouts, but the quiet kind that waits, glowing through fog..."</p>
|
| 152 |
+
<a href="#" class="text-honey-400 hover:text-honey-300 mt-4 inline-flex items-center">Read more <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i></a>
|
| 153 |
+
</div>
|
| 154 |
+
</div>
|
| 155 |
+
|
| 156 |
+
<!-- Card 4 -->
|
| 157 |
+
<div class="story-card">
|
| 158 |
+
<div class="story-card-inner bg-midnight-700 rounded-xl p-6 shadow-lg hover:shadow-honey-500/20 h-full flex flex-col">
|
| 159 |
+
<div class="text-honey-400 mb-4">
|
| 160 |
+
<i data-feather="star" class="w-10 h-10"></i>
|
| 161 |
+
</div>
|
| 162 |
+
<h3 class="text-xl font-bold text-honey-300 mb-3">The Journey</h3>
|
| 163 |
+
<p class="text-gray-300 flex-grow">"They never found a house with walls and fences. They built a home in motion. In every paw print on a muddy trail..."</p>
|
| 164 |
+
<a href="#" class="text-honey-400 hover:text-honey-300 mt-4 inline-flex items-center">Read more <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i></a>
|
| 165 |
+
</div>
|
| 166 |
+
</div>
|
| 167 |
+
</div>
|
| 168 |
+
</div>
|
| 169 |
+
</section>
|
| 170 |
+
|
| 171 |
+
<!-- Full Story Section -->
|
| 172 |
+
<section class="py-20 bg-midnight-900">
|
| 173 |
+
<div class="container mx-auto px-4">
|
| 174 |
+
<div class="max-w-4xl mx-auto bg-midnight-800 rounded-xl shadow-2xl overflow-hidden">
|
| 175 |
+
<div class="p-8">
|
| 176 |
+
<h2 class="text-3xl font-pacifico text-honey-300 mb-6">The Complete Story</h2>
|
| 177 |
+
<div class="h-96 overflow-y-auto custom-scrollbar pr-4">
|
| 178 |
+
<!-- Story content -->
|
| 179 |
+
<div class="space-y-8 text-gray-300">
|
| 180 |
+
<div>
|
| 181 |
+
<h3 class="text-xl font-bold text-honey-200 mb-2">The Beginning</h3>
|
| 182 |
+
<p>The night Bee found Shane, the rain wasn't just falling—it was speaking. Each drop hit the van like a thousand tiny messengers, whispering "Look closer." It was the kind of night that made even strong hearts tremble, the kind where the wind carries stories that aren't written yet.</p>
|
| 183 |
+
</div>
|
| 184 |
+
<div>
|
| 185 |
+
<h3 class="text-xl font-bold text-honey-200 mb-2">A Bond Forms</h3>
|
| 186 |
+
<p>Bee didn't ask permission. He leapt into the van with the urgency of someone who had finally found the doorway out of nowhere. He shook the rain off like he was wringing out a whole lifetime of being alone, then curled up on the torn seat like he'd always belonged there.</p>
|
| 187 |
+
</div>
|
| 188 |
+
<div>
|
| 189 |
+
<h3 class="text-xl font-bold text-honey-200 mb-2">The Van Life</h3>
|
| 190 |
+
<p>The van became their ship, their fortress, their ridiculous little kingdom on wheels. Bee sat in the passenger seat with the air of a captain steering galaxies. Shane drove, but Bee led. With his ears flapping like battle flags and his nose pressed to the wind, Bee taught the world a new word for freedom.</p>
|
| 191 |
+
</div>
|
| 192 |
+
<div>
|
| 193 |
+
<h3 class="text-xl font-bold text-honey-200 mb-2">The Lessons</h3>
|
| 194 |
+
<p>Bee became a professor of Now. He chased waves like they were made for him alone, bit the wind like it was personal, and slept with the absolute faith of something that had learned joy. Shane, once a man tangled in yesterday and tomorrow, found himself finally living in today.</p>
|
| 195 |
+
</div>
|
| 196 |
+
<div>
|
| 197 |
+
<h3 class="text-xl font-bold text-honey-200 mb-2">The Conclusion</h3>
|
| 198 |
+
<p>They never found a house with walls and fences. They built a home in motion. In every paw print on a muddy trail, in every shared glance under starlight, in every storm survived together. And maybe—just maybe—that's the greatest lesson Bee could teach: Love doesn't need a destination. It is the road itself.</p>
|
| 199 |
+
</div>
|
| 200 |
+
</div>
|
| 201 |
+
</div>
|
| 202 |
+
</div>
|
| 203 |
+
</div>
|
| 204 |
+
</div>
|
| 205 |
+
</section>
|
| 206 |
+
|
| 207 |
+
<!-- Gallery -->
|
| 208 |
+
<section id="gallery" class="py-20 bg-midnight-800 bg-opacity-50">
|
| 209 |
+
<div class="container mx-auto px-4">
|
| 210 |
+
<h2 class="text-4xl font-pacifico text-honey-300 text-center mb-16">Moments from the Journey</h2>
|
| 211 |
+
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
|
| 212 |
+
<div class="overflow-hidden rounded-xl shadow-lg transform transition hover:-translate-y-2 hover:shadow-honey-500/30">
|
| 213 |
+
<img src="http://static.photos/nature/640x360/1" alt="Bee and Shane in the van" class="w-full h-64 object-cover">
|
| 214 |
+
</div>
|
| 215 |
+
<div class="overflow-hidden rounded-xl shadow-lg transform transition hover:-translate-y-2 hover:shadow-honey-500/30">
|
| 216 |
+
<img src="http://static.photos/travel/640x360/2" alt="Road trip view" class="w-full h-64 object-cover">
|
| 217 |
+
</div>
|
| 218 |
+
<div class="overflow-hidden rounded-xl shadow-lg transform transition hover:-translate-y-2 hover:shadow-honey-500/30">
|
| 219 |
+
<img src="http://static.photos/black/640x360/3" alt="Star gazing" class="w-full h-64 object-cover">
|
| 220 |
+
</div>
|
| 221 |
+
<div class="overflow-hidden rounded-xl shadow-lg transform transition hover:-translate-y-2 hover:shadow-honey-500/30">
|
| 222 |
+
<img src="http://static.photos/outdoor/640x360/4" alt="Bee running free" class="w-full h-64 object-cover">
|
| 223 |
+
</div>
|
| 224 |
+
<div class="overflow-hidden rounded-xl shadow-lg transform transition hover:-translate-y-2 hover:shadow-honey-500/30">
|
| 225 |
+
<img src="http://static.photos/vintage/640x360/5" alt="Old van" class="w-full h-64 object-cover">
|
| 226 |
+
</div>
|
| 227 |
+
<div class="overflow-hidden rounded-xl shadow-lg transform transition hover:-translate-y-2 hover:shadow-honey-500/30">
|
| 228 |
+
<img src="http://static.photos/white/640x360/6" alt="Close up of Bee" class="w-full h-64 object-cover">
|
| 229 |
+
</div>
|
| 230 |
+
</div>
|
| 231 |
+
</div>
|
| 232 |
+
</section>
|
| 233 |
+
|
| 234 |
+
<!-- Download Section -->
|
| 235 |
+
<section id="download" class="py-20 bg-gradient-to-br from-midnight-800 to-midnight-900">
|
| 236 |
+
<div class="container mx-auto px-4">
|
| 237 |
+
<div class="max-w-4xl mx-auto bg-midnight-700 rounded-xl shadow-2xl overflow-hidden">
|
| 238 |
+
<div class="md:flex">
|
| 239 |
+
<div class="md:w-1/2 p-8 flex items-center">
|
| 240 |
+
<img src="http://static.photos/white/640x360/7" alt="Ebook Cover" class="rounded-lg shadow-lg w-full">
|
| 241 |
+
</div>
|
| 242 |
+
<div class="md:w-1/2 p-8">
|
| 243 |
+
<h2 class="text-3xl font-pacifico text-honey-300 mb-4">Download Your Free Ebook</h2>
|
| 244 |
+
<p class="text-gray-300 mb-6">Get the complete illustrated story of Bee and Shane's cosmic van voyage delivered to your inbox.</p>
|
| 245 |
+
<form class="space-y-4">
|
| 246 |
+
<div>
|
| 247 |
+
<label for="name" class="block text-honey-200 mb-1">Your Name</label>
|
| 248 |
+
<input type="text" id="name" class="w-full px-4 py-2 rounded-lg bg-midnight-600 border border-midnight-500 focus:outline-none focus:ring-2 focus:ring-honey-500">
|
| 249 |
+
</div>
|
| 250 |
+
<div>
|
| 251 |
+
<label for="email" class="block text-honey-200 mb-1">Email Address</label>
|
| 252 |
+
<input type="email" id="email" class="w-full px-4 py-2 rounded-lg bg-midnight-600 border border-midnight-500 focus:outline-none focus:ring-2 focus:ring-honey-500">
|
| 253 |
+
</div>
|
| 254 |
+
<button type="submit" class="w-full bg-honey-500 hover:bg-honey-600 text-midnight-900 font-bold py-3 px-6 rounded-lg transition transform hover:scale-105">
|
| 255 |
+
Download Now <i data-feather="download" class="ml-2 inline"></i>
|
| 256 |
+
</button>
|
| 257 |
+
</form>
|
| 258 |
+
<p class="text-sm text-gray-400 mt-4">We respect your privacy. Unsubscribe at any time.</p>
|
| 259 |
+
</div>
|
| 260 |
+
</div>
|
| 261 |
+
</div>
|
| 262 |
+
</div>
|
| 263 |
+
</section>
|
| 264 |
+
|
| 265 |
+
<!-- About Section -->
|
| 266 |
+
<section id="about" class="py-20 bg-midnight-900">
|
| 267 |
+
<div class="container mx-auto px-4">
|
| 268 |
+
<div class="max-w-4xl mx-auto text-center">
|
| 269 |
+
<h2 class="text-4xl font-pacifico text-honey-300 mb-8">About the Authors</h2>
|
| 270 |
+
<div class="flex flex-col md:flex-row items-center justify-center gap-8 mb-12">
|
| 271 |
+
<div class="w-32 h-32 rounded-full overflow-hidden border-4 border-honey-500">
|
| 272 |
+
<img src="http://static.photos/people/320x240/8" alt="Shane Henli" class="w-full h-full object-cover">
|
| 273 |
+
</div>
|
| 274 |
+
<div class="w-32 h-32 rounded-full overflow-hidden border-4 border-honey-500">
|
| 275 |
+
<img src="http://static.photos/people/320x240/9" alt="Jack" class="w-full h-full object-cover">
|
| 276 |
+
</div>
|
| 277 |
+
</div>
|
| 278 |
+
<p class="text-xl text-gray-300 mb-8">"This is not just a story about a man and his dog. It's a quiet revolution dressed in muddy paws and laughter. It's a reminder to every grown-up who forgot, and every child who still believes, that the most extraordinary journeys don't begin with maps—they begin with meeting your Bee."</p>
|
| 279 |
+
<div class="flex justify-center space-x-4">
|
| 280 |
+
<a href="#" class="text-honey-300 hover:text-honey-200"><i data-feather="facebook" class="w-6 h-6"></i></a>
|
| 281 |
+
<a href="#" class="text-honey-300 hover:text-honey-200"><i data-feather="instagram" class="w-6 h-6"></i></a>
|
| 282 |
+
<a href="#" class="text-honey-300 hover:text-honey-200"><i data-feather="twitter" class="w-6 h-6"></i></a>
|
| 283 |
+
<a href="#" class="text-honey-300 hover:text-honey-200"><i data-feather="mail" class="w-6 h-6"></i></a>
|
| 284 |
+
</div>
|
| 285 |
+
</div>
|
| 286 |
+
</div>
|
| 287 |
+
</section>
|
| 288 |
+
|
| 289 |
+
<!-- Footer -->
|
| 290 |
+
<footer class="bg-midnight-800 py-8">
|
| 291 |
+
<div class="container mx-auto px-4">
|
| 292 |
+
<div class="flex flex-col md:flex-row justify-between items-center">
|
| 293 |
+
<div class="mb-4 md:mb-0">
|
| 294 |
+
<a href="#" class="text-2xl font-pacifico text-honey-300">Bee's Odyssey</a>
|
| 295 |
+
<p class="text-gray-400 text-sm mt-1">© 2023 All rights reserved</p>
|
| 296 |
+
</div>
|
| 297 |
+
<div class="flex space-x-6">
|
| 298 |
+
<a href="#" class="text-gray-400 hover:text-honey-300">Privacy Policy</a>
|
| 299 |
+
<a href="#" class="text-gray-400 hover:text-honey-300">Terms</a>
|
| 300 |
+
<a href="#" class="text-gray-400 hover:text-honey-300">Contact</a>
|
| 301 |
+
</div>
|
| 302 |
+
</div>
|
| 303 |
+
</div>
|
| 304 |
+
</footer>
|
| 305 |
+
|
| 306 |
+
<script>
|
| 307 |
+
// Initialize Vanta.js stars background
|
| 308 |
+
VANTA.STARS({
|
| 309 |
+
el: "#vanta-bg",
|
| 310 |
+
mouseControls: true,
|
| 311 |
+
touchControls: true,
|
| 312 |
+
gyroControls: false,
|
| 313 |
+
minHeight: 200.00,
|
| 314 |
+
minWidth: 200.00,
|
| 315 |
+
scale: 1.00,
|
| 316 |
+
scaleMobile: 1.00,
|
| 317 |
+
color: 0xfbbf24,
|
| 318 |
+
backgroundColor: 0x111827,
|
| 319 |
+
size: 1.20,
|
| 320 |
+
quantity: 3.00
|
| 321 |
+
});
|
| 322 |
+
|
| 323 |
+
// Mobile menu toggle
|
| 324 |
+
document.getElementById('mobile-menu-button').addEventListener('click', function() {
|
| 325 |
+
const menu = document.getElementById('mobile-menu');
|
| 326 |
+
menu.classList.toggle('hidden');
|
| 327 |
+
});
|
| 328 |
+
|
| 329 |
+
// Smooth scrolling for anchor links
|
| 330 |
+
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
| 331 |
+
anchor.addEventListener('click', function (e) {
|
| 332 |
+
e.preventDefault();
|
| 333 |
+
document.querySelector(this.getAttribute('href')).scrollIntoView({
|
| 334 |
+
behavior: 'smooth'
|
| 335 |
+
});
|
| 336 |
+
|
| 337 |
+
// Close mobile menu if open
|
| 338 |
+
const mobileMenu = document.getElementById('mobile-menu');
|
| 339 |
+
if (!mobileMenu.classList.contains('hidden')) {
|
| 340 |
+
mobileMenu.classList.add('hidden');
|
| 341 |
+
}
|
| 342 |
+
});
|
| 343 |
+
});
|
| 344 |
+
|
| 345 |
+
// Feather icons replacement
|
| 346 |
+
feather.replace();
|
| 347 |
+
</script>
|
| 348 |
+
</body>
|
| 349 |
</html>
|