← back to Jill Website
views/nature-adventures.ejs
564 lines
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Nature Adventures - Nosara Beachfront Rentals</title>
<meta name="description" content="Explore the incredible wildlife and nature of Nosara, Costa Rica. Encounter monkeys, sloths, exotic birds, sea turtles, and pristine rainforests in paradise.">
<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:wght@400;600;700&display=swap" rel="stylesheet">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<!-- Stylesheets -->
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/css/adaptive-loading.css">
<link rel="stylesheet" href="/css/activity-links.css">
</head>
<body>
<!-- Navigation -->
<nav class="navbar">
<div class="nav-container">
<div class="nav-logo">
<h2><a href="/" style="text-decoration: none; color: inherit;">Nosara Beachfront</a></h2>
</div>
<ul class="nav-menu">
<li><a href="/" class="nav-link">Home</a></li>
<li><a href="/#properties" class="nav-link">Properties</a></li>
<li><a href="/beaches" class="nav-link">Beaches</a></li>
<li><a href="/#experiences" class="nav-link">Experiences</a></li>
<li><a href="/#videos" class="nav-link">Videos</a></li>
<li><a href="/#history" class="nav-link">History</a></li>
<li><a href="/#dining" class="nav-link">Dining</a></li>
<li><a href="/#contact" class="nav-link">Contact</a></li>
</ul>
<div class="hamburger">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</div>
</div>
</nav>
<!-- Hero Section -->
<section class="hero" style="background: linear-gradient(135deg, rgba(34, 139, 34, 0.5) 0%, rgba(0, 100, 0, 0.5) 100%),
url('https://images.unsplash.com/photo-1516426122078-c23e76319801?q=85&w=2400&auto=format&fit=crop&ixlib=rb-4.0.3'); background-size: cover; background-position: center;">
<div class="hero-content">
<div class="hero-text">
<h1 class="hero-title">Nature Adventures</h1>
<p class="hero-subtitle">Discover the incredible wildlife and pristine rainforests of Nosara</p>
</div>
</div>
<div class="hero-scroll">
<p>Scroll to explore</p>
<div class="scroll-arrow" aria-hidden="true"></div>
</div>
</section>
<!-- Category Navigation -->
<%- include('partials/category-nav', { currentPage: 'nature-adventures' }) %>
<!-- Nature Introduction -->
<section class="experiences" style="padding: 5rem 0 3rem;">
<div class="container">
<div class="section-header">
<h2>Why Nosara is a Wildlife Paradise</h2>
<p>Nosara is home to one of Costa Rica's most biodiverse ecosystems, where pristine rainforests meet protected coastlines creating a sanctuary for hundreds of wildlife species.</p>
</div>
<div style="max-width: 900px; margin: 2rem auto; padding: 2rem; background: linear-gradient(135deg, rgba(34, 139, 34, 0.05), rgba(0, 100, 0, 0.05)); border-radius: 15px; border-left: 4px solid #228b22;">
<p style="font-size: 1.1rem; line-height: 1.8; color: var(--dark);">
From howler monkeys calling at dawn to sea turtles nesting on moonlit beaches, Nosara offers incredible wildlife encounters in their natural habitat. The region's commitment to conservation has created protected corridors where rainforest canopy connects to coastal mangroves, supporting an extraordinary variety of mammals, birds, reptiles, and marine life. Whether you're spotting three-toed sloths in the trees, watching scarlet macaws soar overhead, or witnessing the ancient ritual of sea turtle nesting, Nosara's nature experiences are truly unforgettable.
</p>
</div>
</div>
</section>
<!-- Wildlife Photos Gallery -->
<section class="villas" style="background: var(--light); padding: 4rem 0;">
<div class="container">
<div class="section-header">
<h2>Wildlife Gallery</h2>
<p>Experience the amazing biodiversity of Nosara's forests and coastlines</p>
</div>
<div class="villas-grid" style="grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem;">
<!-- Howler Monkeys -->
<div class="villa-card" style="cursor: default;">
<div class="villa-image" style="height: 300px;">
<img
src="https://images.unsplash.com/photo-1540573133985-87b6da6d54a9?q=85&w=1200&auto=format&fit=crop"
alt="Howler monkey in rainforest canopy"
loading="lazy"
style="width: 100%; height: 100%; object-fit: cover;">
</div>
<div class="villa-content">
<h3>Howler Monkeys</h3>
<p>Wake to the incredible calls of howler monkeys echoing through the forest. These impressive primates can be spotted in the canopy near most properties.</p>
</div>
</div>
<!-- Sloths -->
<div class="villa-card" style="cursor: default;">
<div class="villa-image" style="height: 300px;">
<img
src="https://images.unsplash.com/photo-1594646843779-da2f8b4a8c6b?q=85&w=1200&auto=format&fit=crop"
alt="Three-toed sloth hanging from tree branch"
loading="lazy"
style="width: 100%; height: 100%; object-fit: cover;">
</div>
<div class="villa-content">
<h3>Sloths</h3>
<p>Both two-toed and three-toed sloths live in Nosara's forests. Look up into the cecropia trees to spot these gentle, slow-moving creatures.</p>
</div>
</div>
<!-- Scarlet Macaws -->
<div class="villa-card" style="cursor: default;">
<div class="villa-image" style="height: 300px;">
<img
src="https://images.unsplash.com/photo-1552728089-57bdde30beb3?q=85&w=1200&auto=format&fit=crop"
alt="Scarlet macaws flying together in blue sky"
loading="lazy"
style="width: 100%; height: 100%; object-fit: cover;">
</div>
<div class="villa-content">
<h3>Scarlet Macaws</h3>
<p>Watch brilliant scarlet macaws fly overhead in pairs, their vibrant red, yellow, and blue plumage unmistakable against the tropical sky.</p>
</div>
</div>
<!-- Sea Turtles -->
<div class="villa-card" style="cursor: default;">
<div class="villa-image" style="height: 300px;">
<img
src="https://images.unsplash.com/photo-1559827260-dc66d52bef19?q=85&w=1200&auto=format&fit=crop"
alt="Sea turtle swimming in ocean"
loading="lazy"
style="width: 100%; height: 100%; object-fit: cover;">
</div>
<div class="villa-content">
<h3>Sea Turtles</h3>
<p>Witness the ancient nesting ritual of Olive Ridley and Leatherback sea turtles on protected beaches during nesting season (July-December).</p>
</div>
</div>
<!-- Toucans -->
<div class="villa-card" style="cursor: default;">
<div class="villa-image" style="height: 300px;">
<img
src="https://images.unsplash.com/photo-1612024782355-f85e7f6ee4ea?q=85&w=1200&auto=format&fit=crop"
alt="Colorful toucan with large beak perched on branch"
loading="lazy"
style="width: 100%; height: 100%; object-fit: cover;">
</div>
<div class="villa-content">
<h3>Toucans</h3>
<p>Spot colorful toucans with their distinctive large beaks feeding on tropical fruits in the forest canopy, often seen in small groups.</p>
</div>
</div>
<!-- Iguanas -->
<div class="villa-card" style="cursor: default;">
<div class="villa-image" style="height: 300px;">
<img
src="https://images.unsplash.com/photo-1551476330-eef0be4966fd?q=85&w=1200&auto=format&fit=crop"
alt="Green iguana basking in sunlight"
loading="lazy"
style="width: 100%; height: 100%; object-fit: cover;">
</div>
<div class="villa-content">
<h3>Iguanas</h3>
<p>Green and black iguanas are commonly seen basking on rocks and branches. These impressive reptiles can grow over 5 feet long.</p>
</div>
</div>
<!-- Coatis -->
<div class="villa-card" style="cursor: default;">
<div class="villa-image" style="height: 300px;">
<img
src="https://images.unsplash.com/photo-1614027164847-1b28cfe1df60?q=85&w=1200&auto=format&fit=crop"
alt="Coati foraging in rainforest"
loading="lazy"
style="width: 100%; height: 100%; object-fit: cover;">
</div>
<div class="villa-content">
<h3>Coatis</h3>
<p>These curious, raccoon-like mammals travel in social groups foraging for insects and fruits. Watch them use their flexible snouts to search the forest floor.</p>
</div>
</div>
<!-- White-faced Capuchin Monkeys -->
<div class="villa-card" style="cursor: default;">
<div class="villa-image" style="height: 300px;">
<img
src="https://images.unsplash.com/photo-1503919545889-aef636e10ad4?q=85&w=1200&auto=format&fit=crop"
alt="White-faced capuchin monkey in tree"
loading="lazy"
style="width: 100%; height: 100%; object-fit: cover;">
</div>
<div class="villa-content">
<h3>White-faced Capuchins</h3>
<p>Intelligent and playful, these monkeys are often seen traveling in troops through the canopy, using tools and exhibiting complex social behaviors.</p>
</div>
</div>
</div>
</div>
</section>
<!-- Rainforests & Wildlife Refuges -->
<section class="experiences" style="padding: 5rem 0;">
<div class="container">
<div class="section-header">
<h2>Rainforests & Wildlife Refuges</h2>
<p>Protected natural areas teeming with biodiversity</p>
</div>
<div class="experiences-grid">
<!-- Ostional Wildlife Refuge -->
<div class="experience-card">
<div class="experience-icon">
<i class="fas fa-turtle"></i>
</div>
<h3>Ostional Wildlife Refuge</h3>
<p><strong>Famous For:</strong> Olive Ridley sea turtle arribadas (mass nesting events)</p>
<p><strong>Best Time:</strong> July-December for nesting, September-November for arribadas</p>
<p><strong>Features:</strong> 4 miles of protected beach, night tours available</p>
<p><strong>Tours:</strong> Guided night turtle watching with certified local guides ($25-$40)</p>
<p><strong>Bonus:</strong> Funds from tours support community conservation efforts</p>
</div>
<!-- Nosara Biological Reserve -->
<div class="experience-card">
<div class="experience-icon">
<i class="fas fa-tree"></i>
</div>
<h3>Nosara Biological Reserve</h3>
<p><strong>Size:</strong> 90 acres of protected primary and secondary tropical forest</p>
<p><strong>Wildlife:</strong> 270+ bird species, 4 monkey species, coatis, armadillos</p>
<p><strong>Trails:</strong> 5 km of well-maintained hiking trails through rainforest</p>
<p><strong>Activities:</strong> Self-guided walks ($10), guided nature tours ($35)</p>
<p><strong>Difficulty:</strong> Easy to moderate trails, suitable for families</p>
</div>
<!-- Lagarta Lodge Reserve -->
<div class="experience-card">
<div class="experience-icon">
<i class="fas fa-binoculars"></i>
</div>
<h3>Lagarta Lodge Reserve</h3>
<p><strong>Specialty:</strong> Birding paradise with observation platform</p>
<p><strong>Ecosystem:</strong> Mangrove estuary meets tropical dry forest</p>
<p><strong>Birds:</strong> Roseate spoonbills, herons, kingfishers, parrots, trogons</p>
<p><strong>Tours:</strong> Sunrise birding tours (6 AM), sunset kayak tours</p>
<p><strong>Perfect For:</strong> Bird photographers, nature enthusiasts, quiet contemplation</p>
</div>
<!-- Werner Sauter Reserve -->
<div class="experience-card">
<div class="experience-icon">
<i class="fas fa-leaf"></i>
</div>
<h3>Werner Sauter Biological Reserve</h3>
<p><strong>Location:</strong> Private reserve in heart of Nosara</p>
<p><strong>Features:</strong> Pristine primary forest, river trails, wildlife corridors</p>
<p><strong>Wildlife:</strong> All 4 monkey species, sloths, peccaries, 200+ bird species</p>
<p><strong>Access:</strong> Guided tours only to protect sensitive ecosystems</p>
<p><strong>Tours:</strong> Small group nature walks with naturalist guides ($45)</p>
</div>
<!-- Camaronal Wildlife Refuge -->
<div class="experience-card">
<div class="experience-icon">
<i class="fas fa-water"></i>
</div>
<h3>Camaronal Wildlife Refuge</h3>
<p><strong>Highlight:</strong> Leatherback turtle nesting site (November-April)</p>
<p><strong>Beach:</strong> 5 miles of pristine, undeveloped coastline</p>
<p><strong>Other Wildlife:</strong> Dolphins, whales (migration season), crocodiles in estuary</p>
<p><strong>Access:</strong> 30-minute drive from Nosara, 4x4 recommended</p>
<p><strong>Perfect For:</strong> Adventurous nature lovers, turtle conservation supporters</p>
</div>
<!-- Barra Honda National Park -->
<div class="experience-card">
<div class="experience-icon">
<i class="fas fa-mountain"></i>
</div>
<h3>Barra Honda National Park</h3>
<p><strong>Distance:</strong> 45-minute drive inland from Nosara</p>
<p><strong>Unique Features:</strong> 42 limestone caves with stunning formations</p>
<p><strong>Wildlife:</strong> White-faced monkeys, coatis, parrots, iguanas</p>
<p><strong>Activities:</strong> Cave rappelling, canopy observation tower, hiking</p>
<p><strong>Perfect For:</strong> Adventure seekers, geology enthusiasts, day trips</p>
</div>
</div>
</div>
</section>
<!-- Guided Tours & Wildlife Spotting -->
<section class="history" style="background: var(--light); padding: 5rem 0;">
<div class="container">
<div class="section-header">
<h2>Guided Tours & Wildlife Experiences</h2>
<p>Expert-led adventures for unforgettable wildlife encounters</p>
</div>
<div class="cultural-grid" style="grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem;">
<!-- Guided Nature Walks -->
<div class="cultural-card">
<div class="cultural-icon">
<i class="fas fa-hiking"></i>
</div>
<h4>Guided Rainforest Walks</h4>
<p>Expert naturalist guides lead you through primary forest, identifying wildlife, plants, and sharing ecological knowledge.</p>
<div class="cultural-fact">
<strong>Duration:</strong> 2-3 hours, morning or afternoon
</div>
<div class="cultural-fact">
<strong>Price:</strong> $45-$65 per person, small groups (max 8)
</div>
<div class="cultural-fact">
<strong>Includes:</strong> Binoculars, field guides, bottled water
</div>
</div>
<!-- Night Tours -->
<div class="cultural-card">
<div class="cultural-icon">
<i class="fas fa-moon"></i>
</div>
<h4>Night Jungle Tours</h4>
<p>Experience the rainforest after dark when nocturnal creatures emerge. Spot frogs, snakes, insects, and sleeping birds with flashlights.</p>
<div class="cultural-fact">
<strong>Duration:</strong> 2 hours, starting at sunset
</div>
<div class="cultural-fact">
<strong>Price:</strong> $50-$70 per person
</div>
<div class="cultural-fact">
<strong>Highlights:</strong> Tarantulas, poison dart frogs, sleeping birds
</div>
</div>
<!-- Birding Tours -->
<div class="cultural-card">
<div class="cultural-icon">
<i class="fas fa-dove"></i>
</div>
<h4>Birding Expeditions</h4>
<p>Early morning tours with expert ornithologists to spot and identify Costa Rica's incredible diversity of birds.</p>
<div class="cultural-fact">
<strong>Duration:</strong> 3-4 hours, starting at sunrise (5:30 AM)
</div>
<div class="cultural-fact">
<strong>Price:</strong> $60-$90 per person
</div>
<div class="cultural-fact">
<strong>Species:</strong> 20-40 species per tour typical
</div>
</div>
<!-- Turtle Nesting Tours -->
<div class="cultural-card">
<div class="cultural-icon">
<i class="fas fa-egg"></i>
</div>
<h4>Turtle Nesting Experiences</h4>
<p>Witness the miraculous sight of sea turtles coming ashore to nest, accompanied by certified conservation guides.</p>
<div class="cultural-fact">
<strong>Season:</strong> July-December (Olive Ridley), November-April (Leatherback)
</div>
<div class="cultural-fact">
<strong>Price:</strong> $25-$45 per person
</div>
<div class="cultural-fact">
<strong>Time:</strong> Night tours (8 PM-12 AM), tide-dependent
</div>
</div>
<!-- Wildlife Photography Tours -->
<div class="cultural-card">
<div class="cultural-icon">
<i class="fas fa-camera"></i>
</div>
<h4>Wildlife Photography Tours</h4>
<p>Specialized tours for photographers with slower pace, better positioning, and expert guidance on camera settings.</p>
<div class="cultural-fact">
<strong>Duration:</strong> Half-day (4 hours) or full-day (8 hours)
</div>
<div class="cultural-fact">
<strong>Price:</strong> $120-$200 per person
</div>
<div class="cultural-fact">
<strong>Includes:</strong> Photo tips, location scouting, small groups (max 4)
</div>
</div>
<!-- Kayak Nature Tours -->
<div class="cultural-card">
<div class="cultural-icon">
<i class="fas fa-ship"></i>
</div>
<h4>Mangrove Kayak Tours</h4>
<p>Paddle through mangrove estuaries spotting herons, crocodiles, monkeys, and iguanas along the water's edge.</p>
<div class="cultural-fact">
<strong>Duration:</strong> 2.5-3 hours, morning or sunset
</div>
<div class="cultural-fact">
<strong>Price:</strong> $55-$75 per person
</div>
<div class="cultural-fact">
<strong>Includes:</strong> Kayak, paddle, life vest, guide, snacks
</div>
</div>
</div>
<!-- Wildlife Spotting Tips -->
<div style="max-width: 900px; margin: 4rem auto; padding: 2rem; background: var(--white); border-radius: 15px; box-shadow: 0 10px 30px rgba(0,0,0,0.1);">
<h3 style="color: var(--primary-color); margin-bottom: 1.5rem; text-align: center;">
<i class="fas fa-lightbulb"></i> Wildlife Spotting Tips
</h3>
<ul style="line-height: 2; color: var(--dark); font-size: 1.05rem;">
<li><strong>Best Times:</strong> Early morning (6-9 AM) and late afternoon (3-6 PM) when animals are most active</li>
<li><strong>Look Up:</strong> Most wildlife in Nosara lives in the canopy - scan the treetops slowly</li>
<li><strong>Listen:</strong> Sounds often lead to sightings - learn to recognize howler calls, parrot squawks</li>
<li><strong>Stay Quiet:</strong> Move slowly and keep voices low to avoid scaring animals</li>
<li><strong>Bring Binoculars:</strong> Essential for spotting distant birds and canopy wildlife</li>
<li><strong>Dress Appropriately:</strong> Neutral colors, closed-toe shoes, insect repellent, sunscreen</li>
<li><strong>Respect Wildlife:</strong> Never feed animals, maintain 10+ foot distance, no flash photography</li>
<li><strong>Hire Local Guides:</strong> Expert eyes spot wildlife you'd miss and share valuable knowledge</li>
</ul>
</div>
</div>
</section>
<!-- Booking Widget -->
<%- include('partials/booking-widget') %>
<!-- Call to Action -->
<section class="contact" style="padding: 5rem 0;">
<div class="container">
<div class="section-header">
<h2>Ready for Your Nature Adventure?</h2>
<p>Book your beachfront sanctuary and immerse yourself in Nosara's incredible wildlife</p>
</div>
<div style="text-align: center; margin-top: 2rem;">
<a href="/#properties" class="btn-primary" style="padding: 1.2rem 2.5rem; font-size: 1.1rem; border-radius: 50px; text-decoration: none; display: inline-block; background: var(--primary-color); color: var(--white);">
View Available Properties <i class="fas fa-arrow-right"></i>
</a>
<a href="/#contact" class="btn-secondary" style="padding: 1.2rem 2.5rem; font-size: 1.1rem; border-radius: 50px; text-decoration: none; display: inline-block; margin-left: 1rem; background: var(--accent-color); color: var(--white);">
Contact Us <i class="fas fa-envelope"></i>
</a>
</div>
</div>
</section>
<!-- Footer -->
<footer class="footer">
<div class="container">
<div class="footer-content">
<div class="footer-section">
<h3>Nosara Beachfront</h3>
<p>Your gateway to luxury beachfront living in Costa Rica's most beautiful coastal paradise.</p>
<div class="social-links">
<a href="#" aria-label="Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="#" aria-label="Instagram"><i class="fab fa-instagram"></i></a>
<a href="#" aria-label="Twitter"><i class="fab fa-twitter"></i></a>
</div>
</div>
<div class="footer-section">
<h4>Quick Links</h4>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/#properties">Properties</a></li>
<li><a href="/beaches">Beaches</a></li>
<li><a href="/surfing">Surfing</a></li>
<li><a href="/yoga-wellness">Yoga & Wellness</a></li>
<li><a href="/nature-adventures">Nature Adventures</a></li>
<li><a href="/#experiences">Experiences</a></li>
<li><a href="/#contact">Contact</a></li>
</ul>
</div>
<div class="footer-section">
<h4>Resources</h4>
<ul>
<li><a href="#">Travel Guide</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Terms & Conditions</a></li>
<li><a href="#">Privacy Policy</a></li>
</ul>
</div>
</div>
<div class="footer-bottom">
<p>© <%= currentYear %> Nosara Beachfront Rentals. All rights reserved.</p>
</div>
</div>
</footer>
<!-- JavaScript -->
<script>
// Mobile menu toggle
const hamburger = document.querySelector('.hamburger');
const navMenu = document.querySelector('.nav-menu');
hamburger.addEventListener('click', () => {
hamburger.classList.toggle('active');
navMenu.classList.toggle('active');
});
// Close mobile menu when clicking on a link
document.querySelectorAll('.nav-link').forEach(link => {
link.addEventListener('click', () => {
hamburger.classList.remove('active');
navMenu.classList.remove('active');
});
});
// Smooth scrolling for anchor links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
const target = document.querySelector(this.getAttribute('href'));
if (target) {
target.scrollIntoView({
behavior: 'smooth',
block: 'start'
});
}
});
});
// Navbar scroll effect
let lastScroll = 0;
window.addEventListener('scroll', () => {
const navbar = document.querySelector('.navbar');
const currentScroll = window.pageYOffset;
if (currentScroll > 100) {
navbar.style.background = 'rgba(255, 255, 255, 0.98)';
navbar.style.boxShadow = '0 5px 20px rgba(0,0,0,0.15)';
} else {
navbar.style.background = 'rgba(255, 255, 255, 0.95)';
navbar.style.boxShadow = '0 5px 20px rgba(0,0,0,0.1)';
}
lastScroll = currentScroll;
});
</script>
<!-- Adaptive Loading Scripts -->
<script src="/js/connection-speed.js"></script>
<script src="/js/adaptive-loading.js"></script>
<!-- Activity Links Component -->
<script src="/js/activity-links.js"></script>
</body>
</html>