{"id":100,"date":"2026-07-23T04:24:52","date_gmt":"2026-07-23T04:24:52","guid":{"rendered":"http:\/\/localhost\/base_wp_unit\/?page_id=100"},"modified":"2026-08-31T04:46:39","modified_gmt":"2026-08-31T04:46:39","slug":"fasilitas","status":"publish","type":"page","link":"https:\/\/preschoolpermata.sch.id\/?page_id=100","title":{"rendered":"Fasilitas"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"100\" class=\"elementor elementor-100\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b560a10 e-con e-atomic-element e-flexbox-base e-7b2aac1 \" data-id=\"b560a10\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"b560a10\">\n    \t\t\t<h2 data-interaction-id=\"1650253\" class=\"e-1650253-1f9c4cb e-heading-base\">Fasilitas<\/h2>\n\t\t\t\t<div class=\"elementor-element elementor-element-6cdc170 elementor-widget elementor-widget-html\" data-id=\"6cdc170\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ==========================================\r\n     SLIDER GALERI HORIZONTAL (INFINITE LOOP)\r\n     Slide tengah aktif: background MERAH, TANPA efek naik\r\n     Mendukung multi-instance & fallback gambar\r\n     Warna: #FF1A1A (MERAH)\r\n     + Lightbox dengan gambar FULL tanpa terpotong\r\n========================================== -->\r\n\r\n<!-- Slick CSS CDN -->\r\n<link rel=\"stylesheet\" type=\"text\/css\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/slick-carousel@1.8.1\/slick\/slick.css\"\/>\r\n<link rel=\"stylesheet\" type=\"text\/css\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/slick-carousel@1.8.1\/slick\/slick-theme.css\"\/>\r\n\r\n<div class=\"permata-slider-container\" data-slider-instance>\r\n\r\n    <!-- Skeleton Loading -->\r\n    <div class=\"slider-skeleton\">\r\n        <div class=\"skeleton-card\"><\/div>\r\n        <div class=\"skeleton-card\"><\/div>\r\n        <div class=\"skeleton-card\"><\/div>\r\n        <div class=\"skeleton-card\"><\/div>\r\n    <\/div>\r\n\r\n    <!-- Slick Horizontal Slider -->\r\n    <div class=\"slider-content-wrapper\" style=\"display: none;\">\r\n        <div class=\"horizontal-slider js-horizontal-gallery-slider\">\r\n            <!-- Item Slider akan diisi lewat JS -->\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <!-- ===== LIGHTBOX \/ MODAL ===== -->\r\n    <div class=\"lightbox-overlay\" id=\"facilityLightbox\">\r\n        <div class=\"lightbox-content\">\r\n            <button class=\"lightbox-close\" id=\"lightboxClose\">&times;<\/button>\r\n            <div class=\"lightbox-body\">\r\n                <div class=\"lightbox-image-wrapper\">\r\n                    <img decoding=\"async\" id=\"lightboxImage\" src=\"\" alt=\"Detail Fasilitas\" \/>\r\n                <\/div>\r\n                <div class=\"lightbox-info\">\r\n                    <h2 id=\"lightboxTitle\" class=\"lightbox-title\"><\/h2>\r\n                    <p id=\"lightboxDescription\" class=\"lightbox-description\"><\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n<style>\r\n\/* --- Container Utama --- *\/\r\n.permata-slider-container {\r\n    max-width: 1350px;\r\n    margin: 0 auto;\r\n    padding: 40px 25px;\r\n    position: relative;\r\n    font-family: 'Poppins', 'Inter', sans-serif;\r\n}\r\n\r\n\/* Flex layout mendatar & jarak antar slide *\/\r\n.horizontal-slider .slick-track {\r\n    display: flex !important;\r\n    align-items: stretch;\r\n}\r\n\r\n.horizontal-slider .slick-slide {\r\n    height: auto;\r\n    padding: 0 12px;\r\n    outline: none;\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n\/* --- Gallery Card --- *\/\r\n.slider-card {\r\n    background: #ffffff;\r\n    border-radius: 20px;\r\n    overflow: hidden;\r\n    text-align: left;\r\n    transition: background-color 0.5s ease,\r\n                box-shadow 0.5s ease,\r\n                transform 0.3s ease;\r\n    cursor: pointer;\r\n    height: 100%;\r\n    display: flex;\r\n    flex-direction: column;\r\n    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);\r\n    will-change: background-color;\r\n}\r\n\r\n\/* --- SLIDE TENGAH (AKTIF) : background MERAH #FF1A1A --- *\/\r\n.slick-center .slider-card {\r\n    background-color: #FF1A1A;\r\n    box-shadow: 0 8px 30px rgba(255, 26, 26, 0.35);\r\n}\r\n\r\n.slick-center .slider-card .card-content {\r\n    background-color: #FF1A1A;\r\n}\r\n\r\n.slick-center .slider-card .card-title {\r\n    color: #ffffff;\r\n}\r\n\r\n.slick-center .slider-card .card-description {\r\n    color: #fff0f0;\r\n}\r\n\r\n.slick-center .slider-card .image-wrapper img {\r\n    transform: scale(1.03);\r\n}\r\n\r\n\/* --- EFEK HOVER WARNA #FF1A1A (MERAH) --- *\/\r\n.slider-card:hover {\r\n    background-color: #FF1A1A !important;\r\n    box-shadow: 0 8px 30px rgba(255, 26, 26, 0.35) !important;\r\n    transition: background-color 0.3s ease,\r\n                box-shadow 0.3s ease,\r\n                transform 0.3s ease;\r\n    transform: translateY(-4px);\r\n}\r\n\r\n.slider-card:hover .card-content {\r\n    background-color: #FF1A1A !important;\r\n}\r\n\r\n.slider-card:hover .card-title {\r\n    color: #ffffff !important;\r\n}\r\n\r\n.slider-card:hover .card-description {\r\n    color: #fff0f0 !important;\r\n}\r\n\r\n.slider-card:hover .image-wrapper img {\r\n    transform: scale(1.05);\r\n}\r\n\r\n\/* --- Image Wrapper --- *\/\r\n.image-wrapper {\r\n    position: relative;\r\n    width: 100%;\r\n    height: 210px;\r\n    border-radius: 20px 20px 0 0;\r\n    overflow: hidden;\r\n    background: #eef2f3;\r\n    flex-shrink: 0;\r\n}\r\n\r\n.image-wrapper img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    transition: transform 0.6s ease;\r\n    border-radius: 20px 20px 0 0;\r\n    display: block;\r\n}\r\n\r\n\/* --- Card Content (Judul + Deskripsi) --- *\/\r\n.card-content {\r\n    padding: 16px 18px 20px 18px;\r\n    flex: 1;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: flex-start;\r\n    transition: background-color 0.5s ease;\r\n    border-radius: 0 0 20px 20px;\r\n    background-color: #ffffff;\r\n}\r\n\r\n.card-title {\r\n    font-size: 18px;\r\n    font-weight: 700;\r\n    color: #243746;\r\n    line-height: 1.3;\r\n    margin: 0 0 6px 0;\r\n    transition: color 0.3s ease;\r\n    white-space: nowrap;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n}\r\n\r\n.card-description {\r\n    font-size: 14px;\r\n    font-weight: 400;\r\n    color: #5a6f7e;\r\n    line-height: 1.5;\r\n    margin: 0;\r\n    transition: color 0.3s ease;\r\n    display: -webkit-box;\r\n    -webkit-line-clamp: 2;\r\n    -webkit-box-orient: vertical;\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n}\r\n\r\n\/* --- Tombol Panah Navigasi (Arrows) - WARNA MERAH #FF1A1A --- *\/\r\n.horizontal-slider .slick-prev,\r\n.horizontal-slider .slick-next {\r\n    width: 48px;\r\n    height: 48px;\r\n    background: #FF1A1A !important;\r\n    border-radius: 50%;\r\n    z-index: 20;\r\n    transition: all 0.3s ease;\r\n    box-shadow: 0 6px 16px rgba(255, 26, 26, 0.40);\r\n}\r\n\r\n.horizontal-slider .slick-prev:before,\r\n.horizontal-slider .slick-next:before {\r\n    font-size: 18px;\r\n    color: #ffffff;\r\n    opacity: 1;\r\n    font-family: sans-serif;\r\n    line-height: 48px;\r\n    display: block;\r\n}\r\n\r\n.horizontal-slider .slick-prev:hover,\r\n.horizontal-slider .slick-next:hover {\r\n    background: #CC0000 !important;\r\n    transform: scale(1.1);\r\n}\r\n\r\n.horizontal-slider .slick-prev { left: -22px; }\r\n.horizontal-slider .slick-next { right: -22px; }\r\n\r\n.horizontal-slider .slick-prev:before { content: '\u276e'; }\r\n.horizontal-slider .slick-next:before { content: '\u276f'; }\r\n\r\n\/* --- Skeleton Loading --- *\/\r\n.slider-skeleton {\r\n    display: flex;\r\n    gap: 24px;\r\n    overflow: hidden;\r\n}\r\n\r\n.skeleton-card {\r\n    flex: 1;\r\n    min-width: 200px;\r\n    height: 280px;\r\n    border-radius: 20px;\r\n    background: linear-gradient(90deg, #eee 25%, #f7f7f7 37%, #eee 63%);\r\n    background-size: 400% 100%;\r\n    animation: skeleton-shimmer 1.4s infinite;\r\n}\r\n\r\n@keyframes skeleton-shimmer {\r\n    0% { background-position: 100% 0; }\r\n    100% { background-position: -100% 0; }\r\n}\r\n\r\n\/* ==========================================\r\n   LIGHTBOX \/ MODAL STYLES - TEMA MERAH\r\n   GAMBAR FULL TANPA TERPOTONG\r\n========================================== *\/\r\n.lightbox-overlay {\r\n    display: none;\r\n    position: fixed;\r\n    top: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    background: rgba(0, 0, 0, 0.85);\r\n    z-index: 9999;\r\n    justify-content: center;\r\n    align-items: center;\r\n    animation: lightboxFadeIn 0.3s ease;\r\n    padding: 20px;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.lightbox-overlay.active {\r\n    display: flex;\r\n}\r\n\r\n@keyframes lightboxFadeIn {\r\n    from { opacity: 0; }\r\n    to { opacity: 1; }\r\n}\r\n\r\n.lightbox-content {\r\n    background: #ffffff;\r\n    border-radius: 24px;\r\n    max-width: 900px;\r\n    width: 100%;\r\n    max-height: 90vh;\r\n    overflow-y: auto;\r\n    position: relative;\r\n    box-shadow: 0 20px 60px rgba(255, 26, 26, 0.3);\r\n    animation: lightboxSlideUp 0.4s ease;\r\n}\r\n\r\n@keyframes lightboxSlideUp {\r\n    from {\r\n        opacity: 0;\r\n        transform: translateY(40px) scale(0.95);\r\n    }\r\n    to {\r\n        opacity: 1;\r\n        transform: translateY(0) scale(1);\r\n    }\r\n}\r\n\r\n.lightbox-close {\r\n    position: absolute;\r\n    top: 16px;\r\n    right: 20px;\r\n    background: #FF1A1A;\r\n    color: #ffffff;\r\n    border: none;\r\n    border-radius: 50%;\r\n    width: 44px;\r\n    height: 44px;\r\n    font-size: 28px;\r\n    line-height: 44px;\r\n    text-align: center;\r\n    cursor: pointer;\r\n    z-index: 10;\r\n    transition: all 0.3s ease;\r\n    padding: 0;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    box-shadow: 0 4px 12px rgba(255, 26, 26, 0.4);\r\n}\r\n\r\n.lightbox-close:hover {\r\n    background: #CC0000;\r\n    transform: rotate(90deg) scale(1.1);\r\n}\r\n\r\n.lightbox-body {\r\n    display: flex;\r\n    flex-direction: column;\r\n}\r\n\r\n\/* ===== PERBAIKAN: Gambar tidak terpotong ===== *\/\r\n.lightbox-image-wrapper {\r\n    width: 100%;\r\n    height: 380px;\r\n    background: #0a0a0a;\r\n    overflow: hidden;\r\n    border-radius: 24px 24px 0 0;\r\n    flex-shrink: 0;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n}\r\n\r\n.lightbox-image-wrapper img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: contain;  \/* <-- PERUBAHAN: contain agar gambar utuh *\/\r\n    display: block;\r\n    background: #0a0a0a;\r\n}\r\n\r\n\/* --- OPSI ALTERNATIF: Jika ingin gambar full lebar dengan background gelap --- *\/\r\n\/*\r\n.lightbox-image-wrapper img {\r\n    width: 100%;\r\n    height: auto;\r\n    max-height: 100%;\r\n    object-fit: contain;\r\n}\r\n*\/\r\n\r\n.lightbox-info {\r\n    padding: 30px 36px 36px 36px;\r\n    background: #ffffff;\r\n    border-radius: 0 0 24px 24px;\r\n}\r\n\r\n.lightbox-title {\r\n    font-size: 28px;\r\n    font-weight: 700;\r\n    color: #1a2a36;\r\n    margin: 0 0 12px 0;\r\n    line-height: 1.2;\r\n}\r\n\r\n.lightbox-title::before {\r\n    content: \"\u2726 \";\r\n    color: #FF1A1A;\r\n}\r\n\r\n.lightbox-description {\r\n    font-size: 17px;\r\n    font-weight: 400;\r\n    color: #3d5563;\r\n    line-height: 1.8;\r\n    margin: 0;\r\n    white-space: pre-wrap;\r\n    word-wrap: break-word;\r\n}\r\n\r\n\/* --- Responsive Lightbox --- *\/\r\n@media (max-width: 768px) {\r\n    .lightbox-image-wrapper {\r\n        height: 240px;\r\n    }\r\n    .lightbox-info {\r\n        padding: 22px 20px 26px 20px;\r\n    }\r\n    .lightbox-title {\r\n        font-size: 22px;\r\n    }\r\n    .lightbox-description {\r\n        font-size: 15px;\r\n        line-height: 1.6;\r\n    }\r\n    .lightbox-close {\r\n        top: 10px;\r\n        right: 14px;\r\n        width: 38px;\r\n        height: 38px;\r\n        font-size: 22px;\r\n    }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n    .lightbox-image-wrapper {\r\n        height: 200px;\r\n    }\r\n    .lightbox-info {\r\n        padding: 18px 16px 22px 16px;\r\n    }\r\n    .lightbox-title {\r\n        font-size: 19px;\r\n    }\r\n    .lightbox-description {\r\n        font-size: 14px;\r\n        line-height: 1.6;\r\n    }\r\n    .lightbox-close {\r\n        top: 8px;\r\n        right: 10px;\r\n        width: 34px;\r\n        height: 34px;\r\n        font-size: 20px;\r\n    }\r\n}\r\n\r\n\/* --- Responsive Slider --- *\/\r\n@media (max-width: 1024px) {\r\n    .horizontal-slider .slick-prev { left: -10px; }\r\n    .horizontal-slider .slick-next { right: -10px; }\r\n    .image-wrapper { height: 180px; }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .image-wrapper { height: 170px; }\r\n    .card-title { font-size: 16px; }\r\n    .card-description { font-size: 13px; }\r\n}\r\n\r\n@media (max-width: 600px) {\r\n    .image-wrapper { height: 160px; }\r\n    .horizontal-slider .slick-prev { left: 0px; }\r\n    .horizontal-slider .slick-next { right: 0px; }\r\n    .card-content { padding: 12px 14px 16px 14px; }\r\n    .card-title { font-size: 15px; }\r\n    .card-description { font-size: 12px; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n    \/\/ --- Loader script dinamis ---\r\n    function loadScript(src, checkFn) {\r\n        return new Promise(function (resolve, reject) {\r\n            if (checkFn && checkFn()) {\r\n                resolve();\r\n                return;\r\n            }\r\n            var s = document.createElement('script');\r\n            s.src = src;\r\n            s.onload = function () { resolve(); };\r\n            s.onerror = function () { reject(new Error('Gagal memuat script: ' + src)); };\r\n            document.head.appendChild(s);\r\n        });\r\n    }\r\n\r\n    function hasJQuery() {\r\n        return typeof window.jQuery !== 'undefined';\r\n    }\r\n\r\n    function hasSlick() {\r\n        return hasJQuery() && typeof window.jQuery.fn.slick !== 'undefined';\r\n    }\r\n\r\n    function initAllSliders($) {\r\n\r\n        \/* ===========================================================\r\n           \ud83d\udcf7 CARA MENGGANTI GAMBAR:\r\n           ===========================================================\r\n           1. Ganti URL di bagian \"image:\" dengan URL gambar baru\r\n           2. Bisa gunakan gambar dari:\r\n              - WordPress Media Library\r\n              - Upload sendiri ke hosting\r\n              - Placeholder: https:\/\/placehold.co\/800x600\/FF1A1A\/white?text=Judul\r\n           3. Ukuran gambar disarankan 800x600px (rasio 4:3)\r\n           4. Format yang didukung: JPG, PNG, WebP\r\n           =========================================================== *\/\r\n\r\n        var sliderData = [\r\n            {\r\n                title: \"Alat Peraga Edukatif\",\r\n                description: \"Beragam alat peraga edukatif yang dirancang untuk membantu anak belajar melalui bermain, bereksplorasi, dan mengembangkan berbagai kemampuan.\",\r\n                image: \"https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/Alat-Peraga-Edukatif.jpg-scaled.jpeg\"\r\n            },\r\n            {\r\n                title: \"Sudut Baca\",\r\n                description: \"Ruang baca yang nyaman dengan berbagai pilihan buku untuk menumbuhkan minat baca dan memperkaya imajinasi anak.\",\r\n                image: \"https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/Sudut-baca.jpg-1-scaled.jpeg\"\r\n            },\r\n            {\r\n                title: \"Playground\",\r\n                description: \"Area bermain yang aman dan menyenangkan untuk mendukung aktivitas fisik, kreativitas, serta interaksi sosial anak.\",\r\n                image: \"https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/Playground-2.jpg-scaled.jpeg\"\r\n            },\r\n            {\r\n                title: \"Ruang Kelas ber AC\",\r\n                description: \"Ruang kelas yang nyaman dan sejuk dengan suasana belajar yang kondusif agar anak dapat belajar dengan lebih fokus dan menyenangkan.\",\r\n                image: \"https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-10-at-09.59.26.jpeg\"\r\n            }\r\n            \r\n            \/* ===========================================================\r\n               \ud83d\udcdd CARA MENAMBAH SLIDE BARU:\r\n               ===========================================================\r\n               1. Copy-paste blok di bawah ini (termasuk koma di akhir)\r\n               2. Sesuaikan title, description, dan image\r\n               3. Pastikan tidak ada koma berlebih di akhir array\r\n               ===========================================================\r\n               {\r\n                   title: \"Nama Fasilitas Baru\",\r\n                   description: \"Deskripsi fasilitas baru...\",\r\n                   image: \"URL-gambar-baru.jpg\"\r\n               },\r\n            *\/\r\n        ];\r\n\r\n        \/\/ --- Build HTML dengan data attribute untuk lightbox ---\r\n        var itemsHtml = '';\r\n        sliderData.forEach(function (item, index) {\r\n            var desc = item.description.replace(\/\"\/g, '&quot;');\r\n            itemsHtml += '' +\r\n                '<div data-slide-index=\"' + index + '\">' +\r\n                    '<div class=\"slider-card\" data-title=\"' + item.title + '\" data-desc=\"' + desc + '\" data-img=\"' + item.image + '\">' +\r\n                        '<div class=\"image-wrapper\">' +\r\n                            '<img decoding=\"async\" src=\"' + item.image + '\" alt=\"' + item.title + '\" loading=\"lazy\" ' +\r\n                                'onerror=\"this.onerror=null;this.src=\\'https:\/\/placehold.co\/800x600\/FF1A1A\/white?text=Gambar+tidak+tersedia\\';\" \/>' +\r\n                        '<\/div>' +\r\n                        '<div class=\"card-content\">' +\r\n                            '<div class=\"card-title\">' + item.title + '<\/div>' +\r\n                            '<div class=\"card-description\">' + desc + '<\/div>' +\r\n                        '<\/div>' +\r\n                    '<\/div>' +\r\n                '<\/div>';\r\n        });\r\n\r\n        \/\/ --- Inisialisasi setiap instance slider ---\r\n        $('[data-slider-instance] .js-horizontal-gallery-slider').each(function () {\r\n            var $slider = $(this);\r\n\r\n            if ($slider.hasClass('slick-initialized') || $slider.data('slider-inited')) {\r\n                return;\r\n            }\r\n            $slider.data('slider-inited', true);\r\n\r\n            $slider.html(itemsHtml);\r\n\r\n            $slider.closest('.permata-slider-container')\r\n                .find('.slider-skeleton').hide()\r\n                .end()\r\n                .find('.slider-content-wrapper').show();\r\n\r\n            \/\/ --- Konfigurasi Slick dengan centerMode aktif ---\r\n            $slider.slick({\r\n                slidesToShow: 3,\r\n                slidesToScroll: 1,\r\n                infinite: true,\r\n                autoplay: true,\r\n                autoplaySpeed: 3000,\r\n                arrows: true,\r\n                dots: false,\r\n                pauseOnHover: true,\r\n                centerMode: true,\r\n                centerPadding: '60px',\r\n                responsive: [\r\n                    { breakpoint: 1024, settings: { slidesToShow: 3, centerPadding: '40px' } },\r\n                    { breakpoint: 768, settings: { slidesToShow: 2, centerPadding: '30px' } },\r\n                    { breakpoint: 480, settings: { slidesToShow: 1, centerPadding: '20px' } }\r\n                ]\r\n            });\r\n\r\n            \/\/ --- Event click untuk Lightbox ---\r\n            $slider.on('click', '.slider-card', function () {\r\n                var title = $(this).data('title') || 'Detail Fasilitas';\r\n                var desc = $(this).data('desc') || 'Tidak ada deskripsi';\r\n                var img = $(this).data('img') || '';\r\n\r\n                $('#lightboxTitle').text(title);\r\n                $('#lightboxDescription').text(desc);\r\n                $('#lightboxImage').attr('src', img);\r\n\r\n                $('#facilityLightbox').addClass('active');\r\n                $('body').css('overflow', 'hidden');\r\n            });\r\n        });\r\n\r\n        \/\/ --- Lightbox Close Events ---\r\n        $('#lightboxClose').on('click', function () {\r\n            closeLightbox();\r\n        });\r\n\r\n        $('#facilityLightbox').on('click', function (e) {\r\n            if (e.target === this) {\r\n                closeLightbox();\r\n            }\r\n        });\r\n\r\n        $(document).on('keydown', function (e) {\r\n            if (e.key === 'Escape') {\r\n                closeLightbox();\r\n            }\r\n        });\r\n\r\n        function closeLightbox() {\r\n            $('#facilityLightbox').removeClass('active');\r\n            $('body').css('overflow', '');\r\n        }\r\n    }\r\n\r\n    function boot() {\r\n        var jq = window.jQuery;\r\n        jq(document).ready(function ($) {\r\n            initAllSliders($);\r\n        });\r\n    }\r\n\r\n    \/\/ --- Muat jQuery & Slick ---\r\n    loadScript('https:\/\/code.jquery.com\/jquery-3.6.0.min.js', hasJQuery)\r\n        .then(function () {\r\n            return loadScript('https:\/\/cdn.jsdelivr.net\/npm\/slick-carousel@1.8.1\/slick\/slick.min.js', hasSlick);\r\n        })\r\n        .then(boot)\r\n        .catch(function (err) {\r\n            console.error('[Slider Galeri] Gagal inisialisasi:', err);\r\n            var containers = document.querySelectorAll('[data-slider-instance]');\r\n            containers.forEach(function (c) {\r\n                var skeleton = c.querySelector('.slider-skeleton');\r\n                if (skeleton) {\r\n                    skeleton.innerHTML = '<p style=\"width:100%;text-align:center;color:#7a8a94;padding:40px 0;\">Galeri tidak dapat dimuat. Coba muat ulang halaman.<\/p>';\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-bfcf611 e-con e-atomic-element e-flexbox-base e-bfcf611-d8441f0 \" data-id=\"bfcf611\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"bfcf611\">\n    <section class=\"elementor-element elementor-element-414785a e-con e-atomic-element e-flexbox-base e-414785a-da3d760 \" data-id=\"414785a\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"414785a\">\n    <div class=\"elementor-element elementor-element-f9b8c8b e-con e-atomic-element e-flexbox-base e-f9b8c8b-1687ebd \" data-id=\"f9b8c8b\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"f9b8c8b\">\n    \t\t<div class=\"elementor-element elementor-element-efcca2b elementor-widget__width-initial elementor-widget elementor-widget-image\" data-id=\"efcca2b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"300\" height=\"300\" src=\"https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/Tanpa-judul-Konten-Instagram-34-9-300x300.webp\" class=\"attachment-medium size-medium wp-image-1077\" alt=\"\" srcset=\"https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/Tanpa-judul-Konten-Instagram-34-9-300x300.webp 300w, https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/Tanpa-judul-Konten-Instagram-34-9-1024x1024.webp 1024w, https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/Tanpa-judul-Konten-Instagram-34-9-150x150.webp 150w, https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/Tanpa-judul-Konten-Instagram-34-9-768x768.webp 768w, https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/Tanpa-judul-Konten-Instagram-34-9-1536x1536.webp 1536w, https:\/\/preschoolpermata.sch.id\/wp-content\/uploads\/2026\/08\/Tanpa-judul-Konten-Instagram-34-9-2048x2048.webp 2048w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-d7aeee8 e-con e-atomic-element e-flexbox-base e-d7aeee8-b2307b0 \" data-id=\"d7aeee8\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"d7aeee8\">\n    \t\t\t<img class=\"e-image-base \" data-interaction-id=\"092b6b8\"\/>\t\t\t\t\t<h1 data-interaction-id=\"f64a4e8\" class=\"e-f64a4e8-75244bd e-heading-base\">Wujudkan Prestasi, Mulai di Sini!<\/h1>\n\t\t\t\t<div class=\"elementor-element elementor-element-2bc3235 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"2bc3235\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm elementor-animation-grow\" href=\"https:\/\/ppdb.sitpermata.id\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Daftar Sekarang<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\n<\/div>\n\n<\/section>\n\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Fasilitas &times; Wujudkan Prestasi, Mulai di Sini! Daftar Sekarang<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-100","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/preschoolpermata.sch.id\/index.php?rest_route=\/wp\/v2\/pages\/100","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/preschoolpermata.sch.id\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/preschoolpermata.sch.id\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/preschoolpermata.sch.id\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/preschoolpermata.sch.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=100"}],"version-history":[{"count":46,"href":"https:\/\/preschoolpermata.sch.id\/index.php?rest_route=\/wp\/v2\/pages\/100\/revisions"}],"predecessor-version":[{"id":1120,"href":"https:\/\/preschoolpermata.sch.id\/index.php?rest_route=\/wp\/v2\/pages\/100\/revisions\/1120"}],"wp:attachment":[{"href":"https:\/\/preschoolpermata.sch.id\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=100"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}