{"id":10,"date":"2026-08-08T07:20:32","date_gmt":"2026-08-08T07:20:32","guid":{"rendered":"http:\/\/localhost\/wordpress\/?page_id=10"},"modified":"2026-08-28T02:55:37","modified_gmt":"2026-08-28T02:55:37","slug":"beranda","status":"publish","type":"page","link":"https:\/\/kelurahansalubattang.homeit.my.id\/","title":{"rendered":"Beranda"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"10\" class=\"elementor elementor-10\">\n\t\t\t\t<div class=\"elementor-element elementor-element-042f360 e-flex e-con-boxed e-con e-parent\" data-id=\"042f360\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;slideshow&quot;,&quot;background_slideshow_gallery&quot;:[{&quot;id&quot;:113,&quot;url&quot;:&quot;https:\\\/\\\/kelurahansalubattang.homeit.my.id\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/ChatGPT-Image-27-Agu-2026-19.31.54.png&quot;}],&quot;background_slideshow_loop&quot;:&quot;yes&quot;,&quot;background_slideshow_slide_duration&quot;:5000,&quot;background_slideshow_slide_transition&quot;:&quot;fade&quot;,&quot;background_slideshow_transition_duration&quot;:500}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-c115679 e-con-full e-flex e-con e-child\" data-id=\"c115679\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-08fd4a2 elementor-widget elementor-widget-heading\" data-id=\"08fd4a2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\"> Selamat Datang di Website<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7d1efc4 elementor-widget elementor-widget-heading\" data-id=\"7d1efc4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Kelurahan Salubattang<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-eca173b elementor-widget elementor-widget-text-editor\" data-id=\"eca173b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<h5>&#8220;Lahan Subur, Warga Tangguh, Salubattang Bertumbuh&#8221;<\/h5>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c459fbf elementor-widget elementor-widget-html\" data-id=\"c459fbf\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<a href=\"https:\/\/kelurahansalubattang.homeit.my.id\/?page_id=65\" class=\"tombol-kontak\">\r\n    <span>Kontak Kami<\/span>\r\n    <span class=\"panah\">\u2192<\/span>\r\n<\/a>\r\n\r\n<style>\r\n.tombol-kontak {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 12px;\r\n\r\n    padding: 14px 28px;\r\n\r\n    background: #48d86b;\r\n    color: #ffffff;\r\n\r\n    text-decoration: none;\r\n\r\n    border-radius: 6px;\r\n\r\n    font-size: 17px;\r\n    font-weight: 700;\r\n\r\n    transition: all 0.3s ease;\r\n\r\n    box-shadow:\r\n        0 6px 15px rgba(0,0,0,0.12);\r\n}\r\n\r\n\r\n\/* PANAH *\/\r\n\r\n.tombol-kontak .panah {\r\n    font-size: 22px;\r\n    font-weight: 400;\r\n\r\n    transition:\r\n        transform 0.3s ease;\r\n}\r\n\r\n\r\n\/* SAAT MOUSE DIARAHKAN *\/\r\n\r\n.tombol-kontak:hover {\r\n    background: #087857;\r\n    color: #ffffff;\r\n\r\n    transform: translateY(-3px);\r\n\r\n    box-shadow:\r\n        0 10px 25px rgba(0,0,0,0.18);\r\n}\r\n\r\n\r\n\/* PANAH BERGERAK *\/\r\n\r\n.tombol-kontak:hover .panah {\r\n    transform: translateX(6px);\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-154850a elementor-widget elementor-widget-html\" data-id=\"154850a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* =================================\r\n   CREDIT KKN-T - UKURAN KECIL\r\n================================= *\/\r\n\r\n.kkn-credit {\r\n    width: 65%;\r\n    max-width: 850px;\r\n    margin: 25px auto;\r\n\r\n    padding: 12px 20px;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 25px;\r\n\r\n    \/* Transparan *\/\r\n    background: rgba(255, 255, 255, 0.18);\r\n\r\n    \/* Efek kaca *\/\r\n    backdrop-filter: blur(4px);\r\n    -webkit-backdrop-filter: blur(4px);\r\n\r\n    border: 1px solid rgba(255,255,255,0.45);\r\n    border-radius: 18px;\r\n\r\n    box-shadow: 0 5px 18px rgba(0,0,0,0.15);\r\n\r\n    box-sizing: border-box;\r\n}\r\n\r\n\r\n\/* LOGO *\/\r\n\r\n.kkn-logo {\r\n    width: 55px;\r\n    height: 55px;\r\n\r\n    object-fit: contain;\r\n\r\n    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.4));\r\n\r\n    transition: 0.3s ease;\r\n}\r\n\r\n.kkn-logo:hover {\r\n    transform: scale(1.08);\r\n}\r\n\r\n\r\n\/* TEKS *\/\r\n\r\n.kkn-text {\r\n    text-align: center;\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    color: white;\r\n\r\n    text-shadow: 0 1px 3px rgba(0,0,0,0.8);\r\n}\r\n\r\n\r\n\/* Dirancang oleh *\/\r\n\r\n.kkn-text .dirancang {\r\n    font-size: 12px;\r\n    font-style: italic;\r\n    font-weight: 600;\r\n\r\n    margin-bottom: 2px;\r\n}\r\n\r\n\r\n\/* KKN-T *\/\r\n\r\n.kkn-text .kkn {\r\n    font-size: 17px;\r\n    font-weight: 800;\r\n\r\n    letter-spacing: 0.5px;\r\n\r\n    margin-bottom: 2px;\r\n}\r\n\r\n\r\n\/* Universitas *\/\r\n\r\n.kkn-text .kampus {\r\n    font-size: 11px;\r\n    font-weight: 600;\r\n\r\n    letter-spacing: 0.3px;\r\n}\r\n\r\n\r\n\/* =================================\r\n   TABLET\r\n================================= *\/\r\n\r\n@media (max-width: 768px) {\r\n\r\n    .kkn-credit {\r\n        width: 75%;\r\n        gap: 18px;\r\n\r\n        padding: 10px 15px;\r\n    }\r\n\r\n    .kkn-logo {\r\n        width: 48px;\r\n        height: 48px;\r\n    }\r\n\r\n    .kkn-text .dirancang {\r\n        font-size: 11px;\r\n    }\r\n\r\n    .kkn-text .kkn {\r\n        font-size: 15px;\r\n    }\r\n\r\n    .kkn-text .kampus {\r\n        font-size: 10px;\r\n    }\r\n}\r\n\r\n\r\n\/* =================================\r\n   HP\r\n================================= *\/\r\n\r\n@media (max-width: 480px) {\r\n\r\n    .kkn-credit {\r\n        width: 90%;\r\n\r\n        padding: 10px;\r\n\r\n        gap: 12px;\r\n\r\n        border-radius: 15px;\r\n    }\r\n\r\n    .kkn-logo {\r\n        width: 42px;\r\n        height: 42px;\r\n    }\r\n\r\n    .kkn-text .dirancang {\r\n        font-size: 9px;\r\n    }\r\n\r\n    .kkn-text .kkn {\r\n        font-size: 13px;\r\n    }\r\n\r\n    .kkn-text .kampus {\r\n        font-size: 8px;\r\n    }\r\n}\r\n<\/style>\r\n\r\n\r\n<div class=\"kkn-credit\">\r\n\r\n    <!-- LOGO UNCP -->\r\n    <img decoding=\"async\"\r\n        class=\"kkn-logo\"\r\n        src=\"https:\/\/kelurahansalubattang.homeit.my.id\/wp-content\/uploads\/2026\/08\/logo-kampus.png\"\r\n        alt=\"Universitas Cokroaminoto Palopo\"\r\n    >\r\n\r\n    <!-- TEKS -->\r\n    <div class=\"kkn-text\">\r\n\r\n        <div class=\"dirancang\">\r\n            Dirancang oleh\r\n        <\/div>\r\n\r\n        <div class=\"kkn\">\r\n            KKN-T PERIODE 2\r\n        <\/div>\r\n\r\n        <div class=\"kampus\">\r\n            UNIVERSITAS COKROAMINOTO PALOPO\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n    <!-- LOGO BERDAMPAK -->\r\n    <img decoding=\"async\"\r\n        class=\"kkn-logo\"\r\n        src=\"https:\/\/kelurahansalubattang.homeit.my.id\/wp-content\/uploads\/2026\/08\/Logo-Tersier-Diktisaintek-Berdampak-1-1024x1024-2.png\"\r\n        alt=\"Berdampak\"\r\n    >\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3ac6b17 e-con e-atomic-element e-flexbox-base e-4366231 \" data-id=\"3ac6b17\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"3ac6b17\">\n    \t\t<div class=\"elementor-element elementor-element-65177ed elementor-widget elementor-widget-html\" data-id=\"65177ed\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =====================================================\r\n     DATA STATISTIK KELURAHAN SALUBATTANG\r\n     ===================================================== -->\r\n\r\n<section class=\"statistik-salubattang\">\r\n\r\n    <div class=\"statistik-container\">\r\n\r\n        <!-- JUDUL -->\r\n        <div class=\"statistik-header\">\r\n\r\n            <span class=\"statistik-subtitle\">\r\n                DATA WILAYAH\r\n            <\/span>\r\n\r\n            <h2>\r\n                Statistik Kelurahan Salubattang\r\n            <\/h2>\r\n\r\n            <p>\r\n                Data statistik wilayah Kelurahan Salubattang\r\n            <\/p>\r\n\r\n        <\/div>\r\n\r\n\r\n        <!-- =================================================\r\n             KARTU STATISTIK\r\n             ================================================= -->\r\n\r\n        <div class=\"statistik-grid\">\r\n\r\n\r\n            <!-- JUMLAH PENDUDUK -->\r\n            <div class=\"statistik-card\">\r\n\r\n                <div class=\"statistik-icon\">\r\n                    \ud83d\udc65\r\n                <\/div>\r\n\r\n                <div class=\"statistik-number\"\r\n                     data-target=\"1065\">\r\n                    0\r\n                <\/div>\r\n\r\n                <div class=\"statistik-label\">\r\n                    Jumlah Penduduk\r\n                <\/div>\r\n\r\n                <div class=\"statistik-line\"><\/div>\r\n\r\n            <\/div>\r\n\r\n\r\n            <!-- RT -->\r\n            <div class=\"statistik-card\">\r\n\r\n                <div class=\"statistik-icon\">\r\n                    \ud83c\udfd8\ufe0f\r\n                <\/div>\r\n\r\n                <div class=\"statistik-number\"\r\n                     data-target=\"9\">\r\n                    0\r\n                <\/div>\r\n\r\n                <div class=\"statistik-label\">\r\n                    RT\r\n                <\/div>\r\n\r\n                <div class=\"statistik-line\"><\/div>\r\n\r\n            <\/div>\r\n\r\n\r\n            <!-- RW -->\r\n            <div class=\"statistik-card\">\r\n\r\n                <div class=\"statistik-icon\">\r\n                    \ud83c\udfe1\r\n                <\/div>\r\n\r\n                <div class=\"statistik-number\"\r\n                     data-target=\"3\">\r\n                    0\r\n                <\/div>\r\n\r\n                <div class=\"statistik-label\">\r\n                    RW\r\n                <\/div>\r\n\r\n                <div class=\"statistik-line\"><\/div>\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n\r\n<style>\r\n\r\n\/* =====================================================\r\n   SECTION UTAMA\r\n   ===================================================== *\/\r\n\r\n.statistik-salubattang {\r\n\r\n    width: 100%;\r\n\r\n    padding: 80px 20px;\r\n\r\n    background: #f7faf9;\r\n\r\n    box-sizing: border-box;\r\n\r\n    font-family:\r\n        Arial,\r\n        Helvetica,\r\n        sans-serif;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   CONTAINER\r\n   ===================================================== *\/\r\n\r\n.statistik-container {\r\n\r\n    max-width: 1150px;\r\n\r\n    margin: auto;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   HEADER\r\n   ===================================================== *\/\r\n\r\n.statistik-header {\r\n\r\n    text-align: center;\r\n\r\n    margin-bottom: 45px;\r\n\r\n}\r\n\r\n\r\n.statistik-subtitle {\r\n\r\n    display: inline-block;\r\n\r\n    color: #075c46;\r\n\r\n    font-size: 13px;\r\n\r\n    font-weight: 700;\r\n\r\n    letter-spacing: 2px;\r\n\r\n    margin-bottom: 10px;\r\n\r\n}\r\n\r\n\r\n.statistik-header h2 {\r\n\r\n    margin: 0;\r\n\r\n    font-size: 36px;\r\n\r\n    font-weight: 800;\r\n\r\n    color: #123b32;\r\n\r\n}\r\n\r\n\r\n.statistik-header p {\r\n\r\n    margin-top: 12px;\r\n\r\n    color: #6b7773;\r\n\r\n    font-size: 16px;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   GRID\r\n   ===================================================== *\/\r\n\r\n.statistik-grid {\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns:\r\n        repeat(3, 1fr);\r\n\r\n    gap: 25px;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   CARD\r\n   ===================================================== *\/\r\n\r\n.statistik-card {\r\n\r\n    position: relative;\r\n\r\n    background: #ffffff;\r\n\r\n    padding: 35px 20px;\r\n\r\n    text-align: center;\r\n\r\n    border-radius: 18px;\r\n\r\n    border: 1px solid #e5eeeb;\r\n\r\n    box-shadow:\r\n        0 8px 25px\r\n        rgba(0, 0, 0, 0.06);\r\n\r\n    overflow: hidden;\r\n\r\n    transition:\r\n        transform 0.3s ease,\r\n        box-shadow 0.3s ease;\r\n\r\n}\r\n\r\n\r\n\/* HOVER *\/\r\n\r\n.statistik-card:hover {\r\n\r\n    transform: translateY(-8px);\r\n\r\n    box-shadow:\r\n        0 15px 35px\r\n        rgba(0, 0, 0, 0.10);\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   ICON\r\n   ===================================================== *\/\r\n\r\n.statistik-icon {\r\n\r\n    width: 65px;\r\n\r\n    height: 65px;\r\n\r\n    margin:\r\n        0 auto 18px;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n\r\n    justify-content: center;\r\n\r\n    background: #e8f5f0;\r\n\r\n    border-radius: 50%;\r\n\r\n    font-size: 30px;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   ANGKA\r\n   ===================================================== *\/\r\n\r\n.statistik-number {\r\n\r\n    color: #075c46;\r\n\r\n    font-size: 48px;\r\n\r\n    font-weight: 800;\r\n\r\n    line-height: 1.1;\r\n\r\n    margin-bottom: 8px;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   LABEL\r\n   ===================================================== *\/\r\n\r\n.statistik-label {\r\n\r\n    color: #52605b;\r\n\r\n    font-size: 16px;\r\n\r\n    font-weight: 600;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   GARIS HIJAU\r\n   ===================================================== *\/\r\n\r\n.statistik-line {\r\n\r\n    width: 45px;\r\n\r\n    height: 3px;\r\n\r\n    background: #075c46;\r\n\r\n    margin:\r\n        18px auto 0;\r\n\r\n    border-radius: 10px;\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   TABLET\r\n   ===================================================== *\/\r\n\r\n@media (max-width: 768px) {\r\n\r\n    .statistik-salubattang {\r\n\r\n        padding: 60px 15px;\r\n\r\n    }\r\n\r\n\r\n    .statistik-header h2 {\r\n\r\n        font-size: 30px;\r\n\r\n    }\r\n\r\n\r\n    .statistik-grid {\r\n\r\n        grid-template-columns:\r\n            repeat(3, 1fr);\r\n\r\n        gap: 12px;\r\n\r\n    }\r\n\r\n\r\n    .statistik-card {\r\n\r\n        padding: 25px 10px;\r\n\r\n    }\r\n\r\n\r\n    .statistik-number {\r\n\r\n        font-size: 36px;\r\n\r\n    }\r\n\r\n\r\n    .statistik-label {\r\n\r\n        font-size: 14px;\r\n\r\n    }\r\n\r\n\r\n    .statistik-icon {\r\n\r\n        width: 55px;\r\n\r\n        height: 55px;\r\n\r\n        font-size: 25px;\r\n\r\n    }\r\n\r\n}\r\n\r\n\r\n\/* =====================================================\r\n   HP\r\n   ===================================================== *\/\r\n\r\n@media (max-width: 480px) {\r\n\r\n    .statistik-header h2 {\r\n\r\n        font-size: 25px;\r\n\r\n    }\r\n\r\n\r\n    .statistik-header p {\r\n\r\n        font-size: 14px;\r\n\r\n    }\r\n\r\n\r\n    .statistik-grid {\r\n\r\n        grid-template-columns: 1fr;\r\n\r\n        gap: 15px;\r\n\r\n    }\r\n\r\n\r\n    .statistik-card {\r\n\r\n        padding: 30px 15px;\r\n\r\n    }\r\n\r\n\r\n    .statistik-number {\r\n\r\n        font-size: 42px;\r\n\r\n    }\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n\r\n\r\n<script>\r\n\r\n\/* =====================================================\r\n   ANIMASI COUNTER SAAT SCROLL\r\n   ===================================================== *\/\r\n\r\ndocument.addEventListener(\r\n    \"DOMContentLoaded\",\r\n    function () {\r\n\r\n\r\n        \/* Ambil section statistik *\/\r\n\r\n        const statistikSection =\r\n            document.querySelector(\r\n                \".statistik-salubattang\"\r\n            );\r\n\r\n\r\n        \/* Ambil semua angka *\/\r\n\r\n        const counters =\r\n            document.querySelectorAll(\r\n                \".statistik-number\"\r\n            );\r\n\r\n\r\n        \/* Mencegah animasi berjalan berulang *\/\r\n\r\n        let sudahBerjalan = false;\r\n\r\n\r\n        \/* =================================================\r\n           FUNGSI ANIMASI\r\n           ================================================= *\/\r\n\r\n        function mulaiCounter() {\r\n\r\n\r\n            \/* Jika sudah berjalan, hentikan *\/\r\n\r\n            if (sudahBerjalan) return;\r\n\r\n\r\n            sudahBerjalan = true;\r\n\r\n\r\n            \/* Jalankan semua counter *\/\r\n\r\n            counters.forEach(\r\n                counter => {\r\n\r\n\r\n                    \/* Target angka *\/\r\n\r\n                    const target =\r\n                        parseInt(\r\n                            counter.getAttribute(\r\n                                \"data-target\"\r\n                            )\r\n                        );\r\n\r\n\r\n                    \/* Waktu mulai *\/\r\n\r\n                    let startTime = null;\r\n\r\n\r\n                    \/*\r\n                     * Durasi animasi\r\n                     *\r\n                     * 6000 = 6 detik\r\n                     *\r\n                     * Semakin besar angka,\r\n                     * semakin lambat animasi.\r\n                     *\/\r\n\r\n                    const duration = 6000;\r\n\r\n\r\n                    \/* =====================================\r\n                       ANIMASI ANGKA\r\n                       ===================================== *\/\r\n\r\n                    function animate(timestamp) {\r\n\r\n\r\n                        \/* Tentukan waktu awal *\/\r\n\r\n                        if (!startTime) {\r\n\r\n                            startTime =\r\n                                timestamp;\r\n\r\n                        }\r\n\r\n\r\n                        \/* Hitung progress *\/\r\n\r\n                        const progress =\r\n                            Math.min(\r\n                                (\r\n                                    timestamp -\r\n                                    startTime\r\n                                ) \/ duration,\r\n                                1\r\n                            );\r\n\r\n\r\n                        \/*\r\n                         * Ease Out\r\n                         *\r\n                         * Membuat gerakan\r\n                         * menjadi sangat smooth.\r\n                         *\/\r\n\r\n                        const easeOut =\r\n                            1 -\r\n                            Math.pow(\r\n                                1 - progress,\r\n                                3\r\n                            );\r\n\r\n\r\n                        \/* Angka saat ini *\/\r\n\r\n                        const current =\r\n                            Math.floor(\r\n                                easeOut *\r\n                                target\r\n                            );\r\n\r\n\r\n                        \/* Tampilkan angka *\/\r\n\r\n                        counter.textContent =\r\n                            current.toLocaleString(\r\n                                \"id-ID\"\r\n                            );\r\n\r\n\r\n                        \/* Lanjutkan animasi *\/\r\n\r\n                        if (\r\n                            progress < 1\r\n                        ) {\r\n\r\n                            requestAnimationFrame(\r\n                                animate\r\n                            );\r\n\r\n                        }\r\n\r\n                        \/* Pastikan angka akhir tepat *\/\r\n\r\n                        else {\r\n\r\n                            counter.textContent =\r\n                                target.toLocaleString(\r\n                                    \"id-ID\"\r\n                                );\r\n\r\n                        }\r\n\r\n                    }\r\n\r\n\r\n                    \/* Jalankan animasi *\/\r\n\r\n                    requestAnimationFrame(\r\n                        animate\r\n                    );\r\n\r\n                }\r\n            );\r\n\r\n        }\r\n\r\n\r\n        \/* =================================================\r\n           DETEKSI SAAT STATISTIK MASUK LAYAR\r\n           ================================================= *\/\r\n\r\n        const observer =\r\n            new IntersectionObserver(\r\n\r\n                function (entries) {\r\n\r\n\r\n                    entries.forEach(\r\n                        entry => {\r\n\r\n\r\n                            \/*\r\n                             * Animasi dimulai ketika\r\n                             * 35% bagian statistik\r\n                             * sudah terlihat.\r\n                             *\/\r\n\r\n                            if (\r\n                                entry.isIntersecting\r\n                            ) {\r\n\r\n                                mulaiCounter();\r\n\r\n                            }\r\n\r\n                        }\r\n                    );\r\n\r\n                },\r\n\r\n                {\r\n\r\n                    threshold: 0.35\r\n\r\n                }\r\n\r\n            );\r\n\r\n\r\n        \/* Jalankan observer *\/\r\n\r\n        if (statistikSection) {\r\n\r\n            observer.observe(\r\n                statistikSection\r\n            );\r\n\r\n        }\r\n\r\n    }\r\n);\r\n\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-1a731a0 e-flex e-con-boxed e-con e-parent\" data-id=\"1a731a0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3f6e74f elementor-widget elementor-widget-html\" data-id=\"3f6e74f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* =====================================================\r\n   VISI & MISI KELURAHAN SALUBATTANG\r\n   Untuk Elementor - Widget HTML\r\n   ===================================================== *\/\r\n\r\n.salubattang-visimisi {\r\n    width: 100%;\r\n    padding: 80px 5%;\r\n    box-sizing: border-box;\r\n    background: #ffffff;\r\n    font-family: Arial, Helvetica, sans-serif;\r\n    position: relative;\r\n    overflow: hidden;\r\n}\r\n\r\n\/* Dekorasi bagian atas *\/\r\n.salubattang-visimisi::before {\r\n    content: \"\";\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 8px;\r\n    background: linear-gradient(\r\n        90deg,\r\n        #006b4f,\r\n        #00a878,\r\n        #d9a441\r\n    );\r\n}\r\n\r\n\/* ==============================\r\n   HEADER\r\n   ============================== *\/\r\n\r\n.vm-header {\r\n    text-align: center;\r\n    margin-bottom: 55px;\r\n}\r\n\r\n.vm-header .vm-small-title {\r\n    color: #d09b2e;\r\n    font-size: 16px;\r\n    font-weight: 700;\r\n    letter-spacing: 2px;\r\n    text-transform: uppercase;\r\n    margin-bottom: 10px;\r\n}\r\n\r\n.vm-header h2 {\r\n    margin: 0;\r\n    color: #075c46;\r\n    font-size: 45px;\r\n    font-weight: 800;\r\n    line-height: 1.2;\r\n}\r\n\r\n.vm-header p {\r\n    margin: 15px auto 0;\r\n    max-width: 750px;\r\n    color: #667085;\r\n    font-size: 18px;\r\n    line-height: 1.7;\r\n}\r\n\r\n\/* Garis dekorasi *\/\r\n.vm-line {\r\n    width: 90px;\r\n    height: 4px;\r\n    background: #d9a441;\r\n    border-radius: 20px;\r\n    margin: 20px auto 0;\r\n}\r\n\r\n\r\n\/* ==============================\r\n   CONTAINER VISI MISI\r\n   ============================== *\/\r\n\r\n.vm-container {\r\n    max-width: 1200px;\r\n    margin: auto;\r\n    display: grid;\r\n    grid-template-columns: 0.9fr 1.1fr;\r\n    gap: 30px;\r\n    align-items: stretch;\r\n}\r\n\r\n\r\n\/* ==============================\r\n   KARTU UMUM\r\n   ============================== *\/\r\n\r\n.vm-card {\r\n    background: #ffffff;\r\n    border: 1px solid #dce9e3;\r\n    border-radius: 22px;\r\n    padding: 40px;\r\n    box-sizing: border-box;\r\n    box-shadow: 0 10px 30px rgba(0, 70, 50, 0.08);\r\n    position: relative;\r\n    overflow: hidden;\r\n}\r\n\r\n.vm-card::before {\r\n    content: \"\";\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 5px;\r\n    background: linear-gradient(\r\n        90deg,\r\n        #006b4f,\r\n        #00a878,\r\n        #d9a441\r\n    );\r\n}\r\n\r\n\r\n\/* ==============================\r\n   JUDUL KARTU\r\n   ============================== *\/\r\n\r\n.vm-card-title {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 15px;\r\n    margin-bottom: 30px;\r\n}\r\n\r\n.vm-icon {\r\n    width: 58px;\r\n    height: 58px;\r\n    min-width: 58px;\r\n    border-radius: 50%;\r\n    background: #087857;\r\n    color: #ffffff;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    font-size: 27px;\r\n    box-shadow: 0 6px 15px rgba(0, 105, 75, 0.2);\r\n}\r\n\r\n.vm-card-title h3 {\r\n    margin: 0;\r\n    color: #075c46;\r\n    font-size: 27px;\r\n    font-weight: 700;\r\n}\r\n\r\n\r\n\/* ==============================\r\n   VISI\r\n   ============================== *\/\r\n\r\n.vm-visi-text {\r\n    position: relative;\r\n    padding: 10px 5px 10px 20px;\r\n}\r\n\r\n.vm-visi-text::before {\r\n    content: \"\u201c\";\r\n    position: absolute;\r\n    left: -5px;\r\n    top: -25px;\r\n    font-size: 80px;\r\n    color: #dcefe7;\r\n    font-family: Georgia, serif;\r\n    font-weight: bold;\r\n}\r\n\r\n.vm-visi-text p {\r\n    position: relative;\r\n    margin: 0;\r\n    color: #164e3f;\r\n    font-size: 23px;\r\n    font-weight: 600;\r\n    line-height: 1.7;\r\n}\r\n\r\n\r\n\/* ==============================\r\n   SLOGAN\r\n   ============================== *\/\r\n\r\n.vm-slogan {\r\n    margin-top: 35px;\r\n    padding: 18px 20px;\r\n    border-radius: 12px;\r\n    background: #f5faf7;\r\n    border-left: 5px solid #d9a441;\r\n    color: #075c46;\r\n    font-size: 16px;\r\n    font-weight: 700;\r\n    text-align: center;\r\n    line-height: 1.5;\r\n}\r\n\r\n\r\n\/* ==============================\r\n   MISI\r\n   ============================== *\/\r\n\r\n.vm-misi-list {\r\n    margin: 0;\r\n    padding: 0;\r\n    list-style: none;\r\n}\r\n\r\n.vm-misi-item {\r\n    display: flex;\r\n    align-items: flex-start;\r\n    gap: 15px;\r\n    padding: 16px 0;\r\n    border-bottom: 1px dashed #d7e5df;\r\n}\r\n\r\n.vm-misi-item:last-child {\r\n    border-bottom: none;\r\n}\r\n\r\n.vm-number {\r\n    width: 38px;\r\n    height: 38px;\r\n    min-width: 38px;\r\n    border-radius: 50%;\r\n    background: #e7f5ef;\r\n    color: #087857;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    font-size: 16px;\r\n    font-weight: 700;\r\n}\r\n\r\n.vm-misi-item p {\r\n    margin: 0;\r\n    color: #344054;\r\n    font-size: 16px;\r\n    line-height: 1.6;\r\n}\r\n\r\n\r\n\/* ==============================\r\n   KOMITMEN\r\n   ============================== *\/\r\n\r\n.vm-komitmen {\r\n    max-width: 1200px;\r\n    margin: 40px auto 0;\r\n    padding: 25px 35px;\r\n    background: linear-gradient(\r\n        135deg,\r\n        #edf8f3,\r\n        #f9fcfa\r\n    );\r\n    border: 1px solid #cfe8dc;\r\n    border-radius: 18px;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 20px;\r\n}\r\n\r\n.vm-komitmen-icon {\r\n    width: 55px;\r\n    height: 55px;\r\n    min-width: 55px;\r\n    border-radius: 50%;\r\n    background: #087857;\r\n    color: white;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    font-size: 25px;\r\n}\r\n\r\n.vm-komitmen p {\r\n    margin: 0;\r\n    color: #245849;\r\n    font-size: 16px;\r\n    line-height: 1.7;\r\n}\r\n\r\n\r\n\/* ==============================\r\n   HOVER EFFECT\r\n   ============================== *\/\r\n\r\n.vm-card {\r\n    transition: all 0.3s ease;\r\n}\r\n\r\n.vm-card:hover {\r\n    transform: translateY(-5px);\r\n    box-shadow: 0 15px 35px rgba(0, 70, 50, 0.13);\r\n}\r\n\r\n\r\n\/* ==============================\r\n   TABLET\r\n   ============================== *\/\r\n\r\n@media (max-width: 900px) {\r\n\r\n    .salubattang-visimisi {\r\n        padding: 65px 4%;\r\n    }\r\n\r\n    .vm-header h2 {\r\n        font-size: 38px;\r\n    }\r\n\r\n    .vm-container {\r\n        grid-template-columns: 1fr;\r\n    }\r\n\r\n    .vm-card {\r\n        padding: 35px;\r\n    }\r\n\r\n    .vm-visi-text p {\r\n        font-size: 21px;\r\n    }\r\n}\r\n\r\n\r\n\/* ==============================\r\n   HP\r\n   ============================== *\/\r\n\r\n@media (max-width: 600px) {\r\n\r\n    .salubattang-visimisi {\r\n        padding: 50px 18px;\r\n    }\r\n\r\n    .vm-header {\r\n        margin-bottom: 35px;\r\n    }\r\n\r\n    .vm-header .vm-small-title {\r\n        font-size: 13px;\r\n    }\r\n\r\n    .vm-header h2 {\r\n        font-size: 30px;\r\n    }\r\n\r\n    .vm-header p {\r\n        font-size: 15px;\r\n    }\r\n\r\n    .vm-card {\r\n        padding: 25px 20px;\r\n        border-radius: 17px;\r\n    }\r\n\r\n    .vm-card-title {\r\n        gap: 12px;\r\n        margin-bottom: 25px;\r\n    }\r\n\r\n    .vm-icon {\r\n        width: 48px;\r\n        height: 48px;\r\n        min-width: 48px;\r\n        font-size: 22px;\r\n    }\r\n\r\n    .vm-card-title h3 {\r\n        font-size: 23px;\r\n    }\r\n\r\n    .vm-visi-text p {\r\n        font-size: 18px;\r\n        line-height: 1.6;\r\n    }\r\n\r\n    .vm-misi-item {\r\n        gap: 12px;\r\n        padding: 13px 0;\r\n    }\r\n\r\n    .vm-number {\r\n        width: 34px;\r\n        height: 34px;\r\n        min-width: 34px;\r\n    }\r\n\r\n    .vm-misi-item p {\r\n        font-size: 14px;\r\n    }\r\n\r\n    .vm-komitmen {\r\n        padding: 20px;\r\n        align-items: flex-start;\r\n    }\r\n\r\n    .vm-komitmen-icon {\r\n        width: 45px;\r\n        height: 45px;\r\n        min-width: 45px;\r\n        font-size: 20px;\r\n    }\r\n\r\n    .vm-komitmen p {\r\n        font-size: 14px;\r\n    }\r\n}\r\n<\/style>\r\n\r\n\r\n<!-- =====================================================\r\n     VISI & MISI KELURAHAN SALUBATTANG\r\n     ===================================================== -->\r\n\r\n<section class=\"salubattang-visimisi\">\r\n\r\n    <!-- HEADER -->\r\n    <div class=\"vm-header\">\r\n\r\n        <div class=\"vm-small-title\">\r\n            Kelurahan Salubattang\r\n        <\/div>\r\n\r\n        <h2>\r\n            Visi &amp; Misi\r\n        <\/h2>\r\n\r\n        <p>\r\n            Arah pembangunan dan pelayanan Kelurahan Salubattang\r\n            dalam mewujudkan masyarakat yang maju dan sejahtera.\r\n        <\/p>\r\n\r\n        <div class=\"vm-line\"><\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- VISI & MISI -->\r\n    <div class=\"vm-container\">\r\n\r\n\r\n        <!-- ================= VISI ================= -->\r\n\r\n        <div class=\"vm-card\">\r\n\r\n            <div class=\"vm-card-title\">\r\n\r\n                <div class=\"vm-icon\">\r\n                    \ud83d\udc41\r\n                <\/div>\r\n\r\n                <h3>\r\n                    Visi\r\n                <\/h3>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div class=\"vm-visi-text\">\r\n\r\n                <p>\r\n                    Terwujudnya Kelurahan Salubattang yang\r\n                    maju, mandiri, berdaya saing, dan berbudaya\r\n                    dalam pelayanan kepada masyarakat.\r\n                <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div class=\"vm-slogan\">\r\n\r\n                \u201cLahan Subur, Warga Tangguh,\r\n                Salubattang Bertumbuh\u201d\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n\r\n        <!-- ================= MISI ================= -->\r\n\r\n        <div class=\"vm-card\">\r\n\r\n            <div class=\"vm-card-title\">\r\n\r\n                <div class=\"vm-icon\">\r\n                    \ud83c\udfaf\r\n                <\/div>\r\n\r\n                <h3>\r\n                    Misi\r\n                <\/h3>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div class=\"vm-misi-list\">\r\n\r\n\r\n                <!-- MISI 1 -->\r\n                <div class=\"vm-misi-item\">\r\n\r\n                    <div class=\"vm-number\">\r\n                        1\r\n                    <\/div>\r\n\r\n                    <p>\r\n                        Meningkatkan kualitas pelayanan publik\r\n                        yang cepat, tepat, transparan, dan akuntabel.\r\n                    <\/p>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- MISI 2 -->\r\n                <div class=\"vm-misi-item\">\r\n\r\n                    <div class=\"vm-number\">\r\n                        2\r\n                    <\/div>\r\n\r\n                    <p>\r\n                        Meningkatkan pemberdayaan masyarakat\r\n                        melalui partisipasi aktif dan semangat\r\n                        gotong royong.\r\n                    <\/p>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- MISI 3 -->\r\n                <div class=\"vm-misi-item\">\r\n\r\n                    <div class=\"vm-number\">\r\n                        3\r\n                    <\/div>\r\n\r\n                    <p>\r\n                        Meningkatkan pembangunan infrastruktur\r\n                        dan lingkungan yang berkelanjutan.\r\n                    <\/p>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- MISI 4 -->\r\n                <div class=\"vm-misi-item\">\r\n\r\n                    <div class=\"vm-number\">\r\n                        4\r\n                    <\/div>\r\n\r\n                    <p>\r\n                        Meningkatkan kualitas sumber daya manusia\r\n                        yang berpendidikan, sehat, dan berakhlak mulia.\r\n                    <\/p>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- MISI 5 -->\r\n                <div class=\"vm-misi-item\">\r\n\r\n                    <div class=\"vm-number\">\r\n                        5\r\n                    <\/div>\r\n\r\n                    <p>\r\n                        Mewujudkan tata kelola pemerintahan kelurahan\r\n                        yang baik, bersih, dan bebas dari korupsi.\r\n                    <\/p>\r\n\r\n                <\/div>\r\n\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n    <!-- ================= KOMITMEN ================= -->\r\n\r\n    <div class=\"vm-komitmen\">\r\n\r\n        <div class=\"vm-komitmen-icon\">\r\n            \ud83d\udc65\r\n        <\/div>\r\n\r\n        <p>\r\n            Bersama seluruh elemen masyarakat, Kelurahan\r\n            Salubattang berkomitmen untuk mewujudkan lingkungan\r\n            yang aman, nyaman, sejahtera, dan harmonis bagi\r\n            seluruh warga.\r\n        <\/p>\r\n\r\n    <\/div>\r\n\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Selamat Datang di Website Kelurahan Salubattang &#8220;Lahan Subur, Warga Tangguh, Salubattang Bertumbuh&#8221; Kontak Kami \u2192 Dirancang oleh KKN-T PERIODE 2 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-10","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/kelurahansalubattang.homeit.my.id\/index.php?rest_route=\/wp\/v2\/pages\/10","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kelurahansalubattang.homeit.my.id\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/kelurahansalubattang.homeit.my.id\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/kelurahansalubattang.homeit.my.id\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kelurahansalubattang.homeit.my.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=10"}],"version-history":[{"count":65,"href":"https:\/\/kelurahansalubattang.homeit.my.id\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions"}],"predecessor-version":[{"id":224,"href":"https:\/\/kelurahansalubattang.homeit.my.id\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions\/224"}],"wp:attachment":[{"href":"https:\/\/kelurahansalubattang.homeit.my.id\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=10"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}