Jelajahi Sumber

Rework pricing by boat with tab selector, update refreshments text

- Per-boat pricing tabs (Gunslinger / Gunslinger II) with separate inshore+offshore rates
- Gunslinger: Snorkeling & Dolphins added, updated price points
- Gunslinger II: Recreational/4hr tour, higher inshore rates, 3 offshore tiers
- Changed "ice & refreshments" to "ice, drinks & fruit" per customer feedback

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
AusPrinzip 2 minggu lalu
induk
melakukan
44a5772f0d
2 mengubah file dengan 73 tambahan dan 25 penghapusan
  1. 24 8
      .claude/CLAUDE.md
  2. 49 17
      website/src/routes/+page.svelte

+ 24 - 8
.claude/CLAUDE.md

@@ -19,21 +19,37 @@ Sport fishing charter operation in Quepos, Central Pacific Costa Rica. Targets p
 | (unnamed) | Grady-White | 25.3 ft | 2022 | 2x Suzuki 200 HP (44 knots max) | 8 pax | Radar, 3 navigators, VHF radio, 2 fishfinders, toilet, freshwater, live well |
 
 ### Tour Pricing (USD)
-**Inshore:**
+
+**Gunslinger — Inshore:**
 | Tour | Price |
 |------|-------|
-| Recreativo | $350 |
-| 3 Hours | $500 |
+| Snorkeling & Dolphins | $350 |
+| 4 Hours Fishing | $500 |
 | Half Day | $650 |
-| 3/4 Day | $800 |
-| Full Day | $950 |
+| 3/4 Day | $750 |
+| Full Day | $850 |
+
+**Gunslinger — Offshore:**
+| Tour | Price |
+|------|-------|
+| 3/4 Day | $850 |
+| Full Day | $1,050 |
 
-**Offshore:**
+**Gunslinger II — Inshore:**
 | Tour | Price |
 |------|-------|
-| Half Day | $700 |
+| Recreational | $350 |
+| 4 Hours Tour | $500 |
+| Half Day | $750 |
 | 3/4 Day | $850 |
-| Full Day | $1,000 |
+| Full Day | $950 |
+
+**Gunslinger II — Offshore:**
+| Tour | Price |
+|------|-------|
+| Half Day | $800 |
+| 3/4 Day | $950 |
+| Full Day | $1,050 |
 
 ### Fishing Techniques
 Live bait, light tackle, casting, trolling, fly fishing, deep fishing, bottom fishing

+ 49 - 17
website/src/routes/+page.svelte

@@ -59,18 +59,38 @@
 
 	const techniques = ['Inshore', 'Offshore', 'Light Tackle', 'Casting', 'Trolling', 'Fly Fishing', 'Deep Fishing', 'Bottom Fishing'];
 
-	const inshoreTrips = [
-		{ name: 'Recreativo', duration: '2 Hours', price: 350, desc: 'Quick taste of Costa Rica fishing — perfect for beginners' },
-		{ name: '3-Hour Trip', duration: '3 Hours', price: 500, desc: 'Extended inshore session with more action' },
-		{ name: 'Half Day', duration: '4–5 Hours', price: 650, desc: 'Our most popular — plenty of time for variety' },
-		{ name: '¾ Day', duration: '6–7 Hours', price: 800, desc: 'Explore multiple spots for the best bites' },
-		{ name: 'Full Day', duration: '8+ Hours', price: 950, desc: 'The ultimate inshore experience, dawn to dusk' }
-	];
+	let selectedBoat = $state(0);
 
-	const offshoreTrips = [
-		{ name: 'Half Day', duration: '4–5 Hours', price: 700, desc: 'Chase sailfish, mahi-mahi and more offshore' },
-		{ name: '¾ Day', duration: '6–7 Hours', price: 850, desc: 'Extended time on the open Pacific' },
-		{ name: 'Full Day', duration: '8+ Hours', price: 1000, desc: 'All day offshore — maximize your chances' }
+	const boats = [
+		{
+			name: 'Gunslinger',
+			inshore: [
+				{ name: 'Snorkeling & Dolphins', price: 350, desc: 'Dolphin encounters and snorkeling in crystal-clear waters' },
+				{ name: '4 Hours Fishing', price: 500, desc: 'Extended inshore session with more action' },
+				{ name: 'Half Day', price: 650, desc: 'Our most popular — plenty of time for variety' },
+				{ name: '¾ Day', price: 750, desc: 'Explore multiple spots for the best bites' },
+				{ name: 'Full Day', price: 850, desc: 'The ultimate inshore experience, dawn to dusk' }
+			],
+			offshore: [
+				{ name: '¾ Day', price: 850, desc: 'Extended time on the open Pacific' },
+				{ name: 'Full Day', price: 1050, desc: 'All day offshore — maximize your chances' }
+			]
+		},
+		{
+			name: 'Gunslinger II',
+			inshore: [
+				{ name: 'Recreational', price: 350, desc: 'Quick taste of Costa Rica fishing — perfect for beginners' },
+				{ name: '4 Hours Tour', price: 500, desc: 'Extended inshore session with more action' },
+				{ name: 'Half Day', price: 750, desc: 'Our most popular — plenty of time for variety' },
+				{ name: '¾ Day', price: 850, desc: 'Explore multiple spots for the best bites' },
+				{ name: 'Full Day', price: 950, desc: 'The ultimate inshore experience, dawn to dusk' }
+			],
+			offshore: [
+				{ name: 'Half Day', price: 800, desc: 'Chase sailfish, mahi-mahi and more offshore' },
+				{ name: '¾ Day', price: 950, desc: 'Extended time on the open Pacific' },
+				{ name: 'Full Day', price: 1050, desc: 'All day offshore — maximize your chances' }
+			]
+		}
 	];
 
 	const gallery = [
@@ -341,6 +361,20 @@
 			<h2 class="font-heading text-3xl font-bold uppercase tracking-wide text-white sm:text-4xl lg:text-5xl">Choose Your Adventure</h2>
 		</div>
 
+		<!-- Boat tabs -->
+		<div class="reveal mb-8 flex justify-center">
+			<div class="inline-flex rounded-lg border border-white/10 bg-deep/60 p-1">
+				{#each boats as boat, i}
+					<button
+						onclick={() => (selectedBoat = i)}
+						class="font-heading rounded-md px-6 py-2.5 text-sm uppercase tracking-wider transition-all {selectedBoat === i ? 'bg-cyan-600 text-white shadow-lg shadow-cyan-500/20' : 'text-slate-400 hover:text-white'}"
+					>
+						{boat.name}
+					</button>
+				{/each}
+			</div>
+		</div>
+
 		<div class="grid gap-8 lg:grid-cols-2 lg:gap-12">
 			<!-- Inshore -->
 			<div class="reveal">
@@ -348,13 +382,12 @@
 					<span class="h-px w-8 bg-cyan-400/50"></span> Inshore
 				</h3>
 				<div class="space-y-3">
-					{#each inshoreTrips as trip}
+					{#each boats[selectedBoat].inshore as trip}
 						<div class="rounded-lg border border-white/5 bg-deep/60 p-4 transition-all hover:border-cyan-500/30">
 							<div class="mb-1 flex items-center justify-between">
 								<h4 class="font-heading text-lg text-white">{trip.name}</h4>
-								<span class="font-heading text-xl text-cyan-400">${trip.price}</span>
+								<span class="font-heading text-xl text-cyan-400">${trip.price.toLocaleString()}</span>
 							</div>
-							<p class="mb-1 text-xs text-slate-500">{trip.duration}</p>
 							<p class="text-sm text-slate-400">{trip.desc}</p>
 						</div>
 					{/each}
@@ -367,13 +400,12 @@
 					<span class="h-px w-8 bg-cyan-400/50"></span> Offshore
 				</h3>
 				<div class="space-y-3">
-					{#each offshoreTrips as trip}
+					{#each boats[selectedBoat].offshore as trip}
 						<div class="rounded-lg border border-white/5 bg-deep/60 p-4 transition-all hover:border-cyan-500/30">
 							<div class="mb-1 flex items-center justify-between">
 								<h4 class="font-heading text-lg text-white">{trip.name}</h4>
 								<span class="font-heading text-xl text-cyan-400">${trip.price.toLocaleString()}</span>
 							</div>
-							<p class="mb-1 text-xs text-slate-500">{trip.duration}</p>
 							<p class="text-sm text-slate-400">{trip.desc}</p>
 						</div>
 					{/each}
@@ -382,7 +414,7 @@
 		</div>
 
 		<div class="reveal mt-10 text-center">
-			<p class="text-sm text-slate-400">All trips include captain, crew, fishing tackle, bait, ice & refreshments. Catch & release for all billfish. Custom trips available on request.</p>
+			<p class="text-sm text-slate-400">All trips include captain, crew, fishing tackle, bait, ice, drinks & fruit. Catch & release for all billfish. Custom trips available on request.</p>
 			<a href={WHATSAPP} target="_blank" rel="noopener noreferrer" class="mt-6 inline-flex items-center gap-2 rounded-lg bg-cyan-600 px-8 py-3.5 font-semibold text-white transition-all hover:bg-cyan-500 hover:shadow-lg hover:shadow-cyan-500/25">
 				<svg class="h-5 w-5" fill="currentColor" viewBox="0 0 24 24"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347z" /><path d="M12 0C5.373 0 0 5.373 0 12c0 2.625.846 5.059 2.284 7.034L.789 23.492a.5.5 0 00.612.638l4.67-1.388A11.94 11.94 0 0012 24c6.627 0 12-5.373 12-12S18.627 0 12 0zm0 22c-2.24 0-4.31-.726-5.993-1.957l-.418-.31-2.79.83.746-2.723-.34-.54A9.96 9.96 0 012 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10z" /></svg>
 				Book Your Trip