<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <title>E-Surat Desa</title>
    <meta name="description" content="">
    <meta name="keywords" content="">

    <!-- Favicons -->
    <link href="assets/img/logo.png" rel="icon">
    <link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">

    <!-- Fonts -->
    <link href="https://fonts.googleapis.com" rel="preconnect">
    <link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Jost:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">

    <!-- Vendor CSS Files -->
    <link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
    <link href="assets/vendor/aos/aos.css" rel="stylesheet">
    <link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
    <link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">

    <!-- Main CSS File -->
    <link href="assets/css/main.css" rel="stylesheet">

    <!-- =======================================================
  * Template Name: Arsha
  * Template URL: https://bootstrapmade.com/arsha-free-bootstrap-html-template-corporate/
  * Updated: Feb 22 2025 with Bootstrap v5.3.3
  * Author: BootstrapMade.com
  * License: https://bootstrapmade.com/license/
  ======================================================== -->
</head>

<body class="index-page">

    <header id="header" class="header d-flex align-items-center fixed-top">
        <div class="container-fluid container-xl position-relative d-flex align-items-center">

            <a href="index.html" class="logo d-flex align-items-center me-auto">
                <!-- Uncomment the line below if you also wish to use an image logo -->
                <!-- <img src="assets/img/logo.webp" alt=""> -->
                <h1 class="sitename">E-Surat Desa</h1>

            </a>

            <nav id="navmenu" class="navmenu">
                <ul>
                    <li><a href="#hero" class="active">Beranda</a></li>
                    <li><a href="#about">Tentang Aplikasi</a></li>
                    <li><a href="#services">Layanan Surat</a></li>                    
                    <li><a href="#team">Tim Pengelola</a></li>
                    <li><a href="#pricing">Informasi Layanan</a></li>
                    <li><a href="#contact">Kontak</a></li>
                </ul>

                <i class="mobile-nav-toggle d-xl-none bi bi-list"></i>
            </nav>


           <a class="btn-getstarted" href="{{ route('login') }}">Masuk</a>


        </div>
    </header>

    <main class="main">

        <!-- Hero Section -->
        <section id="hero" class="hero section dark-background">

            <div class="container">
                <div class="row gy-4">
                    <div class="col-lg-6 order-2 order-lg-1 d-flex flex-column justify-content-center" data-aos="zoom-out">
                        <h1>Solusi Digital Pelayanan Surat Desa</h1>
                        <p>
                            Aplikasi pelayanan desa berbasis web untuk mempermudah pengajuan,
                            pengelolaan, dan penerbitan surat secara online, cepat, dan transparan.
                        </p>
                        <div class="d-flex">
                            <a href="#about" class="btn-get-started">Mulai Sekarang</a>
                            <a href="https://youtu.be/NE0hl6qXFTs?si=TyjhvXoatyQN1YS3" target="_blank" class="btn-watch-video d-flex align-items-center">
                                <i class="bi bi-play-circle"></i>
                                <span>Lihat Profil</span>
                            </a>
                        </div>

                    </div>

                    <div class="col-lg-6 order-1 order-lg-2 hero-img" data-aos="zoom-out" data-aos-delay="200">
                        <img src="assets/img/surat-menyurat.png" class="img-fluid animated" alt="Aplikasi Surat Desa">
                    </div>
                </div>
            </div>

        </section>
        <!-- /Hero Section -->

        <!-- /Clients Section -->

        <!-- About Section -->
        <section id="about" class="about section">

            <!-- Section Title -->
            <div class="container section-title" data-aos="fade-up">
                <h2>Tentang Aplikasi</h2>
            </div><!-- End Section Title -->

            <div class="container">

                <div class="row gy-4">

                    <div class="col-lg-6 content" data-aos="fade-up" data-aos-delay="100">
                        <p>
                            Aplikasi Sistem Surat Menyurat Desa merupakan solusi digital
                            yang dirancang untuk membantu pemerintah desa dalam memberikan
                            pelayanan administrasi kepada masyarakat secara lebih cepat,
                            efisien, dan transparan.
                        </p>
                        <ul>
                            <li>
                                <i class="bi bi-check2-circle"></i>
                                <span>Pengajuan surat dilakukan secara online oleh warga</span>
                            </li>
                            <li>
                                <i class="bi bi-check2-circle"></i>
                                <span>Proses verifikasi dan persetujuan dilakukan secara digital</span>
                            </li>
                            <li>
                                <i class="bi bi-check2-circle"></i>
                                <span>Pengarsipan surat tersimpan rapi dan aman dalam sistem</span>
                            </li>
                        </ul>
                    </div>

                    <div class="col-lg-6" data-aos="fade-up" data-aos-delay="200">
                        <p>
                            Dengan adanya sistem ini, proses administrasi desa yang sebelumnya
                            dilakukan secara manual dapat diminimalkan sehingga mengurangi
                            kesalahan data, mempercepat waktu pelayanan, serta meningkatkan
                            kualitas layanan publik bagi masyarakat desa.
                        </p>
                        <a href="#services" class="read-more">
                            <span>Lihat Layanan</span>
                            <i class="bi bi-arrow-right"></i>
                        </a>
                    </div>

                </div>

            </div>

        </section>
        <!-- /About Section -->

        <!-- Why Us Section -->
        <section id="why-us" class="section why-us light-background" data-builder="section">

            <div class="container-fluid">

                <div class="row gy-4">

                    <div class="col-lg-7 d-flex flex-column justify-content-center order-2 order-lg-1">

                        <div class="content px-xl-5" data-aos="fade-up" data-aos-delay="100">
                            <h3>
                                <span>Mengapa menggunakan </span>
                                <strong>Sistem Surat Menyurat Desa?</strong>
                            </h3>
                            <p>
                                Sistem ini hadir sebagai solusi digital untuk meningkatkan kualitas
                                pelayanan administrasi desa agar lebih cepat, efisien, dan transparan.
                            </p>
                        </div>

                        <div class="faq-container px-xl-5" data-aos="fade-up" data-aos-delay="200">

                            <div class="faq-item faq-active">
                                <h3><span>01</span> Apa keuntungan menggunakan sistem surat online?</h3>
                                <div class="faq-content">
                                    <p>
                                        Warga tidak perlu datang langsung ke kantor desa. Pengajuan
                                        surat dapat dilakukan kapan saja secara online dan prosesnya
                                        dapat dipantau melalui sistem.
                                    </p>
                                </div>
                                <i class="faq-toggle bi bi-chevron-right"></i>
                            </div><!-- End Faq item-->

                            <div class="faq-item">
                                <h3><span>02</span> Bagaimana proses pengajuan surat dilakukan?</h3>
                                <div class="faq-content">
                                    <p>
                                        Warga mengisi formulir pengajuan surat melalui aplikasi,
                                        kemudian admin desa melakukan verifikasi data sebelum
                                        disetujui oleh kepala desa.
                                    </p>
                                </div>
                                <i class="faq-toggle bi bi-chevron-right"></i>
                            </div><!-- End Faq item-->

                            <div class="faq-item">
                                <h3><span>03</span> Apakah data warga aman di dalam sistem?</h3>
                                <div class="faq-content">
                                    <p>
                                        Ya, sistem dilengkapi dengan pengamanan data dan hak akses
                                        pengguna sehingga informasi warga tersimpan dengan aman
                                        dan hanya dapat diakses oleh pihak berwenang.
                                    </p>
                                </div>
                                <i class="faq-toggle bi bi-chevron-right"></i>
                            </div><!-- End Faq item-->

                        </div>

                    </div>

                    <div class="col-lg-5 order-1 order-lg-2 why-us-img">
                        <img src="assets/img/gambar1.png" class="img-fluid" alt="Keunggulan Aplikasi Surat Desa" data-aos="zoom-in" data-aos-delay="100">
                    </div>

                </div>

            </div>

        </section>
        <!-- /Why Us Section -->

        <!-- Skills Section -->
        <section id="skills" class="skills section">

            <div class="container" data-aos="fade-up" data-aos-delay="100">

                <div class="row">

                    <div class="col-lg-6 d-flex align-items-center">
                        <img src="assets/img/illustration/illustration-10.webp" class="img-fluid" alt="Kapabilitas Sistem Pelayanan Desa">
                    </div>

                    <div class="col-lg-6 pt-4 pt-lg-0 content">

                        <h3>Kualitas & Kapabilitas Sistem Pelayanan Desa</h3>
                        <p class="fst-italic">
                            Sistem surat menyurat desa dirancang untuk meningkatkan efisiensi,
                            transparansi, dan kemudahan akses layanan administrasi bagi masyarakat.
                        </p>

                        <div class="skills-content skills-animation">

                            <div class="progress">
                                <span class="skill">
                                    <span>Kecepatan Proses Surat</span>
                                    <i class="val">95%</i>
                                </span>
                                <div class="progress-bar-wrap">
                                    <div class="progress-bar" role="progressbar"
                                        aria-valuenow="95" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div><!-- End Skills Item -->

                            <div class="progress">
                                <span class="skill">
                                    <span>Akurasi Data Kependudukan</span>
                                    <i class="val">90%</i>
                                </span>
                                <div class="progress-bar-wrap">
                                    <div class="progress-bar" role="progressbar"
                                        aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div><!-- End Skills Item -->

                            <div class="progress">
                                <span class="skill">
                                    <span>Kemudahan Penggunaan</span>
                                    <i class="val">88%</i>
                                </span>
                                <div class="progress-bar-wrap">
                                    <div class="progress-bar" role="progressbar"
                                        aria-valuenow="88" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div><!-- End Skills Item -->

                            <div class="progress">
                                <span class="skill">
                                    <span>Keamanan Data Warga</span>
                                    <i class="val">92%</i>
                                </span>
                                <div class="progress-bar-wrap">
                                    <div class="progress-bar" role="progressbar"
                                        aria-valuenow="92" aria-valuemin="0" aria-valuemax="100"></div>
                                </div>
                            </div><!-- End Skills Item -->

                        </div>

                    </div>
                </div>

            </div>

        </section>
        <!-- /Skills Section -->

        <!-- Services Section -->
        <section id="services" class="services section light-background">

            <!-- Section Title -->
            <div class="container section-title" data-aos="fade-up">
                <h2>Layanan Desa</h2>
                <p>Pelayanan administrasi desa yang cepat, transparan, dan mudah diakses oleh masyarakat</p>
            </div><!-- End Section Title -->

            <div class="container">

                <div class="row gy-4">

                    <!-- Surat Keterangan -->
                    <div class="col-xl-3 col-md-6 d-flex" data-aos="fade-up" data-aos-delay="100">
                        <div class="service-item position-relative">
                            <div class="icon"><i class="bi bi-file-earmark-text icon"></i></div>
                            <h4>
                                <a href="" class="stretched-link">Surat Keterangan</a>
                            </h4>
                            <p>
                                Pengajuan berbagai surat keterangan seperti domisili, usaha, dan keterangan tidak mampu secara online.
                            </p>
                        </div>
                    </div><!-- End Service Item -->

                    <!-- Surat Pengantar -->
                    <div class="col-xl-3 col-md-6 d-flex" data-aos="fade-up" data-aos-delay="200">
                        <div class="service-item position-relative">
                            <div class="icon"><i class="bi bi-journal-text icon"></i></div>
                            <h4>
                                <a href="" class="stretched-link">Surat Pengantar</a>
                            </h4>
                            <p>
                                Layanan pembuatan surat pengantar untuk keperluan administrasi ke instansi terkait.
                            </p>
                        </div>
                    </div><!-- End Service Item -->

                    <!-- Surat Domisili -->
                    <div class="col-xl-3 col-md-6 d-flex" data-aos="fade-up" data-aos-delay="300">
                        <div class="service-item position-relative">
                            <div class="icon"><i class="bi bi-house-check icon"></i></div>
                            <h4>
                                <a href="" class="stretched-link">Surat Domisili</a>
                            </h4>
                            <p>
                                Pengajuan surat domisili warga secara digital tanpa harus datang ke kantor desa.
                            </p>
                        </div>
                    </div><!-- End Service Item -->

                    <!-- Tracking Surat -->
                    <div class="col-xl-3 col-md-6 d-flex" data-aos="fade-up" data-aos-delay="400">
                        <div class="service-item position-relative">
                            <div class="icon"><i class="bi bi-search icon"></i></div>
                            <h4>
                                <a href="" class="stretched-link">Tracking Status Surat</a>
                            </h4>
                            <p>
                                Pantau status pengajuan surat secara real-time hingga surat selesai diproses.
                            </p>
                        </div>
                    </div><!-- End Service Item -->

                </div>

            </div>

        </section>
        <!-- /Services Section -->

        <!-- Work Process Section -->
        <section id="work-process" class="work-process section">

            <!-- Section Title -->
            <div class="container section-title" data-aos="fade-up">
                <h2>Alur Pelayanan Desa</h2>
                <p>Proses pengajuan surat desa yang mudah, cepat, dan transparan secara online</p>
            </div><!-- End Section Title -->

            <div class="container" data-aos="fade-up" data-aos-delay="100">

                <div class="row gy-5">

                    <!-- Step 1 -->
                    <div class="col-lg-4" data-aos="fade-up" data-aos-delay="200">
                        <div class="steps-item">
                            <div class="steps-image">
                                <img src="assets/img/steps/steps-1.webp" alt="Pengajuan Surat" class="img-fluid" loading="lazy">
                            </div>
                            <div class="steps-content">
                                <div class="steps-number">01</div>
                                <h3>Pengajuan Surat</h3>
                                <p>
                                    Warga mengajukan permohonan surat melalui sistem dengan mengisi data dan persyaratan yang dibutuhkan.
                                </p>
                                <div class="steps-features">
                                    <div class="feature-item">
                                        <i class="bi bi-check-circle"></i>
                                        <span>Isi Form Online</span>
                                    </div>
                                    <div class="feature-item">
                                        <i class="bi bi-check-circle"></i>
                                        <span>Upload Persyaratan</span>
                                    </div>
                                    <div class="feature-item">
                                        <i class="bi bi-check-circle"></i>
                                        <span>Kirim Permohonan</span>
                                    </div>
                                </div>
                            </div>
                        </div><!-- End Steps Item -->
                    </div>

                    <!-- Step 2 -->
                    <div class="col-lg-4" data-aos="fade-up" data-aos-delay="300">
                        <div class="steps-item">
                            <div class="steps-image">
                                <img src="assets/img/steps/steps-2.webp" alt="Verifikasi Desa" class="img-fluid" loading="lazy">
                            </div>
                            <div class="steps-content">
                                <div class="steps-number">02</div>
                                <h3>Verifikasi Desa</h3>
                                <p>
                                    Petugas desa melakukan pemeriksaan dan verifikasi data pengajuan sesuai dengan ketentuan.
                                </p>
                                <div class="steps-features">
                                    <div class="feature-item">
                                        <i class="bi bi-check-circle"></i>
                                        <span>Validasi Data</span>
                                    </div>
                                    <div class="feature-item">
                                        <i class="bi bi-check-circle"></i>
                                        <span>Pemeriksaan Berkas</span>
                                    </div>
                                    <div class="feature-item">
                                        <i class="bi bi-check-circle"></i>
                                        <span>Persetujuan Admin</span>
                                    </div>
                                </div>
                            </div>
                        </div><!-- End Steps Item -->
                    </div>

                    <!-- Step 3 -->
                    <div class="col-lg-4" data-aos="fade-up" data-aos-delay="400">
                        <div class="steps-item">
                            <div class="steps-image">
                                <img src="assets/img/steps/steps-3.webp" alt="Surat Selesai" class="img-fluid" loading="lazy">
                            </div>
                            <div class="steps-content">
                                <div class="steps-number">03</div>
                                <h3>Surat Selesai</h3>
                                <p>
                                    Surat yang telah disetujui dapat diunduh atau diambil langsung di kantor desa.
                                </p>
                                <div class="steps-features">
                                    <div class="feature-item">
                                        <i class="bi bi-check-circle"></i>
                                        <span>Surat Diproses</span>
                                    </div>
                                    <div class="feature-item">
                                        <i class="bi bi-check-circle"></i>
                                        <span>Notifikasi Status</span>
                                    </div>
                                    <div class="feature-item">
                                        <i class="bi bi-check-circle"></i>
                                        <span>Surat Siap Digunakan</span>
                                    </div>
                                </div>
                            </div>
                        </div><!-- End Steps Item -->
                    </div>

                </div>

            </div>

        </section>
        <!-- /Work Process Section -->

        <!-- Call To Action Section -->
        <section id="call-to-action" class="call-to-action section dark-background">

            <img src="assets/img/bg/bg-8.webp" alt="Layanan Desa">

            <div class="container">

                <div class="row" data-aos="zoom-in" data-aos-delay="100">
                    <div class="col-xl-9 text-center text-xl-start">
                        <h3>Butuh Layanan Surat Desa?</h3>
                        <p>
                            Ajukan permohonan surat secara online dengan mudah, cepat, dan transparan tanpa harus datang ke kantor desa.
                            Sistem kami dirancang untuk memberikan pelayanan terbaik bagi masyarakat.
                        </p>
                    </div>
                    <div class="col-xl-3 cta-btn-container text-center">
                        <a class="cta-btn align-middle" href="#services">Ajukan Surat Sekarang</a>
                    </div>
                </div>

            </div>

        </section>
        <!-- /Call To Action Section -->

        <!-- Team Section -->
        <section id="team" class="team section">

            <!-- Section Title -->
            <div class="container section-title" data-aos="fade-up">
                <h2>Perangkat Desa</h2>
                <p>Struktur organisasi dan aparatur pemerintahan desa</p>
            </div><!-- End Section Title -->

            <div class="container">

                <div class="row gy-4">

                    <!-- Kepala Desa -->
                    <div class="col-lg-6" data-aos="fade-up" data-aos-delay="100">
                        <div class="team-member d-flex align-items-start">
                            <div class="pic">
                                <img src="assets/img/person/kepala-desa.webp" class="img-fluid" alt="Kepala Desa">
                            </div>
                            <div class="member-info">
                                <h4>Kepala Desa</h4>
                                <span>Pimpinan Pemerintahan Desa</span>
                                <p>Bertanggung jawab atas penyelenggaraan pemerintahan, pembangunan, dan pelayanan masyarakat desa.</p>
                                <div class="social">
                                    <a href="#"><i class="bi bi-facebook"></i></a>
                                    <a href="#"><i class="bi bi-instagram"></i></a>
                                    <a href="#"><i class="bi bi-envelope"></i></a>
                                </div>
                            </div>
                        </div>
                    </div><!-- End Team Member -->

                    <!-- Sekretaris Desa -->
                    <div class="col-lg-6" data-aos="fade-up" data-aos-delay="200">
                        <div class="team-member d-flex align-items-start">
                            <div class="pic">
                                <img src="assets/img/person/sekretaris-desa.webp" class="img-fluid" alt="Sekretaris Desa">
                            </div>
                            <div class="member-info">
                                <h4>Sekretaris Desa</h4>
                                <span>Koordinator Administrasi</span>
                                <p>Mengelola administrasi, arsip surat-menyurat, dan tata usaha pemerintahan desa.</p>
                                <div class="social">
                                    <a href="#"><i class="bi bi-facebook"></i></a>
                                    <a href="#"><i class="bi bi-instagram"></i></a>
                                    <a href="#"><i class="bi bi-envelope"></i></a>
                                </div>
                            </div>
                        </div>
                    </div><!-- End Team Member -->

                    <!-- Kasi Pelayanan -->
                    <div class="col-lg-6" data-aos="fade-up" data-aos-delay="300">
                        <div class="team-member d-flex align-items-start">
                            <div class="pic">
                                <img src="assets/img/person/kasi-pelayanan.webp" class="img-fluid" alt="Kasi Pelayanan">
                            </div>
                            <div class="member-info">
                                <h4>Kasi Pelayanan</h4>
                                <span>Layanan Masyarakat</span>
                                <p>Memberikan pelayanan administrasi kepada masyarakat seperti surat keterangan dan dokumen desa.</p>
                                <div class="social">
                                    <a href="#"><i class="bi bi-facebook"></i></a>
                                    <a href="#"><i class="bi bi-instagram"></i></a>
                                    <a href="#"><i class="bi bi-envelope"></i></a>
                                </div>
                            </div>
                        </div>
                    </div><!-- End Team Member -->

                    <!-- Kaur Umum -->
                    <div class="col-lg-6" data-aos="fade-up" data-aos-delay="400">
                        <div class="team-member d-flex align-items-start">
                            <div class="pic">
                                <img src="assets/img/person/kaur-umum.webp" class="img-fluid" alt="Kaur Umum">
                            </div>
                            <div class="member-info">
                                <h4>Kaur Umum</h4>
                                <span>Administrasi & Umum</span>
                                <p>Mengelola aset desa, administrasi umum, serta mendukung operasional kantor desa.</p>
                                <div class="social">
                                    <a href="#"><i class="bi bi-facebook"></i></a>
                                    <a href="#"><i class="bi bi-instagram"></i></a>
                                    <a href="#"><i class="bi bi-envelope"></i></a>
                                </div>
                            </div>
                        </div>
                    </div><!-- End Team Member -->

                </div>

            </div>

        </section>
        <!-- /Team Section -->

        <!-- Pricing Section -->
        <section id="pricing" class="pricing section light-background">

            <!-- Section Title -->
            <div class="container section-title" data-aos="fade-up">
                <h2>Layanan Administrasi </h2>
                <p>Jenis layanan administrasi yang tersedia untuk warga Kincang Wetan</p>
            </div><!-- End Section Title -->

            <div class="container">

                <div class="row gy-4">

                    <!-- Layanan Dasar -->
                    <div class="col-lg-4" data-aos="zoom-in" data-aos-delay="100">
                        <div class="pricing-item">
                            <h3>Layanan Dasar</h3>
                            <h4><sup>Rp</sup>0<span> / gratis</span></h4>
                            <ul>
                                <li><i class="bi bi-check"></i> <span>Surat Keterangan Domisili</span></li>
                                <li><i class="bi bi-check"></i> <span>Surat Keterangan Usaha</span></li>
                                <li><i class="bi bi-check"></i> <span>Pengajuan Surat Online</span></li>
                                <li class="na"><i class="bi bi-x"></i> <span>Layanan Prioritas</span></li>
                            </ul>
                        </div>
                    </div><!-- End Pricing Item -->

                    <!-- Layanan Administrasi -->
                    <div class="col-lg-4" data-aos="zoom-in" data-aos-delay="200">
                        <div class="pricing-item featured">
                            <h3>Layanan Administrasi</h3>
                            <h4><sup>Rp</sup>0<span> / gratis</span></h4>
                            <ul>
                                <li><i class="bi bi-check"></i> <span>Surat Keterangan Tidak Mampu</span></li>
                                <li><i class="bi bi-check"></i> <span>Surat Pindah / Datang Warga</span></li>
                                <li><i class="bi bi-check"></i> <span>Tracking Status Pengajuan</span></li>
                                <li><i class="bi bi-check"></i> <span>Notifikasi Proses Surat</span></li>
                            </ul>
                        </div>
                    </div><!-- End Pricing Item -->

                    <!-- Layanan Khusus -->
                    <div class="col-lg-4" data-aos="zoom-in" data-aos-delay="300">
                        <div class="pricing-item">
                            <h3>Layanan Khusus</h3>
                            <h4><sup>Rp</sup>0<span> / gratis</span></h4>
                            <ul>
                                <li><i class="bi bi-check"></i> <span>Verifikasi Data Warga</span></li>
                                <li><i class="bi bi-check"></i> <span>Pelayanan Terjadwal</span></li>
                                <li><i class="bi bi-check"></i> <span>Arsip Digital Surat</span></li>
                            </ul>
                        </div>
                    </div><!-- End Pricing Item -->

                </div>

            </div>

        </section>

        <!-- /Pricing Section -->

        <!-- Faq 2 Section -->
        <section id="faq-2" class="faq-2 section light-background">

            <!-- Section Title -->
            <div class="container section-title" data-aos="fade-up">
                <h2>Pertanyaan Umum (FAQ)</h2>
                <p>Berikut pertanyaan yang sering diajukan warga terkait layanan administrasi RT/RW dan pengajuan surat secara online.</p>
            </div><!-- End Section Title -->

            <div class="container">

                <div class="row justify-content-center">

                    <div class="col-lg-10">

                        <div class="faq-container">

                            <!-- FAQ 1 -->
                            <div class="faq-item faq-active" data-aos="fade-up" data-aos-delay="200">
                                <i class="faq-icon bi bi-question-circle"></i>
                                <h3>Bagaimana cara mengajukan surat keterangan domisili?</h3>
                                <div class="faq-content">
                                    <p>Warga dapat mengajukan surat keterangan domisili melalui sistem online RT/RW. Cukup login, pilih jenis surat, isi formulir, dan unggah dokumen pendukung.</p>
                                </div>
                                <i class="faq-toggle bi bi-chevron-right"></i>
                            </div><!-- End Faq item-->

                            <!-- FAQ 2 -->
                            <div class="faq-item" data-aos="fade-up" data-aos-delay="300">
                                <i class="faq-icon bi bi-question-circle"></i>
                                <h3>Berapa lama proses pengajuan surat RT/RW?</h3>
                                <div class="faq-content">
                                    <p>Proses biasanya memakan waktu 1-3 hari kerja tergantung jenis surat. Status pengajuan bisa dipantau secara online melalui akun warga.</p>
                                </div>
                                <i class="faq-toggle bi bi-chevron-right"></i>
                            </div><!-- End Faq item-->

                            <!-- FAQ 3 -->
                            <div class="faq-item" data-aos="fade-up" data-aos-delay="400">
                                <i class="faq-icon bi bi-question-circle"></i>
                                <h3>Apakah ada biaya untuk layanan administrasi RT/RW?</h3>
                                <div class="faq-content">
                                    <p>Semua layanan administrasi dan surat pengantar di RT/RW ini gratis untuk warga. Tidak ada biaya tambahan untuk pengajuan online maupun offline.</p>
                                </div>
                                <i class="faq-toggle bi bi-chevron-right"></i>
                            </div><!-- End Faq item-->

                            <!-- FAQ 4 -->
                            <div class="faq-item" data-aos="fade-up" data-aos-delay="500">
                                <i class="faq-icon bi bi-question-circle"></i>
                                <h3>Bagaimana cara memantau status pengajuan surat?</h3>
                                <div class="faq-content">
                                    <p>Setelah mengajukan surat, warga dapat memantau status pengajuan melalui dashboard akun. Notifikasi juga akan dikirimkan melalui email atau WhatsApp jika tersedia.</p>
                                </div>
                                <i class="faq-toggle bi bi-chevron-right"></i>
                            </div><!-- End Faq item-->

                            <!-- FAQ 5 -->
                            <div class="faq-item" data-aos="fade-up" data-aos-delay="600">
                                <i class="faq-icon bi bi-question-circle"></i>
                                <h3>Apakah data warga dijamin keamanannya?</h3>
                                <div class="faq-content">
                                    <p>Ya, semua data warga tersimpan secara aman di sistem digital RT/RW. Hanya pengurus RT/RW yang berwenang yang dapat mengakses data untuk keperluan administrasi.</p>
                                </div>
                                <i class="faq-toggle bi bi-chevron-right"></i>
                            </div><!-- End Faq item-->

                        </div>

                    </div>

                </div>

            </div>

        </section>
        <!-- /Faq 2 Section -->

        <!-- /Subscribe Section -->

        <!-- Contact Section -->
        <section id="contact" class="contact section">

            <!-- Section Title -->
            <div class="container section-title text-center" data-aos="fade-up">
                <h2>Kontak</h2>
                <p>Hubungi Kantor Desa Kincang Wetan untuk informasi dan layanan administrasi</p>
            </div><!-- End Section Title -->

            <div class="container" data-aos="fade-up" data-aos-delay="100">

                <div class="row justify-content-center">

                    <div class="col-lg-6">

                        <div class="info-wrap text-center">
                            <div class="info-item d-flex flex-column align-items-center mb-3" data-aos="fade-up" data-aos-delay="200">
                                <i class="bi bi-geo-alt mb-2" style="font-size: 1.5rem;"></i>
                                <div>
                                    <h3>Kantor Desa</h3>
                                    <p>Jl. Marsma TNI Anumerta R. Iswahjudi No.4, Pare, Kincang Wetan, Kec. Jiwan, Kabupaten Madiun, Jawa Timur 63161</p>
                                </div>
                            </div><!-- End Info Item -->

                            <div class="info-item d-flex flex-column align-items-center mb-3" data-aos="fade-up" data-aos-delay="300">
                                <i class="bi bi-telephone mb-2" style="font-size: 1.5rem;"></i>
                                <div>
                                    <h3>Telepon</h3>
                                    <p>(0351) 868979</p>
                                </div>
                            </div><!-- End Info Item -->

                            <div class="info-item d-flex flex-column align-items-center mb-3" data-aos="fade-up" data-aos-delay="400">
                                <i class="bi bi-envelope mb-2" style="font-size: 1.5rem;"></i>
                                <div>
                                    <h3>Email</h3>
                                    <p>info@desakincangwetan.id</p>
                                </div>
                            </div><!-- End Info Item -->

                            <!-- Google Maps -->
                            <iframe
                                src="https://maps.google.com/maps?q=Jl.%20Marsma%20TNI%20Anumerta%20R.%20Iswahjudi%20No.4,%20Pare,%20Kincang%20Wetan,%20Kec.%20Jiwan,%20Kabupaten%20Madiun&t=&z=15&ie=UTF8&iwloc=&output=embed"
                                frameborder="0"
                                style="border:0; width: 100%; height: 270px; border-radius: 8px;"
                                allowfullscreen=""
                                loading="lazy"
                                referrerpolicy="no-referrer-when-downgrade">
                            </iframe>
                        </div>
                    </div>

                </div>

            </div>

        </section>



    </main>

    <footer id="footer" class="footer">
        <div class="container footer-top">
            <div class="row gy-4">
                <!-- Tentang Desa -->
                <div class="col-lg-4 col-md-6 footer-about">
                    <a href="index.html" class="d-flex align-items-center">
                        <span class="sitename">Desa Kincang Wetan</span>
                    </a>
                    <div class="footer-contact pt-3">
                        <p>Jl. Marsma TNI Anumerta R. Iswahjudi No.4, Pare, Kincang Wetan</p>
                        <p>Kecamatan Jiwan, Kabupaten Madiun, Jawa Timur 63161</p>
                        <p class="mt-3"><strong>Telepon:</strong> <span>(0351) 868979</span></p>
                        <p><strong>Email:</strong> <span>info@desakincangwetan.id</span></p>
                    </div>
                </div>

                <!-- Useful Links -->
                <div class="col-lg-2 col-md-3 footer-links">
                    <h4>Useful Links</h4>
                    <ul>
                        <li><i class="bi bi-chevron-right"></i> <a href="#">Beranda</a></li>
                        <li><i class="bi bi-chevron-right"></i> <a href="#">Tentang Desa</a></li>
                        <li><i class="bi bi-chevron-right"></i> <a href="#">Layanan</a></li>
                        <li><i class="bi bi-chevron-right"></i> <a href="#">Kontak</a></li>
                    </ul>
                </div>

                <!-- Layanan Desa -->
                <div class="col-lg-2 col-md-3 footer-links">
                    <h4>Layanan Desa</h4>
                    <ul>
                        <li><i class="bi bi-chevron-right"></i> <a href="#">Surat Domisili</a></li>
                        <li><i class="bi bi-chevron-right"></i> <a href="#">Surat Usaha</a></li>
                        <li><i class="bi bi-chevron-right"></i> <a href="#">Surat Pindah/Datang</a></li>
                        <li><i class="bi bi-chevron-right"></i> <a href="#">Layanan Online</a></li>
                    </ul>
                </div>


            </div>
        </div>

        <div class="container copyright text-center mt-4">
            <p>© <span>Copyright</span> <strong class="px-1 sitename">Desa Kincang Wetan</strong> <span></span></p>
        </div>


    </footer>

    <!-- Scroll Top -->
    <a href="#" id="scroll-top" class="scroll-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a>

    <!-- Preloader -->
    <div id="preloader"></div>

    <!-- Vendor JS Files -->
    <script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
    <script src="assets/vendor/php-email-form/validate.js"></script>
    <script src="assets/vendor/aos/aos.js"></script>
    <script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
    <script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
    <script src="assets/vendor/waypoints/noframework.waypoints.js"></script>
    <script src="assets/vendor/imagesloaded/imagesloaded.pkgd.min.js"></script>
    <script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>

    <!-- Main JS File -->
    <script src="assets/js/main.js"></script>

</body>

</html>