<?php
require_once __DIR__ . '/includes/functions.php';
$seo = getSeo('services');
$activeNav = 'services';
require __DIR__ . '/includes/header.php';
?>
<body data-page="services" class="antialiased text-gray-800">
<div id="service-detail-wrap">
<section id="service-banner" class="py-20 text-white">
<div class="max-w-7xl mx-auto px-5 lg:px-8">
<p class="text-sm text-white/70 mb-3"><a href="index.php" class="hover:text-white">Home</a> <i class="bi bi-chevron-right text-xs mx-1"></i> <a href="services.php" class="hover:text-white">Services</a> <i class="bi bi-chevron-right text-xs mx-1"></i> <span id="service-banner-title-crumb">Detail</span></p>
<h1 id="service-banner-title" class="font-heading text-4xl font-bold"></h1>
</div>
</section>
<section class="py-20 max-w-7xl mx-auto px-5 lg:px-8 grid lg:grid-cols-3 gap-14">
<div class="lg:col-span-2">
<h2 class="font-heading text-2xl font-bold mb-4">Overview</h2>
<p id="service-description" class="text-gray-600 leading-relaxed mb-10"></p>
<h2 class="font-heading text-2xl font-bold mb-5">Key Features</h2>
<ul id="service-features" class="space-y-3 mb-12"></ul>
<h2 class="font-heading text-2xl font-bold mb-5">Frequently Asked Questions</h2>
<div id="service-faq"></div>
<h2 class="font-heading text-2xl font-bold mt-14 mb-6">Related Services</h2>
<div id="related-services" class="grid sm:grid-cols-3 gap-5"></div>
</div>
<div>
<div class="soft-card p-7 sticky top-28">
<h3 id="service-inquiry-title" class="font-heading text-xl font-semibold mb-2">Inquire About This Service</h3>
<p class="text-sm text-gray-500 mb-6">Fill the form and our team will get back within 24 hours.</p>
<form action="contact.php" method="post" class="space-y-4">
<input type="hidden" name="csrf_token" value="<?= e(csrfToken()) ?>" />
<input type="text" name="name" required placeholder="Full Name" class="w-full px-4 py-3 rounded-lg border border-gray-200 focus:outline-none focus:ring-2 focus:ring-primary text-sm" />
<input type="tel" name="phone" required placeholder="Phone Number" class="w-full px-4 py-3 rounded-lg border border-gray-200 focus:outline-none focus:ring-2 focus:ring-primary text-sm" />
<input type="email" name="email" required placeholder="Email Address" class="w-full px-4 py-3 rounded-lg border border-gray-200 focus:outline-none focus:ring-2 focus:ring-primary text-sm" />
<input type="text" name="company_website" class="hidden" tabindex="-1" autocomplete="off" />
<textarea name="message" rows="4" placeholder="Tell us about your requirement" class="w-full px-4 py-3 rounded-lg border border-gray-200 focus:outline-none focus:ring-2 focus:ring-primary text-sm"></textarea>
<button class="btn-primary-brand w-full py-3 rounded-lg font-semibold">Submit Inquiry</button>
</form>
</div>
</div>
</section>
</div>
<?php $bridgeSections = ['site', 'services']; require __DIR__ . '/includes/footer.php'; ?>