<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Welcome to SPK Penerimaan Karyawan</title>
        <!-- Fonts -->
        <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
        <!-- Bootstrap CSS -->
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
        <style>
            body {
                font-family: 'Poppins', sans-serif;
                margin: 0;
                padding: 0;
                background: linear-gradient(135deg, #0070b7, #008fea);
                min-height: 100vh;
                color: #fff;
            }
            .navbar {
                background: rgba(255, 255, 255, 0.1);
                backdrop-filter: blur(10px);
                padding: 1rem 2rem;
            }

            .navbar .logo-img {
                max-width: 50px; /* Ukuran logo diperkecil */
                height: auto;
                margin-right: 1rem;
            }

            .navbar .brand-text {
                font-size: 2rem;
                font-weight: 700;
                color: #fff;
                margin: 0;
            }
            .navbar .nav-link {
                color: #fff !important;
                margin-left: 1.5rem;
                font-weight: 500;
                font-size: 1rem;
            }
            .navbar .nav-link:hover {
                color: #ddd !important;
            }
            .hero-section {
                position: relative;
                min-height: 80vh;
                display: flex;
                align-items: center;
                justify-content: center;
                text-align: center;
                padding: 4rem 0;
                overflow: hidden;
            }
            .hero-section .wave {
                position: absolute;
                bottom: 0;
                left: 0;
                width: 100%;
                height: 100px;
                background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNDQwIDEzMCI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE0NDAgNTFjLTQxLjYgMjkuNy0xMDQuMyA1NC43LTE2OC41IDU0LjctNjQuMiAwLTEyNi45LTI1LTE2OC41LTU0LjctNDEuNi0yOS43LTExNi4yLTU0LjctMTgwLjUtNTQuNy0xNjcuOCAwLTI3MC45IDQyLjItMzQwLjUgNzYuN3MtMTcyLjcgNzYuNy0zNDAuNSA3Ni43Yy02Ny42IDAtMTM4LjktMjcuMS0xODAuNS01NC43UzAgMjkuNyAwIDBjMCAwIDAgMCAwIDB2MTMwaDE0NDB6IiBvcGFjaXR5PSIuMSI+PC9wYXRoPjwvc3ZnPg==') repeat-x;
                background-size: 100% 100%;
            }
            .hero-content h1 {
                font-size: 3rem;
                font-weight: 700;
                margin-bottom: 1rem;
            }
            .hero-content p {
                font-size: 1.2rem;
                color: #ddd;
                max-width: 600px;
                margin: 0 auto 2rem;
            }
            .hero-img {
                max-width: 50%;
                height: auto;
                margin-top: 2rem;
            }
            .btn-custom {
                padding: 10px 30px;
                border-radius: 30px;
                font-weight: 500;
                text-transform: uppercase;
                letter-spacing: 1px;
                margin: 0 10px;
                border: none;
            }
            .btn-login {
                background-color: #00b747;
                color: white;
            }
            .btn-register {
                background-color: #a6a6a6;
                color: white;
            }
            .btn-login:hover, .btn-register:hover {
                opacity: 0.9;
                color: white;
            }
            .services-section {
                padding: 5rem 0;
                background-color: #fff;
                color: #333;
                text-align: center;
            }
            .services-section h2 {
                font-weight: 600;
                margin-bottom: 3rem;
            }
            .service-card {
                background:rgb(234, 236, 237);
                padding: 2rem;
                border-radius: 10px;
                margin-bottom: 2rem;
                transition: transform 0.3s;
            }
            .service-card:hover {
                transform: translateY(-10px);
            }
            .service-card i {
                font-size: 2rem;
                color: #0070B7;
                margin-bottom: 1rem;
            }
            footer {
                background: rgba(0, 0, 0, 0.2);
                padding: 2rem 0;
                text-align: center;
                color: #fff;
            }
        </style>
    </head>
    <body>
        <!-- Navbar -->
        <nav class="navbar navbar-expand-lg">
            <div class="container">
            <img src="{{ asset('assets/images/logo.png') }}" alt= "Intecon Logo" class="logo-img">
                <a class="navbar-brand text-white" href="#">SIPKAR</a>
                <div class="collapse navbar-collapse">
                   <!-- <ul class="navbar-nav ms-auto">
                        <li class="nav-item"><a class="nav-link" href="#">Home</a></li>
                        <li class="nav-item"><a class="nav-link" href="#">About</a></li>
                        <li class="nav-item"><a class="nav-link" href="#">Contact</a></li>
                    </ul> -->
                </div>
            </div>
        </nav>

        <!-- Hero Section -->
        <div class="hero-section">
            <div class="container hero-content">
                
                <h1>Welcome to SIPKAR</h1>
                <p>Selamat Datang di Sistem Pendukung Keputusan Penerimaan Karyawan PT Intecon Bangun Persada</p>
                <div class="d-flex justify-content-center gap-3">
                    @if (Route::has('login'))
                       @auth
                            <!-- Dashboard button removed -->
                        @else
                            <a href="{{ route('login') }}" class="btn btn-custom btn-login">Login</a>
                            @if (Route::has('register.user'))
                                <a href="{{ route('register.user') }}" class="btn btn-custom btn-register">Register</a>
                            @endif
                        @endauth
                    @endif
                </div>
            </div>
            <div class="wave"></div>
        </div>

        <!-- Services Section -->
        <section class="services-section">
            <div class="container">
                <h2>Tentang PT Intecon Bangun Persada</h2>
                <div class="row">
                   
                    <div class="col-md-4">
                        <div class="service-card">
                            <i class="fas fa-eye"></i>
                            <h4>Visi</h4>
                            <p>Sebagai perusahaan Kontraktor Umum yang paling inovatif dan kompeten dalam memberikan pelayanan dan solusi atas keinginan
                                 dan permasalahan</p>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="service-card">
                            <i class="fas fa-building"></i>
                            <h4>Sejarah Perusahaan</h4>
                            <p>PT Intecon Bangun Persada (IBP), didirikan pada tahun 2016, adalah perusahaan konstruksi terkemuka 
                                yang berbasis di Jember, Jawa Timur, Indonesia. Berawal dari CV Integritas Karya Buana (IKB) pada tahun 2005 
                                sebagai pemasok bahan bangunan dan kemudian sebagai sub-kontraktor di bawah CV Long Fortune Construction, 
                                IBP mengkhususkan diri dalam konstruksi komersial dan residensial. Keahlian kami mencakup pekerjaan interior, 
                                teknik sipil, arsitektur, pengembangan properti, dan perencanaan desain, dengan fokus pada penyampaian proyek 
                                yang berkualitas, inovatif, dan memuaskan klien</p>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="service-card">
                            <i class="fas fa-bullseye"></i>
                            <h4>Misi</h4>
                            <p>Untuk menjadi penyedia jasa konstruksi yang unggul dengan konsisten meningkatkan kualitas produk kami, untuk menyediakan 
                                tingkat tertinggi profesionalisme bagi klien melalui inovasi</p>
                        </div>
                    </div>
                </div>
                <div class="contact-info mt-5">
                    <p><strong>Contact Us:</strong></p>
                    <p>Email: <a href="mailto:inteconbangunpersada@gmail.com">inteconbangunpersada@gmail.com</a></p>
                    <p>Phone: +62 331 423445</p>
                    <p>Alamat: Jl. Cadika No. 4A, Sempusari, Kaliwates, Jember, Jawa Timur, Indonesia</p>
                </div>
            </div>
        </section>

        <!-- Footer -->
        <footer>
            <div class="container">
                <p>© {{ date('Y') }} Intecon Bangun Persada.</p>
            </div>
        </footer>

        <!-- Bootstrap JS -->
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
        <!-- Font Awesome for icons -->
        <script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script>
    </body>
</html>