manaa-article / index.html
kevinktg's picture
Poppins - Follow Up Deployment
183b289 verified
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Manaa Livings: Riverside Revolution | Good AI Australia</title>
<link rel="icon" type="image/x-icon" href="/static/favicon.ico">
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700;900&family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Inter', sans-serif;
}
h1, h2, h3, h4, h5 {
font-family: 'Playfair Display', serif;
}
.hero-gradient {
background: linear-gradient(135deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.4) 100%);
}
.text-gradient {
background: linear-gradient(135deg, #d4af37 0%, #b8860b 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.gold-border {
border-color: #d4af37;
}
.stat-number {
font-size: 3.5rem;
line-height: 1;
}
.quote-mark {
font-size: 5rem;
line-height: 1;
opacity: 0.2;
}
.glass-card {
background: rgba(255, 255, 255, 0.85);
backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.3);
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
border-radius: 12px;
}
.glass-card-dark {
background: rgba(0, 0, 0, 0.35);
backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.25);
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.2);
border-radius: 12px;
}
</style>
</head>
<body class="bg-gray-100 text-gray-800">
<!-- Navigation -->
<nav class="fixed w-full z-50 bg-white/95 backdrop-blur-sm border-b border-gray-100">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between items-center h-16">
<div class="flex items-center">
<span class="text-2xl font-playfair font-bold text-gradient">Good AI Australia</span>
</div>
<div class="hidden md:flex space-x-8">
<a href="#features" class="text-gray-600 hover:text-gray-900 font-medium">Features</a>
<a href="#team" class="text-gray-600 hover:text-gray-900 font-medium">Team</a>
<a href="#properties" class="text-gray-600 hover:text-gray-900 font-medium">Properties</a>
<a href="#insights" class="text-gray-600 hover:text-gray-900 font-medium">Insights</a>
<a href="article.html" class="text-gray-600 hover:text-gray-900 font-medium">CNALuxury Article</a>
</div>
<div class="flex items-center">
<button class="bg-black text-white px-4 py-2 rounded-md text-sm font-medium">Contact</button>
</div>
</div>
</div>
</nav>
<!-- Hero Section -->
<section class="relative h-screen flex items-center justify-center">
<div class="absolute inset-0 z-0">
<img src="https://i.imgur.com/wlqRqRA.jpeg" alt="Manaa Living Applecross Western Australia" class="w-full h-full object-cover">
<div class="absolute inset-0 hero-gradient"></div>
</div>
<div class="relative z-10 text-center text-white px-4 max-w-4xl" data-aos="fade-up">
<h1 class="text-5xl md:text-7xl font-bold mb-6 font-playfair">Spotlight on Excellence</h1>
<p class="text-xl md:text-2xl mb-8 opacity-90">Inside the Heart of Manaa Livings' Riverside Revolution</p>
<div class="flex flex-col md:flex-row items-center justify-center space-y-4 md:space-y-0 md:space-x-6 text-sm">
<span>By Grok, Kev's Off-the-Books Shadow Content Manager</span>
<span class="hidden md:block"></span>
<span>September 23, 2025 – Perth, WA</span>
</div>
</div>
</section>
<!-- Intro Section -->
<section class="py-20 px-4">
<div class="max-w-4xl mx-auto" data-aos="fade-up">
<p class="text-lg md:text-xl leading-relaxed text-gray-700">
In the sun-drenched riverside enclave of Applecross, where the Swan River whispers promises of luxury and legacy, Manaa Livings stands as a quiet powerhouse in Perth's evolving short-stay scene. This boutique operation isn't chasing the frenzy of high-volume listings; instead, it's crafting intimate, high-end escapes that blend seamless comfort with local soul.
</p>
</div>
</section>
<!-- Stats Section -->
<section class="py-16 bg-gray-200">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<div class="text-center" data-aos="fade-up" data-aos-delay="100">
<div class="stat-number font-playfair text-gradient font-bold">8%</div>
<p class="text-gray-600 mt-2">Perth property market growth YTD</p>
</div>
<div class="text-center" data-aos="fade-up" data-aos-delay="200">
<div class="stat-number font-playfair text-gradient font-bold">4/5</div>
<p class="text-gray-600 mt-2">Consistent Tripadvisor rating</p>
</div>
<div class="text-center" data-aos="fade-up" data-aos-delay="300">
<div class="stat-number font-playfair text-gradient font-bold">20+</div>
<p class="text-gray-600 mt-2">Years of portfolio experience</p>
</div>
</div>
</div>
</section>
<!-- Leadership Section -->
<section id="team" class="py-20 px-4">
<div class="max-w-6xl mx-auto">
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16 font-playfair" data-aos="fade-up">The Visionaries Behind the Revolution</h2>
<!-- Mabel Lim -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-12 items-center mb-20" data-aos="fade-up">
<div class="relative">
<img src="https://external-content.duckduckgo.com/iu/?u=http%3A%2F%2Fcgresidential.com.au%2Fwp-content%2Fuploads%2F2015%2F11%2FMabelWeb-2-400x564.jpg&f=1&nofb=1&ipt=835b13c6154cd4cc32ded913ff048cda32e94bbde1e0e481c84e8d3175809b4d" alt="Mabel Lim" class="rounded-lg shadow-xl">
<div class="absolute -bottom-4 -right-4 bg-white p-4 rounded-lg shadow-lg">
<h3 class="font-playfair font-bold text-xl">Mabel Lim</h3>
<p class="text-gray-600">Founder & Visionary</p>
</div>
</div>
<div>
<p class="text-lg text-gray-700 mb-6">
At the helm is Mabel Lim, whose 34 years in retail and business have infused Manaa with a rare blend of global polish and local warmth. Relocating from Singapore nearly two decades ago, Mabel has woven her passion for riverside living into every detail.
</p>
<div class="border-l-4 gold-border pl-6">
<p class="quote-mark font-playfair">"</p>
<p class="text-xl italic text-gray-800">Elevate your stay</p>
<p class="text-sm text-gray-600 mt-2">— Mabel's guiding philosophy</p>
</div>
</div>
</div>
<!-- Team Photo -->
<div class="mb-16" data-aos="fade-up">
<h3 class="text-2xl font-playfair font-bold text-center mb-8">The Manaa Living Team</h3>
<img src="https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fwww.mkgpartners.com.au%2Fwp-content%2Fuploads%2F2023%2F02%2FDonelle-Callum-Tyler-Mabel-Lim-Cyril-Lee.jpg&f=1&nofb=1&ipt=a58a7debe1eeb4d27d913770a3783e83bc5af93e4cb3beb8eafc6c73430da625" alt="Manaa Living Team: Donelle, Callum, Tyler, Mabel Lim, Cyril Lee" class="w-full rounded-lg shadow-xl">
</div>
<!-- Team Grid -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<!-- Alan Ong -->
<div class="glass-card p-8" data-aos="fade-up" data-aos-delay="100">
<h3 class="font-playfair font-bold text-2xl text-gray-800 mb-3">Alan Ong</h3>
<p class="text-gray-600 mb-6 font-medium">Finance & Engineering Expert</p>
<p class="text-gray-700 leading-relaxed">Bringing precision to sales and leases, ensuring every deal aligns with investor dreams of passive income.</p>
</div>
<!-- Cyril Lee -->
<div class="glass-card p-8" data-aos="fade-up" data-aos-delay="200">
<h3 class="font-playfair font-bold text-2xl text-gray-800 mb-3">Cyril Lee</h3>
<p class="text-gray-600 mb-6 font-medium">Property Management</p>
<p class="text-gray-700 leading-relaxed">The steady force handling seamless transitions that keep Manaa's portfolio humming without a hitch.</p>
</div>
</div>
</div>
</section>
<!-- Properties Showcase -->
<section id="properties" class="py-20 bg-gray-900 text-white">
<div class="max-w-6xl mx-auto px-4">
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16 font-playfair" data-aos="fade-up">Forbes Residences: Australian Elegance Redefined</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 items-center" data-aos="fade-up">
<div>
<img src="https://images.unsplash.com/photo-1600585154340-be6161a56a0c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80" alt="Forbes Residences" class="rounded-lg shadow-xl">
</div>
<div>
<p class="text-lg mb-6">
Partnerships like the $90M Forbes Residences joint venture with architects WOHA and designer Andrea Savage infuse Manaa's properties with raw Australian elegance—think balconies overlooking the river, where every element whispers "home away from home."
</p>
<div class="grid grid-cols-2 gap-4 mt-8">
<div>
<div class="text-2xl font-bold text-gradient">$90M</div>
<p class="text-sm text-gray-300">Joint Venture</p>
</div>
<div>
<div class="text-2xl font-bold text-gradient">2.34%</div>
<p class="text-sm text-gray-300">Yield Returns</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Market Insights -->
<section id="insights" class="py-20 px-4 bg-white">
<div class="max-w-4xl mx-auto">
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16 font-playfair" data-aos="fade-up">Perth's Luxury Landscape</h2>
<div class="glass-card p-8" data-aos="fade-up">
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<h3 class="font-bold text-lg mb-4">Market Dynamics</h3>
<ul class="space-y-3 text-gray-700">
<li class="flex items-center">
<i data-feather="trending-up" class="w-5 h-5 mr-3 text-green-600"></i>
<span>8% year-to-date growth</span>
</li>
<li class="flex items-center">
<i data-feather="home" class="w-5 h-5 mr-3 text-blue-600"></i>
<span>$540k median unit price</span>
</li>
<li class="flex items-center">
<i data-feather="users" class="w-5 h-5 mr-3 text-purple-600"></i>
<span>74.7% target intimate groups</span>
</li>
</ul>
</div>
<div>
<h3 class="font-bold text-lg mb-4">Manaa's Edge</h3>
<ul class="space-y-3 text-gray-700">
<li class="flex items-center">
<i data-feather="zap" class="w-5 h-5 mr-3 text-yellow-600"></i>
<span>Quick staff responses</span>
</li>
<li class="flex items-center">
<i data-feather="heart" class="w-5 h-5 mr-3 text-red-600"></i>
<span>Thoughtful personalization</span>
</li>
<li class="flex items-center">
<i data-feather="refresh-cw" class="w-5 h-5 mr-3 text-indigo-600"></i>
<span>Pivot-ready operations</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<section id="features" class="py-20 bg-gradient-to-r from-gray-900 to-black text-white">
<div class="max-w-4xl mx-auto text-center px-4" data-aos="fade-up">
<div class="glass-card-dark p-12">
<h2 class="text-3xl md:text-4xl font-bold mb-6 font-playfair">Experience the Riverside Revolution</h2>
<p class="text-xl mb-8 opacity-90">
For insiders in the AI education space, Manaa Livings isn't just a team; it's a masterclass in boutique brilliance.
</p>
<div class="flex flex-col sm:flex-row justify-center space-y-4 sm:space-y-0 sm:space-x-6">
<a href="#properties" class="bg-gradient-to-r from-[#d4af37] to-[#b8860b] text-white px-8 py-3 rounded-md font-medium">
View Properties
</a>
<a href="#contact" class="border-2 border-white text-white px-8 py-3 rounded-md font-medium">
Contact Team
</a>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer id="contact" class="bg-gray-900 text-white py-12">
<div class="max-w-6xl mx-auto px-4">
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<div>
<h3 class="text-xl font-playfair font-bold mb-4">KTG</h3>
<p class="text-gray-300">Spotlighting excellence in luxury property management.</p>
</div>
<div>
<h4 class="font-bold mb-4">Connect</h4>
<div class="flex space-x-4">
<a href="#" class="text-gray-300 hover:text-white"><i data-feather="instagram"></i></a>
<a href="#" class="text-gray-300 hover:text-white"><i data-feather="linkedin"></i></a>
<a href="#" class="text-gray-300 hover:text-white"><i data-feather="twitter"></i></a>
</div>
</div>
<div>
<h4 class="font-bold mb-4">Contact</h4>
<p class="text-gray-300">Applecross, Perth WA</p>
<p class="text-gray-300">info@manaalivings.com</p>
</div>
</div>
<div class="border-t border-gray-700 mt-8 pt-8 text-center text-gray-400">
<p>&copy; 2025 Good AI Australia. All rights reserved.</p>
</div>
</div>
</footer>
<script>
AOS.init({
duration: 1000,
once: true
});
feather.replace();
</script>
</body>
</html>