{"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-31T13:51:31","modified_gmt":"2026-08-31T13:51:31","slug":"fasilitas","status":"publish","type":"page","link":"https:\/\/smpitpermata.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 BIRU #28565d\r\n     + LIGHTBOX untuk detail lengkap\r\n     Mendukung multi-instance & fallback gambar\r\n     Warna: #28565d\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.slider-card:hover {\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);\r\n}\r\n\r\n\/* --- SLIDE TENGAH (AKTIF) : background #28565d --- *\/\r\n.slick-center .slider-card {\r\n    background-color: #28565d;\r\n    box-shadow: 0 8px 30px rgba(40, 86, 93, 0.35);\r\n}\r\n\r\n.slick-center .slider-card .card-content {\r\n    background-color: #28565d;\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: #f0f8ff;\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 #28565d --- *\/\r\n.slider-card:hover {\r\n    background-color: #28565d !important;\r\n    box-shadow: 0 8px 30px rgba(40, 86, 93, 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: #28565d !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: #f0f8ff !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 #28565d --- *\/\r\n.horizontal-slider .slick-prev,\r\n.horizontal-slider .slick-next {\r\n    width: 48px;\r\n    height: 48px;\r\n    background: #28565d !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(40, 86, 93, 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: #1E4045 !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 BIRU #28565d\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    padding: 20px;\r\n    box-sizing: border-box;\r\n    animation: lightboxFadeIn 0.3s ease;\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: 700px;\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(40, 86, 93, 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: #28565d;\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(40, 86, 93, 0.4);\r\n}\r\n\r\n.lightbox-close:hover {\r\n    background: #1E4045;\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\/* ===== GAMBAR TIDAK TERPOTONG ===== *\/\r\n.lightbox-image-wrapper {\r\n    width: 100%;\r\n    height: 280px;\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;\r\n    display: block;\r\n    background: #0a0a0a;\r\n}\r\n\r\n.lightbox-info {\r\n    padding: 28px 32px 32px;\r\n    background: #ffffff;\r\n    border-radius: 0 0 24px 24px;\r\n}\r\n\r\n.lightbox-title {\r\n    font-size: 26px;\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: #28565d;\r\n}\r\n\r\n.lightbox-description {\r\n    font-size: 16px;\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: 200px;\r\n    }\r\n    .lightbox-info {\r\n        padding: 20px 20px 24px;\r\n    }\r\n    .lightbox-title {\r\n        font-size: 20px;\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: 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: 160px;\r\n    }\r\n    .lightbox-info {\r\n        padding: 16px 16px 20px;\r\n    }\r\n    .lightbox-title {\r\n        font-size: 18px;\r\n    }\r\n    .lightbox-description {\r\n        font-size: 13px;\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 DATA SLIDER - FASILITAS SMPIT PERMATA\r\n           Warna: #28565d\r\n           ===========================================================\r\n           \u2605 Ganti URL gambar dengan URL dari Media Library kamu\r\n           \u2605 Ganti title dan description sesuai keinginan\r\n           =========================================================== *\/\r\n\r\n        var sliderData = [\r\n            {\r\n                title: \"Kantin\",\r\n                description: \"Kantin sehat dengan menu bergizi dan beragam pilihan makanan serta minuman yang terjaga kebersihan dan kualitasnya. Menyediakan makanan ringan hingga makan siang untuk memenuhi kebutuhan nutrisi siswa selama berada di sekolah.\",\r\n                image: \"https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-27-at-11.06.21-1.jpeg\"\r\n            },\r\n            {\r\n                title: \"Perpustakaan\",\r\n                description: \"Pusat literasi dengan koleksi buku yang lengkap dan beragam, mulai dari buku pelajaran, novel, hingga ensiklopedia. Ruang baca yang nyaman dan program gemar membaca untuk meningkatkan wawasan serta minat baca siswa.\",\r\n                image: \"https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-27-at-10.56.07-1.jpeg\"\r\n            },\r\n            {\r\n                title: \"Lab Komputer\",\r\n                description: \"Fasilitas teknologi modern dengan komputer spesifikasi terbaru, akses internet cepat, dan software edukatif yang mendukung pembelajaran. Bekal keterampilan digital untuk menghadapi era industri 4.0.\",\r\n                image: \"https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/TKA-SMPIT-Permata-2.jpeg\"\r\n            },\r\n            {\r\n                title: \"Lab IPA\",\r\n                description: \"Ruang praktikum sains yang lengkap dengan alat-alat eksperimen untuk pembelajaran Fisika, Kimia, dan Biologi secara langsung. Siswa dapat melakukan percobaan ilmiah yang menyenangkan dan interaktif.\",\r\n                image: \"https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-27-at-11.04.11.jpeg\"\r\n            },\r\n            {\r\n                title: \"Permata Mart\",\r\n                description: \"Toko sekolah yang menyediakan berbagai kebutuhan siswa seperti alat tulis, seragam, perlengkapan sekolah, dan camilan sehat. Memudahkan siswa dan orang tua dalam memenuhi kebutuhan belajar.\",\r\n                image: \"https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-27-at-10.56.06-1.jpeg\"\r\n            },\r\n            {\r\n                title: \"Sport Center (GOR)\",\r\n                description: \"Ruang olahraga indoor yang luas dan modern untuk berbagai kegiatan fisik seperti basket, voli, bulu tangkis, senam, dan futsal. Mendukung pengembangan bakat olahraga dan gaya hidup sehat siswa.\",\r\n                image: \"https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/WhatsApp-Image-2026-08-27-at-10.56.05.jpeg\"\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\/28565d\/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-f5d0b9f e-con e-atomic-element e-flexbox-base e-f5d0b9f-daa7fe0 \" data-id=\"f5d0b9f\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"f5d0b9f\">\n    <section class=\"elementor-element elementor-element-f7da7c7 e-con e-atomic-element e-flexbox-base e-f7da7c7-29396f0 \" data-id=\"f7da7c7\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"f7da7c7\">\n    <div class=\"elementor-element elementor-element-f884e42 e-con e-atomic-element e-flexbox-base e-f884e42-37e3d22 \" data-id=\"f884e42\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"f884e42\">\n    \t\t<div class=\"elementor-element elementor-element-b398448 elementor-widget elementor-widget-image\" data-id=\"b398448\" 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=\"286\" height=\"300\" src=\"https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-Aug-31-2026-08_42_52-PM-286x300.png\" class=\"attachment-medium size-medium wp-image-1195\" alt=\"\" srcset=\"https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-Aug-31-2026-08_42_52-PM-286x300.png 286w, https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-Aug-31-2026-08_42_52-PM-975x1024.png 975w, https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-Aug-31-2026-08_42_52-PM-768x806.png 768w, https:\/\/smpitpermata.sch.id\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-Aug-31-2026-08_42_52-PM.png 1224w\" sizes=\"(max-width: 286px) 100vw, 286px\" \/>\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-8ed20b2 e-con e-atomic-element e-flexbox-base e-8ed20b2-9157811 \" data-id=\"8ed20b2\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"8ed20b2\">\n    \t\t\t<img class=\"e-image-base \" data-interaction-id=\"35d99b0\"\/>\t\t\t\t\t<h1 data-interaction-id=\"0cf7373\" class=\"e-0cf7373-290ece9 e-heading-base\">Wujudkan Prestasi, Mulai di Sini!<\/h1>\n\t\t\t\t<div class=\"elementor-element elementor-element-5d4c889 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"5d4c889\" 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:\/\/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:\/\/smpitpermata.sch.id\/index.php?rest_route=\/wp\/v2\/pages\/100","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/smpitpermata.sch.id\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/smpitpermata.sch.id\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/smpitpermata.sch.id\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/smpitpermata.sch.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=100"}],"version-history":[{"count":58,"href":"https:\/\/smpitpermata.sch.id\/index.php?rest_route=\/wp\/v2\/pages\/100\/revisions"}],"predecessor-version":[{"id":1204,"href":"https:\/\/smpitpermata.sch.id\/index.php?rest_route=\/wp\/v2\/pages\/100\/revisions\/1204"}],"wp:attachment":[{"href":"https:\/\/smpitpermata.sch.id\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=100"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}