// ─── Kaonara Sections Part 1: Nav, Hero, Origin, Collection ─────────────── const honeys = [ { id: "macadamia", name: "Macadamia-Coffee", subtitle: "Ka'ū Estate Blend", harvest: "February – April", color: "#7a4a1e", lightColor: "#c4862a", bgTint: "#2a1e12", rarity: 4, sweetness: 3, intensity: 4, aroma: ["Toasted caramel", "Dark cacao", "Roasted nut"], texture: "Creamy, slow-pour", notes: "Opens with the warmth of a freshly pulled espresso, deepening into bitter chocolate and salted macadamia. A honey that lingers.", functional: "Antioxidant-rich, natural energy", pairings: ["Aged blue cheese", "Dark chocolate 70%+", "Double espresso"], desc: "The meeting of two crops native to Hawai'i's volcanic highlands — macadamia groves and shade-grown coffee. A rare synchrony of bloom.", }, { id: "eucalyptus", name: "Eucalyptus", subtitle: "Silver Dollar Bloom", harvest: "May – June", color: "#2a4a3a", lightColor: "#4a8c6e", bgTint: "#121e18", rarity: 3, sweetness: 2, intensity: 3, aroma: ["Cool menthol", "Balsam", "Fresh herb"], texture: "Light, fluid", notes: "Medicinal clarity. A breath of cool mountain air held in amber. Clean on the palate with a long herbal finish that suggests eucalyptus forests after rain.", functional: "Antibacterial, respiratory support", pairings: ["Chamomile tea", "Glazed white fish", "Ricotta on toast"], desc: "Harvested when Ka'ū's eucalyptus groves release their singular bloom — a brief, silver-leafed interval in the Hawaiian spring.", }, { id: "keawe", name: "Keawe", subtitle: "White Kiawe Blossom", harvest: "June – July", color: "#8a7650", lightColor: "#d4b87a", bgTint: "#1e1a10", rarity: 4, sweetness: 5, intensity: 2, aroma: ["Vanilla", "Warm butter", "Delicate floral"], texture: "Whipped, granular cream", notes: "The palest honey in the collection. Granulates naturally into a spreadable, velvety cream. Butter and vanilla without sweetness fatigue — it whispers rather than shouts.", functional: "Low moisture, antimicrobial", pairings: ["Croissant with cultured butter", "Fine pâtisserie", "Mild brie"], desc: "Kiawe (mesquite) blooms in the dry coastal lowlands of Ka'ū. Its white flowers yield a honey so fine it is often called the champagne of Hawaiian honeys.", }, { id: "christmas", name: "Christmas Berry", subtitle: "Schinus terebinthifolia", harvest: "November – December", color: "#6a2020", lightColor: "#c45a3a", bgTint: "#1e1010", rarity: 3, sweetness: 3, intensity: 4, aroma: ["Warm spice", "Citrus peel", "Light pepper"], texture: "Amber, medium viscosity", notes: "Harvested at the year's turn, when Christmas berry colors Ka'ū's hillsides red. A spiced warmth on the mid-palate, closing with a bright citrus echo.", functional: "Anti-inflammatory compounds", pairings: ["Aged manchego", "Gin cocktails", "Sherry vinaigrette"], desc: "An invasive species turned into something extraordinary. Christmas berry's late-season bloom yields a honey with remarkable complexity — spice, heat, and unexpected brightness.", }, { id: "ohia", name: "'Ōhi'a Lehua", subtitle: "Sacred Native Blossom", harvest: "March – May", color: "#6a1820", lightColor: "#c43040", bgTint: "#1e0a0e", rarity: 5, sweetness: 4, intensity: 3, aroma: ["Delicate floral", "Rainwater", "Light mineral"], texture: "Fine crystalline, almost granular silk", notes: "The rarest honey we produce. 'Ōhi'a lehua is sacred in Hawaiian tradition — its blossoms are not to be picked on the journey to the volcano, lest rain follow. We harvest with deep respect. The honey holds that same reverence: pure, fleeting, irreplaceable.", functional: "Rich in enzymes and trace minerals", pairings: ["Pure tasting on a wooden spoon", "Matcha ceremony", "Nothing else"], desc: "The 'Ōhi'a lehua is the first tree to flower on fresh lava flows — a symbol of resilience and sacred beauty. Its honey is produced in the smallest quantities of all our collection.", }, ]; // ─── Shared ───────────────────────────────────────────────────────────────── function useWindowWidth() { const [w, setW] = React.useState(window.innerWidth); React.useEffect(() => { const fn = () => setW(window.innerWidth); window.addEventListener("resize", fn); return () => window.removeEventListener("resize", fn); }, []); return w; } function useReveal(threshold = 0.15) { const ref = React.useRef(null); const [visible, setVisible] = React.useState(false); React.useEffect(() => { const el = ref.current; if (!el) return; const obs = new IntersectionObserver( ([entry]) => { if (entry.isIntersecting) { setVisible(true); obs.disconnect(); } }, { threshold } ); obs.observe(el); return () => obs.disconnect(); }, []); return [ref, visible]; } function Reveal({ children, delay = 0, className = "" }) { const [ref, visible] = useReveal(); return (
{children}
); } // ─── Nav ──────────────────────────────────────────────────────────────────── function Nav({ tweaks }) { const [scrolled, setScrolled] = React.useState(false); const w = useWindowWidth(); const isMobile = w < 768; React.useEffect(() => { const fn = () => setScrolled(window.scrollY > 80); window.addEventListener("scroll", fn); return () => window.removeEventListener("scroll", fn); }, []); return ( ); } // ─── Hero ──────────────────────────────────────────────────────────────────── function Hero({ tweaks }) { const [loaded, setLoaded] = React.useState(false); const w = useWindowWidth(); const isMobile = w < 768; React.useEffect(() => { setTimeout(() => setLoaded(true), 100); }, []); return (
{/* BG Placeholder – replace with: volcanic Ka'ū landscape at dawn, lava fields meeting dense jungle, golden morning backlight */}
{/* Honey light glow */}
{/* Image placeholder */}
蜜
{/* Content */}

Born from volcanic fire.
Carried by Pacific air.

{/* Scroll indicator */}
); } // ─── Origin Story ──────────────────────────────────────────────────────────── function Origin({ tweaks }) { const w = useWindowWidth(); const isMobile = w < 768; return (
土

The Terroir

Where lava
becomes soil.
Where soil
becomes honey.

Ka'ū sits at the southern edge of Hawai'i's Big Island — a district shaped by centuries of volcanic activity. Pāhoehoe lava flows have created mineral-dense soils found nowhere else on Earth. No two fields share the same composition.

The native flora — 'ōhi'a lehua, keawe, macadamia — blooms in short, intense windows dictated by elevation, rainfall, and the Pacific trades. Our bees follow these blooms precisely. The result: honeys of startling purity and depth.

{/* Map placeholder – replace with: hand-illustrated map of Big Island highlighting Ka'ū district */}
{/* Stylized Big Island map SVG */} {/* Island outline */} {/* Ka'ū district highlight */} {/* Volcanic peaks */} {/* Ka'ū label */} KA'Ū {/* Compass */} N

19°N · 155°W · ELEVATION 300–1200M

); } // ─── Collection ─────────────────────────────────────────────────────────────── function RarityDots({ count, color }) { return (
{[1,2,3,4,5].map(i => (
))}
); } function HoneyCard({ honey, index, tweaks }) { const [hovered, setHovered] = React.useState(false); const w = useWindowWidth(); const isMobile = w < 768; const isEven = index % 2 === 0; return (
setHovered(true)} onMouseLeave={() => setHovered(false)} > {/* Visual column */}
{/* Honey color visualization — luxurious animation set */}
{/* Outer luxurious halo */}
{/* The drop itself */}
{/* Inner luminance — soft warm light from within */}
{honey.id === "macadamia" && ( Macadamia blossom )} {honey.id === "eucalyptus" && ( Eucalyptus blossom )} {honey.id === "keawe" && ( Keawe blossom )} {honey.id === "christmas" && ( Christmas Berry )} {honey.id === "ohia" && ( 'Ōhi'a Lehua blossom )}
{/* Image hint */}

{/* Placeholder: close-up of {honey.name} honey in jar with natural backlight */}

{/* Content column */}
{String(index + 1).padStart(2, "0")} / 05

{honey.name}

{honey.subtitle}

{honey.notes}

Harvest

{honey.harvest}

Texture

{honey.texture}

Aroma Profile

{honey.aroma.map(a => ( {a} ))}

Pairings

{honey.pairings.join(" · ")}

); } function Collection({ tweaks }) { const w = useWindowWidth(); const isMobile = w < 768; return (

The Collection

Five honeys.
Five worlds.

Each batch is harvested, cold-extracted, and numbered by hand. Production is limited to the bloom — when it ends, so does the season.

{honeys.map((h, i) => )}
); } // Export all Object.assign(window, { Nav, Hero, Origin, Collection, honeys, Reveal, useReveal, useWindowWidth });