<?php
session_start();
// Redirect ke dashboard jika sudah login
if (isset($_SESSION['user_id'])) {
    header("Location: dashboard.php");
    exit();
}
?>
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Buku Induk Siswa - Kurikulum Merdeka</title>
    <link href="assets/css/bootstrap.min.css" rel="stylesheet">
    <link href="assets/css/style.css" rel="stylesheet">
    <style>
        .hero-section {
            background: linear-gradient(rgba(0, 82, 212, 0.8), rgba(0, 82, 212, 0.8)), url('assets/img/school-bg.jpg') center/cover no-repeat;
            color: white;
            padding: 100px 0;
            text-align: center;
        }
        .feature-card {
            transition: transform 0.3s;
            border: none;
            border-radius: 10px;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
            height: 100%;
        }
        .feature-card:hover {
            transform: translateY(-5px);
        }
        .feature-icon {
            font-size: 3rem;
            color: #0052d4;
            margin-bottom: 1rem;
        }
        .btn-primary {
            background-color: #0052d4;
            border-color: #0052d4;
            padding: 10px 25px;
            border-radius: 5px;
            font-weight: 600;
        }
        .btn-primary:hover {
            background-color: #003d9e;
            border-color: #003d9e;
        }
        .btn-outline-primary {
            color: #0052d4;
            border-color: #0052d4;
            padding: 10px 25px;
            border-radius: 5px;
            font-weight: 600;
        }
        .btn-outline-primary:hover {
            background-color: #0052d4;
            color: white;
        }
        .navbar {
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        }
        footer {
            background-color: #f8f9fa;
            padding: 30px 0;
            margin-top: 50px;
        }
    </style>
</head>
<body>
    <!-- Navbar -->
    <nav class="navbar navbar-expand-lg navbar-light bg-white fixed-top">
        <div class="container">
            <a class="navbar-brand fw-bold text-primary" href="index.php">
                <img src="assets/img/logo.png" alt="Logo" width="40" height="40" class="d-inline-block align-text-top me-2">
                Buku Induk Siswa
            </a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav ms-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="#features">Fitur</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#about">Tentang</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#contact">Kontak</a>
                    </li>
                    <li class="nav-item ms-2">
                        <a class="btn btn-outline-primary" href="login.php">Login</a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>

    <!-- Hero Section -->
    <section class="hero-section mt-5">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-8">
                    <h1 class="display-4 fw-bold mb-4">Sistem Buku Induk Siswa Digital</h1>
                    <p class="lead mb-5">Mengelola data siswa dengan mudah dan efisien sesuai Kurikulum Merdeka. Solusi terintegrasi untuk administrasi sekolah modern.</p>
                    <a href="login.php" class="btn btn-light btn-lg me-3">Mulai Sekarang</a>
                    <a href="#features" class="btn btn-outline-light btn-lg">Pelajari Lebih Lanjut</a>
                </div>
            </div>
        </div>
    </section>

    <!-- Features Section -->
    <section id="features" class="py-5 bg-light">
        <div class="container py-5">
            <div class="row text-center mb-5">
                <div class="col-lg-8 mx-auto">
                    <h2 class="fw-bold">Fitur Unggulan Sistem</h2>
                    <p class="lead">Solusi lengkap untuk manajemen data siswa secara digital</p>
                </div>
            </div>
            <div class="row g-4">
                <div class="col-md-4">
                    <div class="card feature-card h-100 p-4">
                        <div class="feature-icon">📊</div>
                        <h4 class="mb-3">Manajemen Data Siswa</h4>
                        <p class="text-muted">Kelola data siswa secara lengkap mulai dari data pribadi, akademik, hingga perkembangan siswa.</p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card feature-card h-100 p-4">
                        <div class="feature-icon">📅</div>
                        <h4 class="mb-3">Multi-Tahun Ajaran</h4>
                        <p class="text-muted">Dukung pencatatan data siswa untuk beberapa tahun ajaran dalam satu sistem terintegrasi.</p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card feature-card h-100 p-4">
                        <div class="feature-icon">🔍</div>
                        <h4 class="mb-3">Pencarian & Filter</h4>
                        <p class="text-muted">Temukan data siswa dengan cepat menggunakan fitur pencarian dan filter yang canggih.</p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card feature-card h-100 p-4">
                        <div class="feature-icon">📝</div>
                        <h4 class="mb-3">Laporan & Export</h4>
                        <p class="text-muted">Cetak buku induk dan export data ke format PDF atau Excel dengan mudah.</p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card feature-card h-100 p-4">
                        <div class="feature-icon">🔄</div>
                        <h4 class="mb-3">Integrasi Sistem</h4>
                        <p class="text-muted">Terintegrasi dengan sistem lain seperti absensi, akademik, dan ekstrakurikuler.</p>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card feature-card h-100 p-4">
                        <div class="feature-icon">👥</div>
                        <h4 class="mb-3">Multi-user</h4>
                        <p class="text-muted">Dukungan untuk beberapa level pengguna (Admin, Wali Kelas, dan Siswa).</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- About Section -->
    <section id="about" class="py-5">
        <div class="container py-5">
            <div class="row align-items-center">
                <div class="col-lg-6">
                    <h2 class="fw-bold mb-4">Tentang Sistem Buku Induk Digital</h2>
                    <p class="lead mb-4">Sistem Buku Induk Siswa Digital dirancang khusus untuk memenuhi kebutuhan administrasi sekolah dalam era Kurikulum Merdeka.</p>
                    <p>Dengan sistem ini, sekolah dapat dengan mudah mengelola data siswa secara lengkap dan terintegrasi, mulai dari data pribadi, riwayat pendidikan, data orang tua, prestasi, hingga perkembangan siswa selama masa belajar.</p>
                    <p>Sistem ini tidak hanya memudahkan administrasi tetapi juga menjadi basis data utama untuk integrasi dengan aplikasi lain di sekolah.</p>
                </div>
                <div class="col-lg-6">
                    <img src="https://images.unsplash.com/photo-1523050854058-8df90110c9f1?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Sistem Administrasi Sekolah" class="img-fluid rounded shadow">
                </div>
            </div>
        </div>
    </section>

    <!-- Contact Section -->
    <section id="contact" class="py-5 bg-light">
        <div class="container py-5">
            <div class="row text-center mb-5">
                <div class="col-lg-8 mx-auto">
                    <h2 class="fw-bold">Hubungi Kami</h2>
                    <p class="lead">Butuh bantuan atau informasi lebih lanjut? Silakan hubungi kami</p>
                </div>
            </div>
            <div class="row justify-content-center">
                <div class="col-lg-6">
                    <div class="card p-4 shadow">
                        <form>
                            <div class="mb-3">
                                <label for="name" class="form-label">Nama Lengkap</label>
                                <input type="text" class="form-control" id="name" required>
                            </div>
                            <div class="mb-3">
                                <label for="email" class="form-label">Email</label>
                                <input type="email" class="form-control" id="email" required>
                            </div>
                            <div class="mb-3">
                                <label for="message" class="form-label">Pesan</label>
                                <textarea class="form-control" id="message" rows="4" required></textarea>
                            </div>
                            <button type="submit" class="btn btn-primary w-100">Kirim Pesan</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Footer -->
    <footer class="text-center">
        <div class="container">
            <p class="mb-0">Sistem Buku Induk Siswa - Kurikulum Merdeka &copy; <?php echo date('Y'); ?></p>
            <p class="text-muted">Dikembangkan untuk memudahkan administrasi sekolah</p>
        </div>
    </footer>

    <script src="assets/js/bootstrap.bundle.min.js"></script>
    <script>
        // Smooth scrolling untuk navigasi
        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
            anchor.addEventListener('click', function (e) {
                e.preventDefault();
                document.querySelector(this.getAttribute('href')).scrollIntoView({
                    behavior: 'smooth'
                });
            });
        });
    </script>
</body>
</html>