<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gourmet Mushroom Growers of New Zealand</title>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=DM+Sans:wght@300;400;500&display=swap" rel="stylesheet">
<style>
:root {
--cream: #F5F0E8; --dark: #1A1A14; --forest: #2D4A2D;
--moss: #4A6741; --sage: #7A9E6E; --gold: #C4933A;
--warm: #DDD4B8; --paper: #EDE8DC; --water: #B8D4E0;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'DM Sans',sans-serif; background:var(--cream); color:var(--dark); min-height:100vh; }
header { background:var(--forest); padding:2.5rem 2rem 2rem; text-align:center; position:relative; overflow:hidden; }
header::before { content:''; position:absolute; inset:0;
background: radial-gradient(ellipse at 30% 50%,rgba(74,103,65,.6) 0%,transparent 60%),
radial-gradient(ellipse at 70% 30%,rgba(196,147,58,.15) 0%,transparent 50%); }
.header-inner { position:relative; z-index:1; }
.spore-row { display:flex; justify-content:center; gap:1.2rem; margin-bottom:1rem; opacity:.7; }
.spore { width:8px; height:8px; border-radius:50%; background:var(--sage); animation:float 3s ease-in-out infinite; }
.spore:nth-child(2){animation-delay:.5s;background:var(--gold);width:5px;height:5px;}
.spore:nth-child(3){animation-delay:1s;width:6px;height:6px;}
.spore:nth-child(4){animation-delay:1.5s;background:var(--gold);}
.spore:nth-child(5){animation-delay:.8s;width:4px;height:4px;}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
header h1 { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,4vw,3rem); color:var(--cream); line-height:1.2; letter-spacing:-.02em; margin-bottom:.5rem; }
header h1 em { color:var(--gold); font-style:italic; }
header p { color:rgba(245,240,232,.65); font-size:.9rem; font-weight:300; letter-spacing:.08em; text-transform:uppercase; }
.badge-row { display:flex; justify-content:center; gap:.8rem; margin-top:1.2rem; flex-wrap:wrap; }
.badge { background:rgba(245,240,232,.1); border:1px solid rgba(245,240,232,.2); color:var(--cream); font-size:.72rem; font-weight:500; padding:.3rem .8rem; border-radius:2rem; letter-spacing:.05em; }
.main { display:grid; grid-template-columns:1fr 380px; min-height:calc(100vh - 160px); }
@media(max-width:900px){.main{grid-template-columns:1fr;}}
.map-panel { background:var(--paper); padding:1.5rem; display:flex; flex-direction:column; align-items:center; border-right:1px solid rgba(45,74,45,.12); }
.map-label { font-family:'Playfair Display',serif; font-size:.75rem; color:var(--moss); letter-spacing:.15em; text-transform:uppercase; margin-bottom:1rem; }
.map-container { width:100%; max-width:360px; }
.nz-svg { width:100%; filter:drop-shadow(0 6px 18px rgba(45,74,45,.2)); }
.land { fill:var(--warm); stroke:var(--moss); stroke-width:.8; stroke-linejoin:round; stroke-linecap:round; }
.land-inner { fill:#C8BC9A; stroke:none; }
.pin-group { cursor:pointer; }
.pin-circle { fill:var(--forest); stroke:white; stroke-width:1.8; transition:all .2s ease; }
.pin-group:hover .pin-circle, .pin-group.active .pin-circle { fill:var(--gold); }
.pin-number { fill:white; font-family:'DM Sans',sans-serif; font-size:7.5px; font-weight:700; text-anchor:middle; dominant-baseline:central; pointer-events:none; }
.pin-group:hover .pin-number, .pin-group.active .pin-number { fill:var(--dark); }
.map-legend { margin-top:1rem; font-size:.72rem; color:var(--moss); display:flex; align-items:center; gap:.4rem; }
.legend-dot { width:9px; height:9px; border-radius:50%; background:var(--forest); border:1.5px solid white; }
.sidebar { background:var(--dark); overflow-y:auto; max-height:calc(100vh - 160px); position:sticky; top:0; }
.sidebar-header { padding:1.3rem 1.5rem .8rem; border-bottom:1px solid rgba(245,240,232,.08); position:sticky; top:0; background:var(--dark); z-index:10; }
.sidebar-header h2 { font-family:'Playfair Display',serif; font-size:.95rem; color:var(--cream); font-weight:400; letter-spacing:.05em; }
.sidebar-header p { font-size:.68rem; color:rgba(245,240,232,.4); margin-top:.2rem; letter-spacing:.06em; text-transform:uppercase; }
.grower-list { padding:.5rem 0; }
.grower-card { padding:1rem 1.5rem; border-bottom:1px solid rgba(245,240,232,.06); cursor:pointer; transition:background .2s; position:relative; }
.grower-card:hover { background:rgba(245,240,232,.04); }
.grower-card.active { background:rgba(74,103,65,.2); }
.grower-card.active::before { content:''; position:absolute; left:0;top:0;bottom:0; width:3px; background:var(--gold); }
.card-top { display:flex; align-items:flex-start; gap:.7rem; }
.card-num { min-width:20px; height:20px; border-radius:50%; background:var(--forest); border:1.5px solid rgba(245,240,232,.15); display:flex; align-items:center; justify-content:center; font-size:.6rem; font-weight:700; color:var(--cream); flex-shrink:0; margin-top:1px; }
.grower-card.active .card-num { background:var(--gold); color:var(--dark); border-color:var(--gold); }
.card-name { font-family:'Playfair Display',serif; font-size:.92rem; color:var(--cream); line-height:1.3; }
.card-location { font-size:.68rem; color:var(--sage); letter-spacing:.03em; margin-top:.12rem; }
.card-detail { display:none; margin-top:.75rem; padding-top:.75rem; border-top:1px solid rgba(245,240,232,.08); }
.grower-card.active .card-detail { display:block; }
.detail-section { margin-bottom:.75rem; }
.detail-label { font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); margin-bottom:.25rem; font-weight:500; }
.detail-text { font-size:.76rem; color:rgba(245,240,232,.7); line-height:1.6; font-weight:300; }
.mushroom-tags { display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.25rem; }
.mushroom-tag { background:rgba(74,103,65,.3); border:1px solid rgba(122,158,110,.3); color:var(--sage); font-size:.66rem; padding:.18rem .55rem; border-radius:2rem; }
.usp-list { list-style:none; display:flex; flex-direction:column; gap:.3rem; }
.usp-list li { font-size:.76rem; color:rgba(245,240,232,.7); display:flex; gap:.45rem; line-height:1.5; font-weight:300; }
.usp-list li::before { content:'โ'; color:var(--gold); flex-shrink:0; font-size:.68rem; margin-top:.1rem; }
.est-chip { display:inline-flex; align-items:center; background:rgba(196,147,58,.15); border:1px solid rgba(196,147,58,.25); color:var(--gold); font-size:.68rem; padding:.18rem .65rem; border-radius:2rem; margin-bottom:.65rem; font-weight:500; }
footer { background:var(--forest); color:rgba(245,240,232,.5); text-align:center; padding:1rem; font-size:.7rem; letter-spacing:.06em; }
footer span { color:var(--gold); }
.sidebar::-webkit-scrollbar{width:3px;}
.sidebar::-webkit-scrollbar-thumb{background:rgba(245,240,232,.1);border-radius:2px;}
@media(max-width:900px){.sidebar{max-height:none;position:static;}}
</style>
</head>
<body>
<header>
<div class="header-inner">
<div class="spore-row">
<div class="spore"></div><div class="spore"></div><div class="spore"></div>
<div class="spore"></div><div class="spore"></div>
</div>
<h1>Gourmet Mushroom Growers<br>of <em>New Zealand</em></h1>
<p>An interactive field guide to Aotearoa's finest fungi cultivators</p>
<div class="badge-row">
<span class="badge">๐ 9 Growers</span>
<span class="badge">๐ North & South Island</span>
<span class="badge">๐ฟ Farm to Table</span>
</div>
</div>
</header>
<div class="main">
<div class="map-panel">
<div class="map-label">Click a pin to explore</div>
<div class="map-container">
<!--
NZ SVG โ viewBox 0 0 260 500
Coordinate formula:
x = (lon - 166.25) / 12.5 * 220 + 20
y = (lat + 34.25) / 13.15 * 465 + 18
Key geographic anchors verified:
North Cape lon=173.05 lat=-34.40 โ x=119 y=18
East Cape lon=178.55 lat=-37.69 โ x=217 y=131
Wellington tip lon=174.78 lat=-41.29 โ x=149 y=253
Nelson top lon=173.28 lat=-41.27 โ x=122 y=252
Farewell Spit lon=172.68 lat=-40.55 โ x=112 y=225
West Coast lon=171.20 lat=-41.75 โ x=86 y=273
Greymouth lon=171.20 lat=-42.45 โ x=86 y=298
Haast lon=169.05 lat=-43.88 โ x=48 y=348
SW Fiordland lon=166.50 lat=-46.17 โ x=4 y=434 (clip at edge)
Bluff south lon=168.33 lat=-46.60 โ x=35 y=449
Dunedin lon=170.50 lat=-45.88 โ x=73 y=425
Timaru lon=171.25 lat=-44.40 โ x=86 y=374
Christchurch lon=172.64 lat=-43.53 โ x=110 y=338
Kaikoura lon=173.68 lat=-42.40 โ x=129 y=290
Marlborough lon=173.96 lat=-41.51 โ x=133 y=260
PINS:
1 Mangawhai lon=174.58 lat=-36.09 โ x=144 y=72
2 Devonport/Akl lon=174.80 lat=-36.83 โ x=148 y=99
3 South Auckland lon=174.91 lat=-37.03 โ x=150 y=106
4 Pukekawa lon=175.01 lat=-37.31 โ x=152 y=116
5 Raglan lon=174.88 lat=-37.80 โ x=149 y=134
6 Waitotara lon=174.73 lat=-39.85 โ x=147 y=209
7 Ohau/Levin lon=175.18 lat=-40.65 โ x=155 y=239
8 Moutere Nelson lon=172.96 lat=-41.26 โ x=116 y=261
9 West Melton lon=172.29 lat=-43.52 โ x=104 y=339
-->
<svg class="nz-svg" viewBox="0 0 260 500" xmlns="http://www.w3.org/2000/svg">
<defs>
<filter id="sh"><feDropShadow dx="1" dy="2" stdDeviation="2.5" flood-color="rgba(30,60,30,.3)"/></filter>
</defs>
<!-- Sea -->
<rect width="260" height="500" fill="#C4DAE8" rx="6"/>
<!-- =====================================================
NORTH ISLAND โ accurate outline from reference image
Starting at Northland tip, travelling clockwise
===================================================== -->
<path class="land" filter="url(#sh)" d="
M 119,20
C 122,18 126,18 130,20 C 134,22 137,27 136,32
C 140,30 145,30 149,33 C 153,36 155,42 153,47
C 157,46 162,47 165,51 C 168,55 168,61 165,65
C 169,65 174,67 177,72 C 180,77 179,84 175,87
C 179,88 184,91 186,96 C 188,101 187,108 183,112
C 188,114 193,119 194,125 C 195,131 192,138 187,141
C 192,144 197,150 198,157 C 199,164 196,171 191,174
C 196,179 200,186 200,193 C 200,200 196,207 191,210
C 196,216 199,224 197,231 C 195,238 189,244 183,245
C 186,253 186,262 182,269 C 178,276 171,279 164,279
C 165,286 163,294 158,299 C 153,304 146,305 140,302
C 139,309 135,316 128,319 C 121,322 113,320 108,315
C 105,322 99,328 91,330 C 83,332 75,328 71,322
C 66,328 59,333 51,332 C 43,331 36,325 34,318
C 37,311 44,307 51,307
C 49,300 50,292 54,286 C 58,280 65,277 72,279
C 73,272 76,264 83,260 C 90,256 98,257 104,262
C 107,254 113,247 121,244 C 129,241 137,243 143,249
C 147,241 154,234 163,231 C 172,228 181,231 186,238
C 185,230 186,221 190,213 C 194,205 202,200 210,200
C 205,192 203,182 206,173 C 209,164 217,158 225,157
C 218,149 215,138 218,128 C 221,118 230,112 239,111
C 231,102 227,90 230,79 C 233,68 243,62 254,63
C 245,53 239,41 242,30 C 245,19 257,14 267,17
C 258,13 248,11 238,13 C 228,15 220,21 216,29
C 209,23 201,19 193,19 C 185,19 178,23 174,29
C 167,23 159,19 150,19 C 142,19 135,24 131,30
C 126,25 121,20 116,19 Z
"/>
<!-- Small Northland chain islands -->
<ellipse class="land" cx="256" cy="24" rx="5" ry="4"/>
<ellipse class="land" cx="249" cy="36" rx="4" ry="3"/>
<ellipse class="land" cx="243" cy="48" rx="4" ry="3.5"/>
<!-- =====================================================
SOUTH ISLAND โ accurate outline from reference image
Starting at Farewell Spit (NW tip), clockwise
===================================================== -->
<path class="land" filter="url(#sh)" d="
M 112,226
C 117,222 123,222 129,225 C 135,228 139,234 139,241
L 144,239 C 149,236 155,237 160,241 C 165,245 166,252 163,257
L 168,257 C 174,256 180,259 183,265 C 186,271 184,279 179,282
C 184,288 187,296 185,304 C 183,312 177,317 170,318
C 174,325 175,334 172,342 C 169,350 162,355 155,354
C 156,363 153,372 147,377 C 141,382 133,382 127,378
C 125,387 120,395 112,399 C 104,403 95,402 88,397
C 84,405 78,412 69,415 C 60,418 51,415 45,409
C 40,416 32,422 22,423 C 12,424 3,419 0,412
L 2,400 C 8,395 15,394 22,397
L 21,386 C 22,377 27,369 35,366 C 43,363 52,367 57,374
C 59,364 64,355 72,350 C 80,345 90,346 96,353
C 99,343 105,334 114,330 C 123,326 133,328 139,336
C 140,325 143,315 150,309 C 157,303 166,302 173,307
C 171,298 171,287 175,279 C 179,271 188,267 196,269
C 193,259 192,248 196,239 C 200,230 210,225 219,227
C 214,217 211,206 214,195 C 217,184 227,178 237,179
C 231,169 228,157 232,146 C 236,135 247,129 258,131
C 249,121 244,108 247,96 C 250,84 261,77 272,79
L 271,73 C 262,69 253,70 245,75 C 237,80 233,89 235,98
C 226,94 216,93 209,99 C 202,105 200,115 204,124
C 195,122 185,123 179,130 C 173,137 172,147 177,155
C 168,154 159,157 153,164 C 147,171 147,181 152,188
C 143,189 134,193 128,201 C 122,209 122,220 128,227
L 112,226 Z
"/>
<!-- Stewart Island -->
<path class="land" d="
M 60,458 C 65,453 72,452 79,455 C 86,458 90,466 88,473
C 86,480 79,484 72,482 C 65,480 61,473 62,466 Z
"/>
<!-- =====================================================
PINS โ all placed at correct geographic coordinates
===================================================== -->
<!-- 1: Ora's Farm โ Mangawhai (-36.09, 174.58) -->
<g class="pin-group" data-id="0" onclick="selectGrower(0)">
<circle class="pin-circle" cx="144" cy="72" r="9"/>
<text class="pin-number" x="144" y="72">1</text>
</g>
<!-- 2: Capped Mushrooms โ Devonport, Auckland (-36.83, 174.80) -->
<g class="pin-group" data-id="1" onclick="selectGrower(1)">
<circle class="pin-circle" cx="142" cy="97" r="9"/>
<text class="pin-number" x="142" y="97">2</text>
</g>
<!-- 3: Out of the Dark โ South Auckland (-37.03, 174.91) -->
<g class="pin-group" data-id="2" onclick="selectGrower(2)">
<circle class="pin-circle" cx="150" cy="105" r="9"/>
<text class="pin-number" x="150" y="105">3</text>
</g>
<!-- 4: Mercer Mushrooms โ Pukekawa, Waikato (-37.31, 175.01) -->
<g class="pin-group" data-id="3" onclick="selectGrower(3)">
<circle class="pin-circle" cx="158" cy="115" r="9"/>
<text class="pin-number" x="158" y="115">4</text>
</g>
<!-- 5: Mushrooms by the Sea โ Raglan (-37.80, 174.88) -->
<g class="pin-group" data-id="4" onclick="selectGrower(4)">
<circle class="pin-circle" cx="140" cy="133" r="9"/>
<text class="pin-number" x="140" y="133">5</text>
</g>
<!-- 6: Valley Mushrooms NZ โ Waitotara (-39.85, 174.73) -->
<g class="pin-group" data-id="5" onclick="selectGrower(5)">
<circle class="pin-circle" cx="138" cy="208" r="9"/>
<text class="pin-number" x="138" y="208">6</text>
</g>
<!-- 7: Ohau Gourmet Mushrooms โ Ohau, Levin (-40.65, 175.18) -->
<g class="pin-group" data-id="6" onclick="selectGrower(6)">
<circle class="pin-circle" cx="150" cy="238" r="9"/>
<text class="pin-number" x="150" y="238">7</text>
</g>
<!-- 8: Neudorf Mushrooms โ Upper Moutere, Nelson (-41.26, 172.96) -->
<g class="pin-group" data-id="7" onclick="selectGrower(7)">
<circle class="pin-circle" cx="116" cy="261" r="9"/>
<text class="pin-number" x="116" y="261">8</text>
</g>
<!-- 9: Oak and Spore โ West Melton, Canterbury (-43.52, 172.29) -->
<g class="pin-group" data-id="8" onclick="selectGrower(8)">
<circle class="pin-circle" cx="104" cy="338" r="9"/>
<text class="pin-number" x="104" y="338">9</text>
</g>
</svg>
</div>
<div class="map-legend">
<div class="legend-dot"></div>
<span>Select a pin to view farm details</span>
</div>
</div>
<!-- SIDEBAR -->
<div class="sidebar">
<div class="sidebar-header">
<h2>NZ Mushroom Growers Directory</h2>
<p>9 farms ยท Click any card to expand</p>
</div>
<div class="grower-list" id="growerList"></div>
</div>
</div>
<footer>
<p>Data compiled April 2026 ยท <span>Aotearoa New Zealand</span> ยท For research & sourcing purposes</p>
</footer>
<script>
const growers = [
{
name: "Ora's Farm", location: "Mangawhai, Northland", est: "2016",
mushrooms: ["Oyster", "Shiitake", "Specialty varieties"],
usps: ["NZ-certified commercial grower","Supplies wholesalers, supermarkets & top restaurants","12.5-hectare farm with home & business delivery","Fresh powders and value-added products available"],
description: "Founded by Ora and Itay after a career change in 2016, this certified commercial operation in Mangawhai has grown into one of NZ's most respected mushroom suppliers."
},
{
name: "Capped Mushrooms", location: "Devonport, Auckland", est: "c. 2020",
mushrooms: ["Gourmet varieties", "Medicinal mushrooms", "Functional species"],
usps: ["Urban agri-tech farm using latest precision technology","Supplies Farro Fresh, Kingi & Esther restaurants","In-store Myco Chamber at Farro Grey Lynn โ grow live on-site","Grown on 100% NZ-sourced pine sawdust & organic rye grain","Regenerative model: compost waste returned to local farms"],
description: "A pioneering urban mushroom farm combining cutting-edge agri-tech with a regenerative farming ethos, delivering gourmet and medicinal varieties to Auckland's top food destinations."
},
{
name: "Out of the Dark Mushrooms", location: "South Auckland", est: "N/A",
mushrooms: ["Exotic & specialty varieties"],
usps: ["Dedicated exotic mushroom grower & distributor","Supplies many of NZ's finest restaurants","Focus on rare and hard-to-source varieties","Trade-focused commercial operation"],
description: "A South Auckland-based specialist in exotic mushrooms, supplying New Zealand's top-end restaurant trade with rare and premium varieties unavailable through mainstream channels."
},
{
name: "Mercer Mushrooms", location: "Pukekawa, Waikato", est: "N/A",
mushrooms: ["Button mushroom ('Bombay Button')", "Portobello", "Flat mushrooms"],
usps: ["Home of the iconic 'Bombay Button' โ a premium NZ button mushroom","Large-scale commercial operation on the Bombay Hills","Sustainably grown all year round","Picked fresh and delivered daily to retail stores"],
description: "Set on the picturesque southern slopes of the Bombay Hills beside the Waikato River, Mercer Mushrooms is a major commercial grower renowned for their signature Bombay Button mushroom."
},
{
name: "Mushrooms by the Sea", location: "Lorenzen Bay, Raglan", est: "2020",
mushrooms: ["Pekepeke-Kiore (NZ Lions Mane)", "Oyster", "Cultures & spawn"],
usps: ["NZ specialists in Pekepeke-Kiore โ native NZ Lions Mane","Purpose-built laboratory, packing facility & grow rooms","Ships spawn, cultures & grow kits nationwide","Founded during 2020 lockdown โ a genuine passion project"],
description: "Sean and Emily stumbled upon fungi while picking field mushrooms during Level 4 lockdown in 2020. Now operating a dedicated farm in Raglan specialising in NZ's own native lions mane."
},
{
name: "Valley Mushrooms NZ", location: "Waitotara Valley, Whanganui", est: "N/A",
mushrooms: ["Pink Oyster", "Grey Oyster", "Shiitake", "Coralstooth"],
usps: ["Family-owned farm nestled in the scenic Waitotara Valley","Local supplier to Whanganui & Taranaki regions","Supplies fresh mushrooms and grow bags","Strong community and regional food supply focus"],
description: "A family business rooted in the beautiful Waitotara Valley, growing a diverse range of gourmet mushrooms and supplying fresh produce and grow kits to the Whanganui and Taranaki communities."
},
{
name: "Ohau Gourmet Mushrooms / Mycobio", location: "Ohau, Levin", est: "c. 2018",
mushrooms: ["Grey Oyster", "Functional mushroom extracts", "Fermented mushroom foods"],
usps: ["Permaculture farm โ grows, ferments, extracts & transforms mushrooms","Wellness products: high-potency functional mushroom extracts","Featured on TVNZ Country Calendar","Farm tours available for schools, corporates & public","Upcycles agricultural by-products as growing substrate"],
description: "An award-winning permaculture operation in Ohau where mushrooms are grown, fermented and transformed into nourishing foods and wellness products within a single, connected living system."
},
{
name: "Neudorf Mushrooms", location: "Upper Moutere, Nelson", est: "2001",
mushrooms: ["Saffron Milk Cap", "Birch Bolete", "Larch Bolete", "Slippery Jack", "Pine Bolete", "Wild Mushroom Mix (dried)"],
usps: ["NZ's first & only commercial Saffron Milk Cap grower","Mycorrhizal mushrooms grown symbiotically with ~6,000 trees","Former deer farm transformed into a mushroom forest/orchard","Spray & fertiliser free โ wild forest conditions","Supplies NZ-wide & sells at Nelson Farmers Market on Wednesdays"],
description: "The oldest specialist grower on this list, Neudorf has pioneered mycorrhizal mushroom cultivation in NZ since 2001, farming rare wild species in a living forest of nearly 6,000 trees in sunny Nelson."
},
{
name: "Oak and Spore", location: "West Melton, Canterbury", est: "N/A",
mushrooms: ["Italian Oyster (Phoenix Oyster)", "Pink Oyster", "Shiitake", "Coral Tooth / NZ Lions Mane"],
usps: ["State-of-the-art purpose-built growing facility","Year-round supply to NZ restaurant industry","Specialists in Italian Oyster mushrooms","Weekend stall at Lyttelton Farmers Market","Shiitake grown on sustainably sourced NZ wood"],
description: "A family-owned farm in West Melton, Canterbury with a purpose-built facility producing premium gourmet mushroom species year-round, with a strong focus on supplying the restaurant industry."
}
];
function renderGrowerList() {
document.getElementById('growerList').innerHTML = growers.map((g, i) => `
<div class="grower-card" id="card-${i}" onclick="selectGrower(${i})">
<div class="card-top">
<div class="card-num">${i+1}</div>
<div>
<div class="card-name">${g.name}</div>
<div class="card-location">๐ ${g.location}</div>
</div>
</div>
<div class="card-detail">
${g.est!=='N/A'?`<div class="est-chip">โฑ Est. ${g.est}</div>`:''}
<div class="detail-section">
<div class="detail-label">About</div>
<div class="detail-text">${g.description}</div>
</div>
<div class="detail-section">
<div class="detail-label">Mushrooms Grown</div>
<div class="mushroom-tags">${g.mushrooms.map(m=>`<span class="mushroom-tag">๐ ${m}</span>`).join('')}</div>
</div>
<div class="detail-section">
<div class="detail-label">Key Selling Points</div>
<ul class="usp-list">${g.usps.map(u=>`<li>${u}</li>`).join('')}</ul>
</div>
</div>
</div>
`).join('');
}
let activeId = null;
function selectGrower(id) {
if (activeId !== null) {
document.getElementById(`card-${activeId}`)?.classList.remove('active');
document.querySelector(`.pin-group[data-id="${activeId}"]`)?.classList.remove('active');
}
if (activeId === id) { activeId = null; return; }
activeId = id;
document.getElementById(`card-${id}`)?.classList.add('active');
document.querySelector(`.pin-group[data-id="${id}"]`)?.classList.add('active');
document.getElementById(`card-${id}`)?.scrollIntoView({ behavior:'smooth', block:'nearest' });
}
renderGrowerList();
</script>
</body>
</html>