<body id="ienk" class="bg-neutral-900 text-white">
<!--Navbar Section-->
<div id="iyhk" class="w-full lg:h-28 z-50">
<nav id="ircv" x-data="{ isOpen: false }" class="z-50 w-full p-6 fixed">
<div id="i2y3" class="container mx-auto flex w-full flex-col rounded-lg bg-gray-800 bg-opacity-80 p-2 backdrop-blur backdrop-filter lg:flex-row">
<div id="ie56" class="flex h-12 items-center">
<span id="il0c" class="text-2xl font-bold text-yellow-400 px-2">Royal Drive KL</span>
<div class="flex-grow lg:hidden">
</div>
<div id="ivng" x-on:click="isOpen = !isOpen" x-on:click.outside="isOpen = false" class="flex w-12 cursor-pointer items-center justify-center lg:hidden">
<span :class="!isOpen ? '' : 'hidden'"><i title="icon" id="ifyjl" class="fas text-white fa-bars">
</i></span>
<span :class="isOpen ? '' : 'hidden'"><i title="icon" id="i7o7k" class="fas text-white fa-times">
</i></span>
</div>
</div>
<div id="i1276" :class="isOpen ? '' : 'hidden'" class="flex-grow flex-col justify-end pt-4 lg:flex lg:flex-row lg:pt-0">
<a href="#fleet" class="-mx-2 flex h-12 items-center px-6 lg:mx-0 text-white hover:text-yellow-400">Our Fleet</a>
<a href="#services" class="-mx-2 flex h-12 items-center px-6 lg:mx-0 text-white hover:text-yellow-400">Services</a>
<a href="#about" class="-mx-2 flex h-12 items-center px-6 lg:mx-0 text-white hover:text-yellow-400">About</a>
<a href="#testimonials" class="-mx-2 flex h-12 items-center px-6 lg:mx-0 text-white hover:text-yellow-400">Testimonials</a>
<a href="#contact" class="mx-4 mb-4 mt-4 flex h-12 items-center justify-center rounded-lg bg-yellow-600 px-6 text-white hover:bg-yellow-700 lg:mb-0 lg:ml-4 lg:mr-0 lg:mt-0">Book Now</a>
</div>
</div>
</nav>
</div>
<!--Hero Section-->
<section id="i7rji" class="container mx-auto mb-16 overflow-hidden lg:rounded-lg relative">
<div id="ikusq7" class="absolute w-full h-full top-0 left-0">
<img id="ivr7nk" src="https://images.unsplash.com/photo-1536696459897-0fdfe270ab4b?q=80&w=3862&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" class="w-full h-full object-cover object-center"/>
</div>
<div id="i8raa" class="relative flex h-screen items-center justify-center px-6 py-60 lg:px-16 lg:aspect-video lg:h-auto">
<div id="ixemh" class="absolute mx-auto flex max-w-screen-lg flex-col items-center px-6 drop-shadow-md">
<p class="mb-2 text-center text-sm font-semibold text-white lg:text-lg">Welcome to Royal Drive KL
</p>
<h1 id="i0yve" class="mb-4 text-center text-4xl font-bold text-white lg:text-7xl">Experience Luxury on Wheels
</h1>
<h3 id="ivb8x" class="mb-6 text-center text-2xl font-semibold text-white lg:mb-8 lg:text-4xl">Malaysia's Premier Luxury Car Rental Service in the Heart of Kuala Lumpur
</h3>
<div id="idsag" class="flex w-full justify-center">
<a href="#fleet" class="flex h-14 w-full items-center justify-center rounded-lg bg-yellow-600 px-8 text-xl font-semibold text-white hover:bg-yellow-700 lg:max-w-max">View Our Fleet</a>
</div>
</div>
</div>
</section>
<!--Services Section-->
<section id="i1t1if" class="h-12">
</section>
<section id="ilolj" class="container mx-auto my-8 px-6 lg:my-16 lg:px-16">
<div class="mb-4 grid grid-cols-1 lg:mx-24 lg:mb-8">
<div class="col-span-1">
</div>
<div>
<h1 class="mb-2 text-3xl font-bold capitalize lg:mb-4 lg:text-6xl">Exceptional Service, Unmatched Luxury
</h1>
</div>
<div class="flex items-center">
<p class="w-full text-left text-xl text-gray-300 lg:text-2xl">Discover our comprehensive range of premium services designed to exceed your expectations.
</p>
</div>
</div>
<div id="inouc" class="grid gap-8 lg:grid-cols-3">
<div id="idemh" class="flex flex-col rounded-lg border border-gray-700 p-4 bg-gray-800">
<div class="mb-8 flex h-16 w-16 items-center justify-center rounded-md bg-yellow-600 text-4xl text-white">
<i title="icon" class="fas fa-car">
</i>
</div>
<h4 id="ijbmr" class="mb-2 text-lg font-semibold">Premium Fleet
</h4>
<p class="text-lg text-gray-300">Choose from our curated collection of luxury vehicles including Mercedes-Benz, BMW, Rolls-Royce, and more.
</p>
</div>
<div class="flex flex-col rounded-lg border border-gray-700 p-4 bg-gray-800">
<div class="mb-8 flex h-16 w-16 items-center justify-center rounded-md bg-yellow-600 text-4xl text-white">
<i title="icon" class="fas fa-concierge-bell">
</i>
</div>
<h4 class="mb-2 text-lg font-semibold">Chauffeur Service
</h4>
<p class="text-lg text-gray-300">Professional, experienced chauffeurs available 24/7 for airport transfers, events, or city tours.
</p>
</div>
<div class="flex flex-col rounded-lg border border-gray-700 p-4 bg-gray-800">
<div class="mb-8 flex h-16 w-16 items-center justify-center rounded-md bg-yellow-600 text-4xl text-white">
<i title="icon" class="fas fa-shield-alt">
</i>
</div>
<h4 class="mb-2 text-lg font-semibold">Full Insurance
</h4>
<p class="text-lg text-gray-300">Comprehensive insurance coverage for peace of mind during your luxury driving experience.
</p>
</div>
</div>
</section>
<!--Featured Cars Section-->
<section id="i7cvn" class="container mx-auto my-8 px-6 lg:my-16 lg:px-16">
<div class="text-center">
<div class="headline mx-auto mb-8 max-w-full lg:max-w-3xl">
<div class="mx-auto mb-2 w-max rounded-lg bg-yellow-600 px-2 py-1 lg:mb-4">
<p class="text-sm font-bold uppercase text-white">Featured Fleet
</p>
</div>
<h2 class="mb-4 text-3xl font-bold capitalize lg:text-6xl">Our Prestigious Collection
</h2>
<h6 class="text-base lg:text-lg text-gray-300">Experience the epitome of automotive excellence with our handpicked selection of luxury vehicles.
</h6>
</div>
<!--Vehicle Categories-->
<div class="mb-8 flex flex-wrap justify-center gap-4">
<button type="button" class="rounded-full bg-yellow-600 px-6 py-2 text-white hover:bg-yellow-700">All Vehicles</button>
<button type="button" class="rounded-full bg-gray-700 px-6 py-2 text-white hover:bg-yellow-600">Sports Cars</button>
<button type="button" class="rounded-full bg-gray-700 px-6 py-2 text-white hover:bg-yellow-600">Luxury Sedans</button>
<button type="button" class="rounded-full bg-gray-700 px-6 py-2 text-white hover:bg-yellow-600">SUVs</button>
</div>
<!--Featured Cars Grid-->
<div id="iaildq" class="grid gap-8 lg:grid-cols-3">
<!--Rolls-Royce Ghost-->
<div class="group flex flex-col justify-between overflow-hidden rounded-lg border border-gray-700 bg-gray-800">
<img id="inu3m" alt="Rolls-Royce Ghost" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQa5qcu2x3GgYTISTg17vr3DktTcXEx96M6Fg&s" class="w-full object-cover transition duration-300 group-hover:scale-110 aspect-video"/>
<div class="flex h-full flex-col justify-between p-4 text-left lg:p-6">
<div>
<div class="mb-2 text-sm font-semibold text-yellow-400">Luxury Sedan
</div>
<h3 class="mb-2 text-xl font-bold lg:text-2xl">Rolls-Royce Ghost
</h3>
<div class="mb-4 grid grid-cols-2 gap-4">
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-user">
</i>
<span>4 Passengers</span>
</div>
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-suitcase">
</i>
<span>4 Luggages</span>
</div>
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-cog">
</i>
<span>Automatic</span>
</div>
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-snowflake">
</i>
<span>A/C</span>
</div>
</div>
</div>
<div class="border-t border-gray-700 pt-4">
<div class="mb-4 flex items-end justify-between">
<div>
<p class="text-sm text-gray-400">Starting from
</p>
<p class="text-2xl font-bold text-yellow-400">RM 4,800
<span class="text-sm font-normal text-gray-400">/day</span>
</p>
</div>
<a href="#contact" class="rounded-lg bg-yellow-600 px-6 py-2 text-white hover:bg-yellow-700">Rent Now</a>
</div>
</div>
</div>
</div>
<!--Porsche 911 GT3-->
<div class="group flex flex-col justify-between overflow-hidden rounded-lg border border-gray-700 bg-gray-800">
<img id="iip3g4" alt="Porsche 911 GT3" src="https://www.porschesugarland.com/static/dealer-24499/2025-GT3-research/2025-911-GT3-with-touring-package-front.webp" class="w-full object-cover transition duration-300 group-hover:scale-110 aspect-video"/>
<div class="flex h-full flex-col justify-between p-4 text-left lg:p-6">
<div>
<div class="mb-2 text-sm font-semibold text-yellow-400">Sports Car
</div>
<h3 id="ibu2rf" class="mb-2 text-xl font-bold lg:text-2xl">Porsche 911 GT3
</h3>
<div class="mb-4 grid grid-cols-2 gap-4">
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-user">
</i>
<span>2 Passengers</span>
</div>
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-suitcase">
</i>
<span>2 Luggages</span>
</div>
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-cog">
</i>
<span>PDK</span>
</div>
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-tachometer-alt">
</i>
<span>502 HP</span>
</div>
</div>
</div>
<div class="border-t border-gray-700 pt-4">
<div class="mb-4 flex items-end justify-between">
<div>
<p class="text-sm text-gray-400">Starting from
</p>
<p class="text-2xl font-bold text-yellow-400">RM 3,800
<span class="text-sm font-normal text-gray-400">/day</span>
</p>
</div>
<a href="#contact" class="rounded-lg bg-yellow-600 px-6 py-2 text-white hover:bg-yellow-700">Rent Now</a>
</div>
</div>
</div>
</div>
<!--Range Rover Autobiography-->
<div class="group flex flex-col justify-between overflow-hidden rounded-lg border border-gray-700 bg-gray-800">
<img id="i6n7xp" alt="Range Rover Autobiography" src="https://media.cdn-jaguarlandrover.com/api/v2/images/104463/w/640.jpg" class="w-full object-cover transition duration-300 group-hover:scale-110 aspect-video"/>
<div class="flex h-full flex-col justify-between p-4 text-left lg:p-6">
<div>
<div class="mb-2 text-sm font-semibold text-yellow-400">Luxury SUV
</div>
<h3 id="i4i1k8" class="mb-2 text-xl font-bold lg:text-2xl">Range Rover Autobiography
</h3>
<div class="mb-4 grid grid-cols-2 gap-4">
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-user">
</i>
<span>5 Passengers</span>
</div>
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-suitcase">
</i>
<span>5 Luggages</span>
</div>
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-cog">
</i>
<span>Automatic</span>
</div>
<div class="flex items-center gap-2 text-gray-300">
<i title="icon" class="fas text-yellow-400 fa-mountain">
</i>
<span>4WD</span>
</div>
</div>
</div>
<div class="border-t border-gray-700 pt-4">
<div class="mb-4 flex items-end justify-between">
<div>
<p class="text-sm text-gray-400">Starting from
</p>
<p class="text-2xl font-bold text-yellow-400">RM 2,800
<span class="text-sm font-normal text-gray-400">/day</span>
</p>
</div>
<a href="#contact" class="rounded-lg bg-yellow-600 px-6 py-2 text-white hover:bg-yellow-700">Rent Now</a>
</div>
</div>
</div>
</div>
</div>
<!--View All Button-->
<div class="mt-12 flex justify-center">
<a href="#fleet" class="flex items-center gap-2 text-xl font-semibold text-yellow-400 hover:gap-4">View Complete Fleet<i title="icon" class="fas fa-arrow-right">
</i></a>
</div>
</div>
</section>
<!--Why Choose Us Section-->
<section id="is199a" class="h-12">
</section>
<section id="ijgcg1" class="bg-gradient-to-br from-amber-400 to-yellow-600 text-white">
<div id="i49a26" class="container mx-auto px-6 py-24 lg:px-16 drop-shadow-lg">
<div class="mb-8 grid grid-cols-1 lg:mx-24 lg:mb-16 lg:grid-cols-2">
<div class="lg:col-span-2">
<div class="mb-2 max-w-max rounded-md bg-white px-2 font-bold text-yellow-600 lg:mb-4">Why Choose Us
</div>
</div>
<div>
<h1 class="mb-2 text-2xl font-bold capitalize lg:mb-0 lg:text-6xl">The Royal Drive Difference
</h1>
</div>
<div class="flex items-center">
<p class="w-full text-left text-base text-white lg:text-right lg:text-2xl">Setting new standards in luxury car rental services
</p>
</div>
</div>
<div class="grid lg:grid-cols-3">
<!--Left column features-->
<div class="order-2 grid h-full gap-6 pb-6 lg:order-1 lg:grid-rows-2 lg:pb-0 lg:pt-32 lg:text-right">
<div class="flex">
<div class="bg-prime flex aspect-square h-16 w-16 items-center justify-center rounded-full bg-white text-3xl text-yellow-600 shadow lg:order-2">
<i title="icon" class="fas fa-check-circle">
</i>
</div>
<div class="px-6 lg:order-1">
<h1 class="text-2xl font-bold">Elite Fleet Selection
</h1>
<p class="mt-2">Meticulously maintained collection of latest luxury vehicles from prestigious brands
</p>
</div>
</div>
<div class="flex">
<div class="bg-prime flex aspect-square h-16 w-16 items-center justify-center rounded-full bg-white text-3xl text-yellow-600 shadow lg:order-2">
<i title="icon" class="fas fa-headset">
</i>
</div>
<div class="px-6 lg:order-1">
<h1 class="text-2xl font-bold">24/7 Concierge Support
</h1>
<p class="mt-2">Dedicated luxury car specialists available round-the-clock for personalized assistance
</p>
</div>
</div>
</div>
<!--Center image-->
<div class="order-1 mb-12 px-12 lg:order-2 lg:mb-0">
<div class="relative w-full overflow-hidden">
<img id="i35h9l" alt="Luxury Car Experience" src="https://i.pinimg.com/originals/ab/ec/9b/abec9b612415394fd19a2f3a23a2fbd7.png" class="w-full"/>
</div>
</div>
<!--Right column features-->
<div class="order-3 grid h-full gap-6 lg:grid-rows-2 lg:pt-32">
<div class="flex">
<div class="bg-prime flex aspect-square h-16 w-16 items-center justify-center rounded-full bg-white text-3xl text-yellow-600 shadow">
<i title="icon" class="fas fa-map-marked-alt">
</i>
</div>
<div class="px-6">
<h1 class="text-2xl font-bold">Door-to-Door Service
</h1>
<p class="mt-2">Complimentary delivery and pickup anywhere in Kuala Lumpur
</p>
</div>
</div>
<div class="flex">
<div class="bg-prime flex aspect-square h-16 w-16 items-center justify-center rounded-full bg-white text-3xl text-yellow-600 shadow">
<i title="icon" class="fas fa-award">
</i>
</div>
<div class="px-6">
<h1 class="text-2xl font-bold">Premium Insurance
</h1>
<p class="mt-2">Comprehensive coverage with zero excess for worry-free luxury driving
</p>
</div>
</div>
</div>
</div>
<!--Additional features row-->
<div id="ilpcyi" class="mt-16 grid gap-8 lg:grid-cols-3">
<div class="rounded-lg bg-yellow-700 p-6">
<div class="mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-white text-xl text-yellow-600">
<i title="icon" class="fas fa-clock">
</i>
</div>
<h4 class="mb-2 text-lg font-bold">Flexible Rental Terms
</h4>
<p>From 24-hour rentals to long-term leases, tailored to your schedule
</p>
</div>
<div class="rounded-lg bg-yellow-700 p-6">
<div class="mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-white text-xl text-yellow-600">
<i title="icon" class="fas fa-user-tie">
</i>
</div>
<h4 class="mb-2 text-lg font-bold">Professional Chauffeurs
</h4>
<p>Highly trained, multilingual drivers with extensive local knowledge
</p>
</div>
<div class="rounded-lg bg-yellow-700 p-6">
<div class="mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-white text-xl text-yellow-600">
<i title="icon" class="fas fa-shield-alt">
</i>
</div>
<h4 class="mb-2 text-lg font-bold">Privacy Guaranteed
</h4>
<p>Discrete service ensuring confidentiality for our distinguished clients
</p>
</div>
</div>
</div>
</section>
<!--Testimonials Section-->
<section id="itaczf" class="h-12">
</section>
<section id="i8l1vs" class="px-6 lg:px-16 my-8 lg:my-16 container mx-auto">
<div class="grid grid-cols-1 mb-4 lg:mb-8 mx-0 lg:mx-24">
<div class="col-span-1">
<div id="ipaluw" class="border-2 rounded-md border-yellow-500 text-yellow-500 px-2 max-w-max font-bold mb-2 lg:mb-4">Testimonials
</div>
</div>
<div>
<h1 class="text-2xl lg:text-6xl capitalize font-bold mb-2 lg:mb-4">What Our Clients Say
</h1>
</div>
<div class="flex items-center">
<p class="text-base lg:text-2xl font-semibold w-full opacity-70">Hear from our distinguished clients about their luxury rental experience with Royal Drive KL
</p>
</div>
</div>
<!--Featured Testimonial-->
<div id="ihclg8" class="mb-12 relative overflow-hidden rounded-lg bg-gray-800 p-8 lg:p-12">
<div class="absolute top-4 right-4 text-6xl text-yellow-200">
<i title="icon" id="iruja9" class="fas fa-quote-right">
</i>
</div>
<div class="relative z-10">
<p class="text-xl lg:text-2xl italic mb-6">"Royal Drive KL exceeded all expectations. From the immaculate condition of their Rolls-Royce to the professional chauffeur service, every detail was perfection. Their concierge team went above and beyond to accommodate my schedule changes. Truly a world-class luxury car rental service."
</p>
<div class="flex items-center">
<div class="w-16 h-16 rounded-full overflow-hidden mr-4">
<img id="ig0u6a" alt="Client" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/3femp9ar3C77TcJISp6tdn6BKBYmNAF0iODUkScs.jpg" class="w-full h-full object-cover"/>
</div>
<div>
<h4 class="font-bold text-lg">Dato' Michael Tan
</h4>
<p class="text-gray-400">CEO, Asia Pacific Ventures
</p>
</div>
</div>
</div>
</div>
<!--Testimonial Grid-->
<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
<!--Testimonial 1-->
<div class="border border-gray-700 rounded-lg p-6 hover:border-yellow-600 transition-all bg-gray-800">
<div class="flex items-center mb-4">
<div class="text-yellow-400">
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
</div>
<div class="flex-grow">
</div>
<div class="text-yellow-400 text-xl">
<i title="icon" class="fas fa-quote-right">
</i>
</div>
</div>
<p class="text-lg mb-6">"The Range Rover Autobiography was perfect for our family trip to Genting. Impeccably clean and well-maintained. The child seats provided were top quality, showing their attention to detail."
</p>
<div class="flex items-center">
<div class="w-12 h-12 rounded-full overflow-hidden mr-3">
<img id="ias8yg" alt="Client" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/3femp9ar3C77TcJISp6tdn6BKBYmNAF0iODUkScs.jpg" class="w-full h-full object-cover"/>
</div>
<div>
<h4 class="font-bold">Sarah Wong
</h4>
<p class="text-sm text-gray-400">Interior Designer
</p>
</div>
</div>
</div>
<!--Testimonial 2-->
<div class="border border-gray-700 rounded-lg p-6 hover:border-yellow-600 transition-all bg-gray-800">
<div class="flex items-center mb-4">
<div class="text-yellow-400">
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
</div>
<div class="flex-grow">
</div>
<div class="text-yellow-400 text-xl">
<i title="icon" class="fas fa-quote-right">
</i>
</div>
</div>
<p class="text-lg mb-6">"Rented the Porsche 911 GT3 for a weekend drive to Penang. The car was in pristine condition, and the pickup/return process was seamless. Their passion for cars really shows."
</p>
<div class="flex items-center">
<div class="w-12 h-12 rounded-full overflow-hidden mr-3">
<img id="ipriye" alt="Client" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/3femp9ar3C77TcJISp6tdn6BKBYmNAF0iODUkScs.jpg" class="w-full h-full object-cover"/>
</div>
<div>
<h4 class="font-bold">Dr. Ahmad Rahman
</h4>
<p class="text-sm text-gray-400">Car Enthusiast
</p>
</div>
</div>
</div>
<!--Testimonial 3-->
<div class="border border-gray-700 rounded-lg p-6 hover:border-yellow-600 transition-all bg-gray-800">
<div class="flex items-center mb-4">
<div class="text-yellow-400">
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
<i title="icon" class="fas fa-star">
</i>
</div>
<div class="flex-grow">
</div>
<div class="text-yellow-400 text-xl">
<i title="icon" class="fas fa-quote-right">
</i>
</div>
</div>
<p class="text-lg mb-6">"Used their chauffeur service with the Mercedes S-Class for a business delegation. The driver was professional and punctual. The entire experience reflected well on our company."
</p>
<div class="flex items-center">
<div class="w-12 h-12 rounded-full overflow-hidden mr-3">
<img id="ibx1y9" alt="Client" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/3femp9ar3C77TcJISp6tdn6BKBYmNAF0iODUkScs.jpg" class="w-full h-full object-cover"/>
</div>
<div>
<h4 class="font-bold">Jennifer Lim
</h4>
<p class="text-sm text-gray-400">Corporate Events Director
</p>
</div>
</div>
</div>
</div>
<!--Trust Indicators-->
<div id="igsfp5" class="mt-16 grid grid-cols-2 lg:grid-cols-4 gap-8 text-center">
<div>
<div class="text-4xl font-bold text-yellow-400 mb-2">500+
</div>
<p id="i2xbu4" class="text-gray-400">Satisfied Clients
</p>
</div>
<div>
<div class="text-4xl font-bold text-yellow-400 mb-2">100%
</div>
<p id="iavskl" class="text-gray-400">Luxury Vehicles
</p>
</div>
<div>
<div class="text-4xl font-bold text-yellow-400 mb-2">24/7
</div>
<p class="text-gray-400">Customer Support
</p>
</div>
<div>
<div class="text-4xl font-bold text-yellow-400 mb-2">4.9/5
</div>
<p class="text-gray-400">Customer Rating
</p>
</div>
</div>
</section>
<!--CTA Section-->
<section id="io9kwj" class="h-12">
</section>
<section id="i2dyfb" class="container mx-auto my-8 px-6 lg:my-16 lg:px-16">
<div id="iziysl" class="relative grid grid-cols-1 gap-4 overflow-hidden rounded-lg p-4 lg:grid-cols-3 lg:px-16 lg:py-12 bg-yellow-600 drop-shadow-lg">
<div class="col-span-1 flex flex-col justify-center lg:col-span-2">
<h1 class="mb-2 text-2xl font-semibold capitalize text-white lg:text-6xl lg:font-bold">Ready to Experience Luxury?
</h1>
<p class="mb-4 w-full text-base font-semibold text-white opacity-70 lg:mb-8 lg:text-2xl">Contact us now to book your perfect luxury vehicle
</p>
<div class="mb-4 flex lg:mb-8">
<div class="relative mr-4 h-12 w-12 overflow-hidden rounded-full bg-gray-200">
<img id="i9u4f4" src="https://assets.senangwebs.com/websites/1e14731a-1555-4170-9257-5276fce105b1/images/3femp9ar3C77TcJISp6tdn6BKBYmNAF0iODUkScs.jpg" class="absolute left-0 top-0 w-12"/>
</div>
<div class="flex flex-col justify-center font-semibold text-white">
<p class="text-sm">24/7 Support
</p>
<p class="text-xs">Luxury Car Specialists
</p>
</div>
</div>
<a href="#contact" class="flex items-center justify-center rounded-lg bg-white px-8 py-3 text-center font-semibold text-yellow-600 lg:max-w-max lg:text-lg">Book Now</a>
</div>
</div>
</section>
<!--Footer-->
<section id="iztmqh" class="h-12">
</section>
<footer id="ij4c8i" class="container mx-auto grid gap-8 px-6 lg:grid-cols-4 lg:gap-16 lg:px-16">
<div class="flex flex-col gap-2">
<div class="h-12 max-w-max">
<span id="ib9mjb" class="text-2xl font-bold text-yellow-400">Royal Drive KL</span>
</div>
<p class="max-w-sm text-sm text-gray-300">Your premier destination for luxury car rentals in Kuala Lumpur
</p>
</div>
<div class="flex flex-col gap-2">
<h4 class="text-lg font-semibold">Quick Links
</h4>
<a href="#fleet" class="text-sm text-gray-300 hover:text-yellow-400">Our Fleet</a>
<a href="#services" class="text-sm text-gray-300 hover:text-yellow-400">Services</a>
<a href="#about" class="text-sm text-gray-300 hover:text-yellow-400">About Us</a>
<a href="#testimonials" class="text-sm text-gray-300 hover:text-yellow-400">Testimonials</a>
</div>
<div class="flex flex-col gap-2">
<h4 class="text-lg font-semibold">Contact Us
</h4>
<div>
<p class="font-semibold text-yellow-400">Royal Drive KL
</p>
<p class="text-xs text-gray-300">Luxury Car Rentals
</p>
</div>
<p class="text-sm text-gray-300">[email protected]
</p>
<p class="text-sm text-gray-300">Kuala Lumpur, Malaysia
</p>
</div>
<div class="flex flex-col gap-2">
<h4 class="text-lg font-semibold">Follow Us
</h4>
<div class="flex gap-4">
<a href="#" class="text-sm text-gray-300 hover:text-yellow-400"><i title="icon" class="fab fa-instagram">
</i></a>
<a href="#" class="text-sm text-gray-300 hover:text-yellow-400"><i title="icon" class="fab fa-facebook">
</i></a>
<a href="#" class="text-sm text-gray-300 hover:text-yellow-400"><i title="icon" class="fab fa-whatsapp">
</i></a>
</div>
</div>
</footer>
<footer id="i43csy" class="flex flex-col lg:flex-row container mx-auto pt-4 px-6 lg:px-16 mb-16">
<div class="flex justify-center">
<a href="#" class="bg-gray-700 rounded-md flex items-center justify-center w-8 h-8 text-gray-300 text-sm mr-2 hover:bg-yellow-600"><i title="icon" class="fab fa-google">
</i></a>
<a href="#" class="bg-gray-700 rounded-md flex items-center justify-center w-8 h-8 text-gray-300 text-sm mr-2 hover:bg-yellow-600"><i title="icon" class="fab fa-linkedin">
</i></a>
<a href="#" class="bg-gray-700 rounded-md flex items-center justify-center w-8 h-8 text-gray-300 text-sm mr-2 hover:bg-yellow-600"><i title="icon" class="fab fa-twitter">
</i></a>
<a href="#" class="bg-gray-700 rounded-md flex items-center justify-center w-8 h-8 text-gray-300 text-sm mr-2 hover:bg-yellow-600"><i title="icon" class="fab fa-facebook">
</i></a>
</div>
<div id="ilfesl" class="flex-grow h-8 flex items-center justify-center lg:justify-end font-semibold text-gray-300">2025 © Royal Drive KL
</div>
<div class="flex justify-center">
<a href="#" class="flex items-center justify-center w-8 h-8 text-sm lg:ml-4 bg-yellow-600 text-white rounded-md hover:bg-yellow-700"><i title="icon" class="fas fa-arrow-up">
</i></a>
</div>
</footer>
</body>Welcome to SenangStart Template Preview! 🎉 Visit our homepage for a deeper dive into our offerings, or you can edit this template with drag-n-drop website builder.
Edit Template