<?php
require_once 'config/db.php';
session_start();

$settings_stmt = $pdo->query("SELECT website_name FROM settings WHERE id = 1");
$settings_res = $settings_stmt->fetch();
$site_name = $settings_res['website_name'] ?? 'CRS Delhi';

if (isset($_SESSION['user_id'])) {
    header("Location: admin/dashboard.php");
    exit();
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $site_name; ?> - Official Certificate Portal</title>
    <!-- Google Fonts -->
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <link rel="stylesheet" href="assets/css/style.css">
    <style>
        .hero-section {
            background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
            min-height: 90vh;
            display: flex;
            align-items: center;
            color: white;
            position: relative;
            overflow: hidden;
        }
        .hero-section::after {
            content: '';
            position: absolute;
            bottom: -50px;
            left: 0;
            right: 0;
            height: 100px;
            background: #f8fafc;
            transform: skewY(-2deg);
        }
        .feature-icon {
            width: 60px;
            height: 60px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 16px;
            margin-bottom: 20px;
            font-size: 1.5rem;
        }
        .nav-glass {
            background: rgba(255, 255, 255, 0.1);
            backdrop-filter: blur(10px);
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        }
    </style>
</head>
<body class="bg-light">

<!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-dark transparent py-3">
    <div class="container">
        <a class="navbar-brand fw-bold fs-3" href="#">
            <i class="fas fa-certificate text-warning me-2"></i><?php echo $site_name; ?>
        </a>
        <div class="ms-auto">
            <a href="login.php" class="btn btn-link text-white text-decoration-none fw-semibold px-4">Login</a>
            <a href="register.php" class="btn btn-light text-primary fw-bold rounded-pill px-4 shadow">Sign Up</a>
        </div>
    </div>
</nav>

<!-- Hero Section -->
<section class="hero-section">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-6 animate-fade-in">
                <span class="badge bg-white bg-opacity-25 text-white mb-3 px-3 py-2 rounded-pill">Digital India Initiative</span>
                <h1 class="display-3 fw-800 mb-4 lh-tight">
                    Smart & Secure <br>
                    <span class="text-warning">Certificates</span> 
                </h1>
                <p class="lead mb-5 opacity-75">
                    Generate, verify, and manage your official documents with government-grade security. Accessible anytime, anywhere.
                </p>
                <div class="d-flex gap-3 flex-wrap">
                    <a href="register.php" class="btn btn-light btn-lg px-5 py-3 rounded-pill fw-bold text-primary shadow">
                        Get Started <i class="fas fa-rocket ms-2"></i>
                    </a>
                    <a href="login.php" class="btn btn-outline-light btn-lg px-5 py-3 rounded-pill fw-bold">
                        Member Login
                    </a>
                </div>
            </div>
            <div class="col-lg-6 d-none d-lg-block animate-fade-in" style="animation-delay: 0.2s;">
                <img src="https://img.freepik.com/free-vector/digital-service-abstract-concept-illustration_335657-3720.jpg" alt="Hero" class="img-fluid rounded-4 shadow-lg">
            </div>
        </div>
    </div>
</section>

<!-- Features Section -->
<section class="py-5 mt-5">
    <div class="container py-5">
        <div class="text-center mb-5">
            <h6 class="text-primary fw-bold text-uppercase tracking-widest">Our Features</h6>
            <h2 class="display-5 fw-bold">Why Choose Our Portal?</h2>
        </div>
        <div class="row g-4 mt-4">
            <div class="col-md-4">
                <div class="glass-card p-5 h-100">
                    <div class="feature-icon bg-primary bg-opacity-10 text-primary">
                        <i class="fas fa-bolt"></i>
                    </div>
                    <h4 class="fw-bold">Instant Delivery</h4>
                    <p class="text-muted">Apply and download your certificates instantly. No more long queues at government offices.</p>
                </div>
            </div>
            <div class="col-md-4">
                <div class="glass-card p-5 h-100">
                    <div class="feature-icon bg-success bg-opacity-10 text-success">
                        <i class="fas fa-qrcode"></i>
                    </div>
                    <h4 class="fw-bold">QR Verification</h4>
                    <p class="text-muted">Every certificate comes with a secure QR code for instant authentication by any authority.</p>
                </div>
            </div>
            <div class="col-md-4">
                <div class="glass-card p-5 h-100">
                    <div class="feature-icon bg-info bg-opacity-10 text-info">
                        <i class="fas fa-shield-halved"></i>
                    </div>
                    <h4 class="fw-bold">Secure Wallet</h4>
                    <p class="text-muted">Manage your funds securely with our integrated wallet system. Pay as you go.</p>
                </div>
            </div>
        </div>
    </div>
</section>

<!-- Footer -->
<footer class="bg-dark text-white py-5">
    <div class="container text-center">
        <p class="mb-0 opacity-50">&copy; <?php echo date('Y'); ?> <?php echo $site_name; ?>. All Rights Reserved.</p>
    </div>
</footer>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
