@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])

@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])
    <div class="container-fluid py-4">
        <div class="row">
            <div class="col-md-12">
                <div class="row mx-1">
                    <div class="card mb-3 shadow-sm">
                        <div class="card-header px-4 px-md-5 py-5">
                            @include('components.alert')
                            <div class="text-center py-5">
                                <p class="text-muted mb-2 text-uppercase" style="letter-spacing: 1px; font-size: 0.875rem;">
                                    Dear Candidate,</p>
                                <h2 class="fw-bold mb-3">
                                    Welcome to PT Multi Spunindo Jaya Tbk
                                </h2>
                                <p class="text-muted fst-italic" style="font-size: 1.1rem;">
                                    "We believe in reliable operations & consistent quality"
                                </p>
                            </div>
                        </div>
                        <hr class="horizontal dark mt-0 mb-5">
                        <div class="card-body">

                            <div class="row align-items-center mb-5 pb-4">
                                <div class="col-lg-5 mb-4 mb-lg-0 text-center text-lg-start">
                                    <h1 class="fw-bold mb-3">
                                        Who<br class="d-none d-lg-block"> Are We?
                                    </h1>
                                    <div class="d-none d-lg-block">
                                        <div class="bg-gradient-primary"
                                            style="width: 60px; height: 4px; border-radius: 2px;"></div>
                                    </div>
                                </div>
                                <div class="col-lg-7">
                                    <div class="bg-gradient-primary text-white rounded-3 p-4 shadow-sm">
                                        <p class="mb-0 lh-lg text-justify">
                                            PT Multi Spunindo Jaya Tbk. is a leading nonwoven manufacturer in Indonesia,
                                            committed to innovation and quality excellence. Leveraging modern technology
                                            and implementing Total Quality Management (TQM) systems, we ensure every
                                            product
                                            meets the highest standards. Together with our collaborative professional
                                            team,
                                            we continuously create innovative solutions for a better future in the
                                            nonwoven
                                            industry.
                                        </p>
                                    </div>
                                </div>
                            </div>

                            <div class="mb-5 pb-4">
                                <div class="text-center mb-4">
                                    <h3 class="font-weight-bold mb-3">Our Vision</h3>
                                    <div class="d-flex justify-content-center">
                                        <div class="bg-gradient-primary"
                                            style="width: 80px; height: 3px; border-radius: 2px;"></div>
                                    </div>
                                </div>
                                <div class="row justify-content-center">
                                    <div class="col-lg-10">
                                        <div class="p-4 shadow-sm border-start border-primary border-4">
                                            <h5 class="text-center mb-0 font-weight-normal" style="line-height: 1.8;">
                                                To be the people's <b>daily-life solution</b> corporation
                                            </h5>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="row align-items-center">
                                <div class="col-lg-7 mb-4 mb-lg-0 order-2 order-lg-1">
                                    <div class="bg-gradient-primary text-white text-justify rounded-3 p-3 shadow-sm">
                                        <ul class="mb-0" style="list-style-type: disc;">
                                            <li>
                                                To provide the <b>right quality</b> and <b>eco-friendly</b> products for a
                                                superb customer experience
                                            </li>
                                            <li>
                                                To develop <b>human competencies</b> & <b>character</b> under good corporate
                                                governance
                                            </li>
                                            <li>
                                                To build a harmonious community that epitomizes <b>integrity</b>,
                                                <b>productivity</b>, <b>creativity</b> and <b>persistence</b> for a
                                                sustainable
                                                <b>legacy</b>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="col-lg-5 order-1 order-lg-2 mb-4 mb-lg-0">
                                    <div class="text-center text-lg-end ps-lg-4">
                                        <h2 class="font-weight-bold mb-3">
                                            Our Mission
                                        </h2>
                                        <div class="d-flex justify-content-center justify-content-lg-end mt-3">
                                            <div class="bg-gradient-primary"
                                                style="width: 60px; height: 4px; border-radius: 2px;"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>

                        <div class="card-footer bg-transparent border-0 pb-4">
                            <div class="d-flex justify-content-center">
                                <div class="bg-gradient-primary" style="width: 100px; height: 3px; border-radius: 2px;">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('js')
@endpush