Akses Terbatas<\/title>\n \n <style>\n \/* Mendefinisikan keyframe untuk animasi 'munculNaik' *\/\n @keyframes munculNaik {\n from {\n opacity: 0;\n transform: translateY(30px); \/* Mulai dari 30px di bawah posisi asli *\/\n }\n to {\n opacity: 1;\n transform: translateY(0); \/* Kembali ke posisi asli *\/\n }\n }\n\n \/* Kelas CSS yang akan memicu animasi *\/\n .animasi-muncul {\n animation: munculNaik 0.8s ease-out; \/* Durasi 0.8 detik *\/\n }\n <\/style>\n<\/head>\n<body>\n\n<div style=\"text-align: center;\">\n <a href=\"javascript:void(0);\" onclick=\"aksesTerbatas()\">\n <img decoding=\"async\" id=\"gambarAkses\" src=\"https:\/\/lh3.googleusercontent.com\/d\/1P3GImhAu-uU9208gtDf0tv2ljfgqOM1R\" alt=\"Deskripsi Gambar\" style=\"max-width: 50%; height: auto; cursor: pointer;\">\n <\/a>\n<\/div>\n\n<script>\n\/\/ Fungsi asli Anda (Tidak diubah)\nfunction aksesTerbatas() {\n \/\/ Memunculkan kotak dialog untuk mengisi password\n var password = prompt(\"Silakan masukkan password untuk mengakses folder:\");\n var passwordBenar = \"spmihi\";\n var linkTujuan = \"https:\/\/drive.google.com\/drive\/folders\/1WfmsHm0suRPy-aREaItApQ3fu69uINQL?usp=sharing\";\n\n if (password === passwordBenar) {\n \/\/ Jika password benar, buka link di tab baru\n window.open(linkTujuan, '_blank');\n } else if (password === null) {\n \/\/ Jika pengguna menekan tombol 'Batal'\n return;\n } else {\n \/\/ Jika password salah\n alert(\"Password salah! Akses ditolak.\");\n }\n}\n\n\/\/ Tambahan JavaScript untuk memicu animasi saat halaman selesai dimuat\nwindow.onload = function() {\n var gambar = document.getElementById('gambarAkses');\n \/\/ Menambahkan kelas animasi ke gambar\n gambar.classList.add('animasi-muncul');\n};\n<\/script>\n\n<\/body>\n<\/html>\n\n\n\n<style>\n \/* --- ANIMASI MUNCUL NAIK --- *\/\n @keyframes fadeInUp {\n from { opacity: 0; transform: translateY(20px); }\n to { opacity: 1; transform: translateY(0); }\n }\n\n .lpm-doc-wrapper {\n display: flex;\n flex-direction: column;\n gap: 12px;\n max-width: 320px; \n margin: 20px auto; \n font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\n }\n\n \/* Container untuk tombol yang punya dropdown *\/\n .menu-container {\n display: flex;\n flex-direction: column;\n transition: all 0.3s ease;\n }\n\n \/* Gaya Dasar Tombol *\/\n .btn-lpm-locked {\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #4472c4; \n color: #ffffff !important;\n padding: 12px 15px;\n text-decoration: none !important;\n border-radius: 6px;\n font-size: 13px;\n font-weight: normal; \n text-align: center;\n transition: all 0.3s ease;\n border: 1px solid #3b63a8;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n cursor: pointer;\n animation: fadeInUp 0.6s ease-out both;\n z-index: 2;\n }\n\n .btn-lpm-locked:hover {\n background-color: #335591;\n }\n\n .btn-lpm-locked::before {\n content: \"\ud83d\udd12\";\n margin-right: 10px;\n font-size: 14px;\n }\n\n \/* --- GAYA LIST AMI (AKORDION) --- *\/\n .ami-list {\n max-height: 0; \n overflow: hidden;\n transition: max-height 0.5s ease-in-out, margin 0.3s ease;\n display: flex;\n flex-direction: column;\n gap: 5px;\n padding: 0 10px;\n background: #f8f9fa;\n border-radius: 0 0 6px 6px;\n }\n\n \/* Munculkan list saat container di-hover *\/\n .menu-container:hover .ami-list {\n max-height: 400px; \n margin-top: 5px;\n margin-bottom: 10px;\n padding: 10px;\n border: 1px dashed #4472c4;\n }\n\n .ami-item {\n background: #ffffff;\n color: #4472c4;\n padding: 8px;\n font-size: 12px;\n border-radius: 4px;\n text-align: center;\n border: 1px solid #ddd;\n cursor: pointer;\n transition: 0.2s;\n }\n\n .ami-item:hover {\n background: #4472c4;\n color: white;\n }\n\n \/* Delay Animasi Tombol Utama *\/\n .btn-delay-1 { animation-delay: 0.1s; }\n .btn-delay-2 { animation-delay: 0.3s; }\n .btn-delay-3 { animation-delay: 0.5s; }\n<\/style>\n\n<div class=\"lpm-doc-wrapper\">\n <div class=\"menu-container btn-delay-1\">\n <div class=\"btn-lpm-locked\">\n Dokumen Audit Mutu Internal\n <\/div>\n <div class=\"ami-list\">\n <div class=\"ami-item\" onclick=\"masukAkses('2025')\">AMI 2025<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2024')\">AMI 2024<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2023')\">AMI 2023<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2022')\">AMI 2022<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2021')\">AMI 2021<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2020')\">AMI 2020<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2019')\">AMI 2019<\/div>\n <\/div>\n <\/div>\n\n <div onclick=\"masukAkses('survei')\" class=\"btn-lpm-locked btn-delay-2\">\n Survei Kepuasan\n <\/div>\n\n <div onclick=\"masukAkses('monev')\" class=\"btn-lpm-locked btn-delay-3\">\n Dokumen Monitoring dan Evaluasi\n <\/div>\n<\/div>\n\n<script>\n function masukAkses(tahun) {\n var label;\n \/\/ Penyesuaian variabel survei\n if (tahun === 'survei') label = \"Survei Kepuasan\";\n else if (tahun === 'monev') label = \"Monitoring dan Evaluasi\";\n else label = \"AMI \" + tahun;\n\n var sandi = prompt(\"Dokumen \" + label + \" terbatas. Masukkan Password Akses:\");\n \n if (sandi === \"spmihi\") {\n let targetUrl = \"\";\n\n \/\/ Logika Link Tujuan\n if (tahun === '2025') {\n targetUrl = \"https:\/\/sites.google.com\/view\/amihi2025\";\n } else if (tahun === '2024') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1m2c9NYoY6vlymThw4msN37WaMd9ngeEm?usp=sharing\";\n } else if (tahun === '2023') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/12VLAqL-pLC-dhqHbKQtYP2wZ3DmqOygZ?usp=sharing\";\n } else if (tahun === '2022') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1QdNIaL4mysboRKJePb3q6MOgSuNa5lLD?usp=sharing\";\n } else if (tahun === '2021') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1RVpjX431PqoDFgeaBzO3Y13sGDNubev-?usp=sharing\";\n } else if (tahun === '2020') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1RZhiTWFNDbPSXf6ItQ_9laKE_AwLQmuv?usp=sharing\";\n } else if (tahun === '2019') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1RcFOmNNvaEmckSoXJW3y3G4fxVDYMlDE?usp=sharing\";\n } else if (tahun === 'survei') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1V2UBuu8gGcJjCDIIRIEpgdPNq1mUUh7Z?usp=sharing\";\n } else if (tahun === 'monev') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1WhPGZXS5DqRhTopk7p9JkWGRwoiesurj?usp=sharing\";\n } else {\n targetUrl = \"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-akses-terbatas\/\";\n }\n \n window.location.href = targetUrl;\n } else if (sandi === null || sandi === \"\") {\n return;\n } else {\n alert(\"Password salah! Silakan hubungi administrator.\");\n }\n }\n<\/script>\n\n\n\n<style>\n \/* --- ANIMASI MUNCUL --- *\/\n @keyframes slideInUp {\n from {\n opacity: 0;\n transform: translateY(30px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n :root {\n --blue-primary: #1e3a8a; \/* Deep Navy Blue *\/\n --blue-accent: #3b82f6; \/* Bright Blue for accents *\/\n --blue-soft: #eff6ff; \/* Very Light Azure *\/\n --blue-border: #1e3a8a; \/* Matching header border *\/\n }\n\n .ppepp-eval-mini {\n font-family: 'Inter', 'Segoe UI', -apple-system, sans-serif;\n max-width: 800px;\n margin: 10px auto;\n color: #1e293b;\n font-size: 14px;\n line-height: 1.5;\n animation: slideInUp 0.8s ease-out both;\n }\n\n .eval-card {\n border: 1px solid #e2e8f0;\n border-radius: 12px;\n padding: 24px;\n background: #fff;\n box-shadow: 0 4px 15px rgba(30, 58, 138, 0.08); \/* Soft shadow with blue tint *\/\n transition: all 0.3s ease;\n }\n\n .eval-card:hover {\n box-shadow: 0 10px 25px rgba(30, 58, 138, 0.15);\n transform: translateY(-2px);\n }\n\n .eval-header {\n border-bottom: 2px solid var(--blue-primary);\n color: var(--blue-primary);\n margin-bottom: 15px;\n padding-bottom: 8px;\n text-transform: uppercase;\n font-weight: 800;\n letter-spacing: 1px;\n }\n\n .eval-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n gap: 16px;\n margin-top: 15px;\n }\n\n .eval-item {\n background: var(--blue-soft);\n padding: 15px;\n border-radius: 10px;\n border-left: 5px solid var(--blue-primary);\n transition: transform 0.2s ease;\n }\n\n .eval-item:hover {\n background: #dbeafe; \/* Slightly darker light blue on hover *\/\n transform: scale(1.02);\n }\n\n \/* Warna Teks Biru Tua & Tebal *\/\n .text-blue-bold { \n color: var(--blue-primary); \n font-weight: 800; \n }\n<\/style>\n\n<div class=\"ppepp-eval-mini\">\n <div class=\"eval-card\">\n <div class=\"eval-header\">\ud83d\udd0d Evaluasi (E)<\/div>\n <p>Proses membandingkan <span class=\"text-blue-bold\">Pelaksanaan<\/span> dengan <span class=\"text-blue-bold\">Standar<\/span> untuk mengukur pencapaian mutu dan mengidentifikasi penyimpangan.<\/p>\n\n <div class=\"eval-grid\">\n <div class=\"eval-item\">\n <strong style=\"color: var(--blue-primary);\">Langkah Utama:<\/strong>\n <ul style=\"margin:8px 0 0 0; padding-left:18px; color: #334155;\">\n <li>Monitoring rutin<\/li>\n <li>Audit Mutu Internal (AMI)<\/li>\n <li>Rapat Tinjauan Manajemen<\/li>\n <\/ul>\n <\/div>\n <div class=\"eval-item\">\n <strong style=\"color: var(--blue-primary);\">Instrumen:<\/strong>\n <ul style=\"margin:8px 0 0 0; padding-left:18px; color: #334155;\">\n <li>Daftar Tilik<\/li>\n <li>Laporan Temuan KTS<\/li>\n <li>Survei Kepuasan<\/li>\n <\/ul>\n <\/div>\n <\/div>\n \n <p style=\"margin-top:15px; font-size:13px; color:#64748b; font-style:italic; border-top: 1px dashed #cbd5e1; padding-top: 10px;\">\n *Tanpa Evaluasi, tahap Pengendalian dan Peningkatan tidak memiliki dasar data yang kuat.\n <\/p>\n <\/div>\n<\/div>\n\n\n\n<div class=\"news-slider-container\">\n <div class=\"news-slider\" id=\"newsSlider\">\n <div style=\"padding: 30px; text-align: center; width: 100%; color: #94a3b8; font-size: 12px;\">Memuat berita terbaru…<\/div>\n <\/div>\n\n <div class=\"slider-controls\">\n <button class=\"nav-btn btn-visible\" onclick=\"moveSlide(-1)\" aria-label=\"Previous\">\n <span class=\"nav-symbol\"><<<\/span>\n <\/button>\n \n <div class=\"dots-container\" id=\"dotsContainer\"><\/div>\n \n <button class=\"nav-btn btn-visible\" onclick=\"moveSlide(1)\" aria-label=\"Next\">\n <span class=\"nav-symbol\">>><\/span>\n <\/button>\n <\/div>\n<\/div>\n\n<style>\n .news-slider-container {\n position: relative;\n max-width: 700px;\n margin: 10px auto;\n overflow: hidden;\n border-radius: 12px;\n background: #fff;\n border: 1px solid #e2e8f0;\n font-family: 'Inter', -apple-system, sans-serif;\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);\n }\n\n .news-slider {\n display: flex;\n transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);\n }\n\n .news-slide {\n min-width: 100%;\n display: flex;\n flex-direction: column;\n }\n\n .news-slide img {\n width: 100%;\n height: 300px;\n object-fit: cover;\n background: #f1f5f9;\n }\n\n .news-caption {\n padding: 20px;\n background: #fff;\n }\n\n .news-caption h3 { \n margin: 0 0 8px; \n font-size: 16px; \n line-height: 1.4;\n font-weight: 700;\n color: #1e293b;\n }\n \n .news-caption p { \n margin: 0 0 15px; \n font-size: 13px;\n line-height: 1.6;\n color: #475569;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n }\n\n .read-more {\n display: inline-block;\n padding: 8px 16px;\n background: #1e3a8a; \/* Biru Tua *\/\n color: #fff !important;\n text-decoration: none !important;\n border-radius: 6px;\n font-size: 12px;\n font-weight: 600;\n transition: 0.3s;\n }\n\n .read-more:hover {\n background: #172554;\n box-shadow: 0 4px 12px rgba(30, 58, 138, 0.3);\n }\n\n .slider-controls {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 20px;\n border-top: 1px solid #f1f5f9;\n background: #fcfcfc;\n }\n\n .nav-btn.btn-visible {\n background: #1e3a8a;\n border: none;\n width: 40px;\n height: 36px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border-radius: 8px;\n }\n\n .nav-symbol { color: #ffffff; font-size: 14px; font-weight: bold; }\n\n .dots-container { display: flex; gap: 8px; }\n\n .dot {\n height: 8px; \n width: 8px;\n background-color: #cbd5e1; \n border-radius: 50%;\n cursor: pointer;\n transition: 0.3s;\n }\n\n .dot.active { \n background-color: #1e3a8a;\n width: 20px; \n border-radius: 10px; \n }\n\n @media (max-width: 600px) {\n .news-slide img { height: 200px; }\n .news-caption h3 { font-size: 14px; }\n }\n<\/style>\n\n<script>\n let currentSlide = 0;\n let totalSlides = 0;\n const slider = document.getElementById('newsSlider');\n const dotsContainer = document.getElementById('dotsContainer');\n\n async function fetchNews() {\n try {\n \/\/ UPDATED: categories diubah menjadi 16\n const apiUrl = 'https:\/\/lpm.stikes-hi.ac.id\/wp-json\/wp\/v2\/posts?categories=16&_embed&per_page=5';\n \n const response = await fetch(apiUrl);\n if (!response.ok) throw new Error('Network response was not ok');\n \n const posts = await response.json();\n\n if (posts && posts.length > 0) {\n slider.innerHTML = '';\n dotsContainer.innerHTML = '';\n totalSlides = posts.length;\n\n posts.forEach((post, i) => {\n let imageUrl = 'https:\/\/via.placeholder.com\/800x450\/f1f5f9\/64748b?text=STIKES+HI+JAMBI';\n \n try {\n if (post._embedded && post._embedded['wp:featuredmedia'] && post._embedded['wp:featuredmedia'][0]) {\n imageUrl = post._embedded['wp:featuredmedia'][0].source_url;\n } else if (post.content.rendered.includes('<img')) {\n const div = document.createElement('div');\n div.innerHTML = post.content.rendered;\n const firstImg = div.querySelector('img');\n if (firstImg) imageUrl = firstImg.src;\n }\n } catch (e) { console.error(\"Error parsing image\", e); }\n\n const cleanTitle = post.title.rendered\n .replace(\/ \/g, ' ')\n .replace(\/&\/g, '&')\n .replace(\/–\/g, '-')\n .replace(\/’\/g, \"'\")\n .replace(\/“\/g, '\"')\n .replace(\/”\/g, '\"');\n \n const excerpt = post.excerpt.rendered.replace(\/<[^>]*>?\/gm, '').substring(0, 100) + '...';\n\n const slide = document.createElement('div');\n slide.classList.add('news-slide');\n slide.innerHTML = `\n <img decoding=\"async\" src=\"${imageUrl}\" alt=\"${cleanTitle}\" onerror=\"this.src='https:\/\/via.placeholder.com\/800x450\/f1f5f9\/64748b?text=Berita+STIKES+HI'\">\n <div class=\"news-caption\">\n <h3>${cleanTitle}<\/h3>\n <p>${excerpt}<\/p>\n <a href=\"${post.link}\" class=\"read-more\" target=\"_blank\">Baca Selengkapnya<\/a>\n <\/div>\n `;\n slider.appendChild(slide);\n\n const dot = document.createElement('span');\n dot.classList.add('dot');\n if (i === 0) dot.classList.add('active');\n dot.onclick = () => goToSlide(i);\n dotsContainer.appendChild(dot);\n });\n } else {\n slider.innerHTML = '<div style=\"padding: 40px; text-align: center; width: 100%; color: #64748b;\">Belum ada berita terbaru di kategori ini.<\/div>';\n }\n } catch (error) {\n console.error('Error:', error);\n slider.innerHTML = '<div style=\"padding: 40px; text-align: center; width: 100%; color: #ef4444;\">Gagal memuat berita.<\/div>';\n }\n }\n\n function updateDots() {\n const dots = document.querySelectorAll('.dot');\n dots.forEach((dot, i) => {\n dot.classList.toggle('active', i === currentSlide);\n });\n }\n\n function moveSlide(step) {\n if (totalSlides === 0) return;\n currentSlide = (currentSlide + step + totalSlides) % totalSlides;\n slider.style.transform = `translateX(-${currentSlide * 100}%)`;\n updateDots();\n }\n\n function goToSlide(index) {\n currentSlide = index;\n slider.style.transform = `translateX(-${currentSlide * 100}%)`;\n updateDots();\n }\n\n fetchNews();\n\n let autoSlide = setInterval(() => moveSlide(1), 7000);\n document.querySelector('.news-slider-container').addEventListener('mouseenter', () => clearInterval(autoSlide));\n document.querySelector('.news-slider-container').addEventListener('mouseleave', () => {\n autoSlide = setInterval(() => moveSlide(1), 7000);\n });\n<\/script>\n\n\n\n<div class=\"lpm-unified-container\">\n \n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/auditor-internal\/\" class=\"lpm-custom-button reveal\">\n <div class=\"button-content\">\n <span class=\"icon\">\ud83d\udd0d<\/span>\n <div class=\"text-group\">\n <span class=\"title\">Data Auditor Internal<\/span>\n <\/div>\n <\/div>\n <\/a>\n\n <a href=\"https:\/\/siami.stikes-hi.ac.id\/\" class=\"lpm-custom-button reveal\" target=\"_blank\" rel=\"noopener noreferrer\">\n <div class=\"button-content\">\n <span class=\"icon\">\ud83d\udda5\ufe0f<\/span>\n <div class=\"text-group\">\n <span class=\"title\">Sistem Informasi Audit Mutu Internal (SiAmi)<\/span>\n <\/div>\n <\/div>\n <\/a>\n\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/spme\/\" class=\"lpm-custom-button reveal\">\n <div class=\"button-content\">\n <span class=\"icon\">\ud83c\udfc5<\/span>\n <div class=\"text-group\">\n <span class=\"title\">Akreditasi<\/span>\n <\/div>\n <\/div>\n <\/a>\n\n<\/div>\n\n<style>\n \/* --- CSS EFEK REVEAL --- *\/\n .reveal {\n opacity: 0;\n transform: translateY(30px);\n transition: all 0.8s cubic-bezier(0.2, 1, 0.3, 1);\n visibility: hidden;\n }\n\n .reveal.active {\n opacity: 1;\n transform: translateY(0);\n visibility: visible;\n }\n\n \/* --- STYLE DASAR --- *\/\n .lpm-unified-container {\n max-width: 600px;\n margin: 15px auto;\n font-family: 'Inter', system-ui, sans-serif;\n display: flex;\n flex-direction: column;\n gap: 15px;\n }\n\n .lpm-custom-button {\n width: 100%;\n display: flex;\n justify-content: flex-start;\n align-items: center;\n padding: 16px 20px;\n background: #ffffff;\n border: 1px solid #e2e8f0;\n border-radius: 10px;\n text-decoration: none !important;\n box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n transition: transform 0.2s, background 0.2s, box-shadow 0.2s, opacity 0.8s, transform 0.8s;\n cursor: pointer;\n box-sizing: border-box;\n }\n\n .lpm-custom-button:hover {\n background: #f8fafc;\n transform: translateY(-2px);\n box-shadow: 0 6px 15px rgba(0,0,0,0.08);\n border-color: #cbd5e1;\n }\n\n .button-content {\n display: flex;\n align-items: center;\n gap: 15px;\n text-align: left;\n }\n\n .icon { font-size: 20px; }\n\n .text-group .title {\n font-weight: 700;\n color: #1e293b;\n font-size: 15px;\n line-height: 1.3;\n text-transform: none !important;\n }\n\n \/* Responsif Mobile *\/\n @media (max-width: 480px) {\n .lpm-custom-button { padding: 14px 15px; }\n .text-group .title { font-size: 14px; }\n }\n<\/style>\n\n<script>\n\/\/ Efek Muncul Saat Scroll (Intersection Observer)\ndocument.addEventListener('DOMContentLoaded', function() {\n const observerOptions = {\n threshold: 0.15 \n };\n\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('active');\n }\n });\n }, observerOptions);\n\n document.querySelectorAll('.reveal').forEach(el => {\n observer.observe(el);\n });\n});\n<\/script>\n\n\n\n<div class=\"lpm-history-wrapper lpm-scroll-reveal\">\n <div class=\"lpm-dropdown-container\">\n <button class=\"lpm-dropdown-trigger\" onclick=\"toggleSiklus(this)\">\n <div class=\"trigger-content\">\n <span class=\"icon\">\ud83d\udd04<\/span>\n <div class=\"text-group\">\n <span class=\"title\">Kalender Audit Tahunan<\/span>\n <\/div>\n <\/div>\n <i class=\"arrow-icon\"><\/i>\n <\/button>\n\n <div class=\"lpm-dropdown-content\" id=\"siklusContent\">\n <div class=\"lpm-timeline-compact\">\n <div class=\"timeline-path\">\n \n <div class=\"timeline-node cat-monitoring\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Januari – Maret<\/span>\n <h4 class=\"t-title\">Monitoring Ganjil<\/h4>\n <p class=\"t-desc\">Pengawasan standar pembelajaran dan layanan unit.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-survey\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Februari<\/span>\n <h4 class=\"t-title\">Survei Kepuasan Ganjil<\/h4>\n <p class=\"t-desc\">Pengumpulan data kepuasan mahasiswa, dosen, dan tendik.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-monitoring\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Juli – September<\/span>\n <h4 class=\"t-title\">Monitoring Genap<\/h4>\n <p class=\"t-desc\">Pemantauan efektivitas proses akademik semester genap.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-survey\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Agustus<\/span>\n <h4 class=\"t-title\">Survei Kepuasan Genap<\/h4>\n <p class=\"t-desc\">Evaluasi kepuasan layanan sebagai dasar data RTM.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-audit\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">September – Oktober<\/span>\n <h4 class=\"t-title\">Audit Mutu Internal (AMI)<\/h4>\n <p class=\"t-desc\">Verifikasi kesesuaian standar di seluruh unit kerja.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-rtm\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Oktober<\/span>\n <h4 class=\"t-title\">Rapat Tinjauan Manajemen<\/h4>\n <p class=\"t-desc\">Tindak lanjut temuan audit oleh pimpinan institusi.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-peningkatan\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Desember – Januari<\/span>\n <h4 class=\"t-title\">Perumusan Peningkatan<\/h4>\n <p class=\"t-desc\">Menaikkan target indikator hasil evaluasi siklus.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-peningkatan\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Januari<\/span>\n <h4 class=\"t-title\">Sosialisasi Peningkatan<\/h4>\n <p class=\"t-desc\">Penyampaian dokumen standar baru kepada sivitas.<\/p>\n <\/div>\n <\/div>\n\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n<\/div>\n\n<style>\n \/* --- CSS BARU UNTUK EFEK SCROLL REVEAL --- *\/\n .lpm-scroll-reveal {\n opacity: 0;\n transform: translateY(30px);\n transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n visibility: hidden;\n }\n\n .lpm-scroll-reveal.reveal-active {\n opacity: 1;\n transform: translateY(0);\n visibility: visible;\n }\n\n \/* --- STYLE ASLI --- *\/\n .lpm-history-wrapper {\n max-width: 600px;\n margin: 15px auto;\n font-family: 'Inter', system-ui, sans-serif;\n }\n\n .lpm-dropdown-container {\n background: #ffffff;\n border: 1px solid #e2e8f0;\n border-radius: 10px;\n overflow: hidden;\n box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n }\n\n .lpm-dropdown-trigger {\n width: 100%;\n padding: 15px 20px;\n background: #fff;\n border: none;\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: pointer;\n transition: background 0.2s;\n }\n\n .lpm-dropdown-trigger:hover { background: #f8fafc; }\n .trigger-content { display: flex; align-items: center; gap: 12px; }\n .trigger-content .icon { font-size: 18px; }\n \n .trigger-content .title { \n font-weight: 700; \n color: #1e293b; \n font-size: 15px;\n text-transform: none !important; \n }\n\n .arrow-icon {\n width: 7px; height: 7px;\n border-right: 2px solid #64748b;\n border-bottom: 2px solid #64748b;\n transform: rotate(45deg);\n transition: transform 0.3s ease;\n }\n\n .lpm-dropdown-content {\n max-height: 0;\n overflow: hidden;\n transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);\n background: #fdfdfd;\n }\n\n .active .lpm-dropdown-content {\n max-height: 1500px;\n transition: max-height 0.8s ease-in;\n }\n\n .active .arrow-icon { transform: rotate(-135deg); }\n\n .lpm-timeline-compact { padding: 20px; }\n .timeline-path {\n position: relative;\n padding-left: 20px;\n border-left: 2px solid #f1f5f9;\n margin-left: 10px;\n }\n\n .timeline-node {\n position: relative;\n margin-bottom: 12px;\n opacity: 0;\n transform: translateX(20px);\n }\n\n .active .timeline-node {\n animation: fadeInNode 0.5s ease-out forwards;\n }\n\n @keyframes fadeInNode {\n to { opacity: 1; transform: translateX(0); }\n }\n\n .timeline-node::before {\n content: '';\n position: absolute;\n left: -27px;\n top: 12px;\n width: 10px;\n height: 10px;\n background: #fff;\n border: 2.5px solid #cbd5e1;\n border-radius: 50%;\n z-index: 2;\n }\n\n .timeline-card-compact {\n background: #fff;\n border-radius: 8px;\n padding: 8px 15px;\n border: 1px solid #f1f5f9;\n border-left: 4px solid #cbd5e1;\n }\n\n .t-month {\n font-size: 9px;\n font-weight: 800;\n color: #94a3b8;\n display: block;\n text-transform: none !important;\n }\n\n .t-title { font-size: 13px; font-weight: 700; color: #1e293b; margin: 2px 0; }\n .t-desc { font-size: 11px; color: #64748b; margin: 0; line-height: 1.4; }\n\n .cat-monitoring .timeline-card-compact { border-left-color: #3b82f6; }\n .cat-survey .timeline-card-compact { border-left-color: #10b981; }\n .cat-audit .timeline-card-compact { border-left-color: #f59e0b; }\n .cat-rtm .timeline-card-compact { border-left-color: #ef4444; }\n .cat-peningkatan .timeline-card-compact { border-left-color: #8B0000; }\n\n .active .timeline-node:nth-child(1) { animation-delay: 0.1s; }\n .active .timeline-node:nth-child(2) { animation-delay: 0.15s; }\n .active .timeline-node:nth-child(3) { animation-delay: 0.2s; }\n .active .timeline-node:nth-child(4) { animation-delay: 0.25s; }\n .active .timeline-node:nth-child(5) { animation-delay: 0.3s; }\n .active .timeline-node:nth-child(6) { animation-delay: 0.35s; }\n .active .timeline-node:nth-child(7) { animation-delay: 0.4s; }\n .active .timeline-node:nth-child(8) { animation-delay: 0.45s; }\n<\/style>\n\n<script>\n\/\/ 1. Fungsi Toggle Dropdown (Asli)\nfunction toggleSiklus(btn) {\n const container = btn.parentElement;\n container.classList.toggle('active');\n}\n\n\/\/ 2. Skrip Intersection Observer untuk Scroll Reveal\ndocument.addEventListener('DOMContentLoaded', function() {\n const observerOptions = {\n threshold: 0.15 \/\/ Elemen muncul saat 15% bagian terlihat\n };\n\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('reveal-active');\n \/\/ observer.unobserve(entry.target); \/\/ Buka komen ini jika ingin animasi hanya 1x saja\n }\n });\n }, observerOptions);\n\n const revealElements = document.querySelectorAll('.lpm-scroll-reveal');\n revealElements.forEach(el => observer.observe(el));\n});\n<\/script>\n\n\n\n<div id=\"siami-portal-modern\" class=\"siami-reveal\">\n <style>\n \/* Efek Animasi Masuk *\/\n .siami-reveal {\n opacity: 0;\n transform: translateY(50px);\n transition: all 0.8s cubic-bezier(0.22, 1, 0.36, 1);\n }\n\n \/* Class aktif yang dipicu oleh JavaScript *\/\n .siami-reveal.active {\n opacity: 1;\n transform: translateY(0);\n }\n\n #siami-portal-modern {\n margin: 20px auto;\n max-width: 450px;\n padding: 40px 20px;\n background: #ffffff;\n border-radius: 15px;\n border: 1px solid #3e9ac9; \n box-shadow: 0 4px 25px rgba(0,0,0,0.1);\n font-family: 'Segoe UI', Arial, sans-serif;\n text-align: center;\n }\n\n #siami-portal-modern .logo-box {\n margin-bottom: 25px;\n }\n\n #siami-portal-modern .logo-box img {\n max-width: 100px;\n height: auto;\n }\n\n #siami-portal-modern .main-title {\n font-size: 1.25rem;\n color: #3f4e85;\n font-weight: 600;\n line-height: 1.2;\n margin: 0 0 30px 0;\n }\n\n #siami-portal-modern .btn-group {\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-bottom: 25px;\n padding: 0 10px;\n }\n\n #siami-portal-modern .siami-btn {\n display: block;\n padding: 16px;\n border-radius: 40px;\n color: #ffffff !important;\n text-decoration: none !important;\n text-transform: uppercase;\n font-size: 0.85rem;\n font-weight: 700;\n letter-spacing: 0.8px;\n transition: transform 0.2s ease, opacity 0.2s ease;\n }\n\n #siami-portal-modern .siami-btn:hover {\n opacity: 0.9;\n transform: scale(1.02);\n }\n\n .btn-auditor { background-color: #a93ec9; }\n .btn-ketua { background-color: #3ec953; }\n .btn-prodi { background-color: #3e9ac9; }\n .btn-lpm { background-color: #fbb001; }\n\n #siami-portal-modern .footer-text {\n font-size: 0.8rem;\n color: #7f8c8d;\n margin-top: 25px;\n }\n <\/style>\n\n <div class=\"logo-box\">\n <img decoding=\"async\" src=\"https:\/\/storage.stikes-hi.ac.id\/stikes-hi-media\/3fbebd76-22d3-4641-a12f-ec3c51280150.png\" alt=\"Logo STIKES HI\">\n <\/div>\n\n <p class=\"main-title\">\n Sistem Informasi Audit Mutu Internal<br>(SiAmi)\n <\/p>\n\n <div class=\"btn-group\">\n <a href=\"https:\/\/siami.stikes-hi.ac.id\/\" target=\"_blank\" class=\"siami-btn btn-auditor\">Auditor<\/a>\n <a href=\"https:\/\/siami.stikes-hi.ac.id\/\" target=\"_blank\" class=\"siami-btn btn-ketua\">Ketua<\/a>\n <a href=\"https:\/\/siami.stikes-hi.ac.id\/\" target=\"_blank\" class=\"siami-btn btn-prodi\">Program Studi<\/a>\n <a href=\"https:\/\/siami.stikes-hi.ac.id\/\" target=\"_blank\" class=\"siami-btn btn-lpm\">Lembaga Penjaminan Mutu<\/a>\n <\/div>\n\n <div class=\"footer-text\">\n Copyright \u00a9 LPM STIKES HI 2023\n <\/div>\n<\/div>\n\n<script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n const observerOptions = {\n threshold: 0.15 \/\/ Animasi mulai saat 15% elemen terlihat di layar\n };\n\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('active');\n \/\/ Berhenti mengamati setelah animasi jalan sekali (opsional)\n \/\/ observer.unobserve(entry.target); \n }\n });\n }, observerOptions);\n\n const target = document.querySelector('.siami-reveal');\n if (target) {\n observer.observe(target);\n }\n });\n<\/script>\n\n\n\n<style>\n \/* Keyframe Animasi Muncul *\/\n @keyframes fadeUp {\n from {\n opacity: 0;\n transform: translateY(15px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n .ppepp-mini-wrapper {\n display: flex;\n flex-wrap: wrap;\n gap: 10px;\n justify-content: center;\n padding: 15px 5px;\n font-family: 'Inter', -apple-system, sans-serif;\n }\n\n .ppepp-btn {\n display: flex;\n align-items: center;\n padding: 6px 14px;\n border-radius: 50px;\n text-decoration: none !important;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n border: 1px solid transparent;\n background: #f8f9fa;\n box-shadow: 0 2px 4px rgba(0,0,0,0.05);\n \n \/* Terapkan animasi ke tombol *\/\n animation: fadeUp 0.5s ease-out both;\n }\n\n \/* Delay bergantian agar muncul satu per satu *\/\n .btn-p1 { animation-delay: 0.1s; }\n .btn-p2 { animation-delay: 0.2s; }\n .btn-e { animation-delay: 0.3s; }\n .btn-p3 { animation-delay: 0.4s; }\n .btn-p4 { animation-delay: 0.5s; }\n\n .ppepp-char {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 22px;\n height: 22px;\n border-radius: 50%;\n color: #fff;\n font-weight: 800;\n font-size: 11px;\n margin-right: 8px;\n flex-shrink: 0;\n }\n\n .ppepp-text {\n font-size: 13px;\n font-weight: 600;\n color: #444;\n white-space: nowrap;\n }\n\n \/* Warna Identitas *\/\n .btn-p1 .ppepp-char { background: #e74c3c; } .btn-p1:hover { border-color: #e74c3c; background: #fff5f5; }\n .btn-p2 .ppepp-char { background: #3498db; } .btn-p2:hover { border-color: #3498db; background: #f0f7ff; }\n .btn-e .ppepp-char { background: #2ecc71; } .btn-e:hover { border-color: #2ecc71; background: #f2fff7; }\n .btn-p3 .ppepp-char { background: #f1c40f; } .btn-p3:hover { border-color: #f1c40f; background: #fffdf0; }\n .btn-p4 .ppepp-char { background: #c0392b; } .btn-p4:hover { border-color: #c0392b; background: #fff5f5; }\n\n .ppepp-btn:hover {\n transform: translateY(-3px);\n box-shadow: 0 6px 12px rgba(0,0,0,0.08);\n }\n\n @media (max-width: 480px) {\n .ppepp-mini-wrapper { gap: 6px; }\n .ppepp-btn { padding: 5px 10px; }\n .ppepp-text { font-size: 11px; }\n .ppepp-char { width: 18px; height: 18px; font-size: 9px; margin-right: 5px; }\n }\n<\/style>\n\n<div class=\"ppepp-mini-wrapper\">\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-mutu\/\" class=\"ppepp-btn btn-p1\">\n <div class=\"ppepp-char\">P<\/div> <span class=\"ppepp-text\">Penetapan<\/span>\n <\/a>\n\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/pelaksanaan\/\" class=\"ppepp-btn btn-p2\">\n <div class=\"ppepp-char\">P<\/div> <span class=\"ppepp-text\">Pelaksanaan<\/span>\n <\/a>\n\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-monev-dan-ami\/\" class=\"ppepp-btn btn-e\">\n <div class=\"ppepp-char\">E<\/div> <span class=\"ppepp-text\">Evaluasi<\/span>\n <\/a>\n\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/rapat-tinjauan-manajemen-dan-rencana-tindak-lanjut\/\" class=\"ppepp-btn btn-p3\">\n <div class=\"ppepp-char\">P<\/div> <span class=\"ppepp-text\">Pengendalian<\/span>\n <\/a>\n\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/benchmarking\/\" class=\"ppepp-btn btn-p4\">\n <div class=\"ppepp-char\">P<\/div> <span class=\"ppepp-text\">Peningkatan<\/span>\n <\/a>\n<\/div>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <style>\n \/* Menggunakan scope khusus agar tidak merusak CSS template utama *\/\n .faq-lpm-scope {\n --faq-accent: #1e3a8a; \/* Berubah ke Biru Tua *\/\n --faq-bg: #ffffff;\n --faq-text: #1e293b;\n --faq-muted: #64748b;\n }\n\n \/* --- TOMBOL FAQ (KANAN) --- *\/\n .faq-lpm-trigger {\n position: fixed; \n right: 0; \n top: 55%; \n transform: translateY(-50%);\n background: #1e3a8a; \/* Biru Tua *\/\n color: white; \n padding: 18px 8px;\n border-radius: 10px 0 0 10px; \n cursor: pointer; \n writing-mode: vertical-rl;\n font-weight: 700; \n letter-spacing: 1px; \n font-family: 'Inter', sans-serif;\n z-index: 1000; \n box-shadow: -2px 0 10px rgba(0,0,0,0.1);\n transition: all 0.3s ease;\n }\n \n .faq-lpm-trigger:hover { \n padding-right: 15px;\n background: #172554; \/* Biru sangat gelap saat hover *\/\n }\n\n \/* --- CONTAINER CHAT --- *\/\n .faq-lpm-container {\n position: fixed; \n right: 50px; \/* Jarak dari tepi kanan agar tidak menutupi tombol sepenuhnya *\/\n top: 55%; \n transform: translateY(-50%) scale(0.5); \/* Mulai dari skala kecil *\/\n transform-origin: right center; \/* Titik muncul dari kanan tengah (arah tombol) *\/\n width: 360px;\n max-height: 80vh; \n background: #ffffff; \n border-radius: 15px;\n box-shadow: 0 10px 25px rgba(0,0,0,0.15); \n display: none; \n flex-direction: column;\n overflow: hidden; \n z-index: 999; \n border: 1px solid #e2e8f0;\n font-family: 'Inter', sans-serif;\n opacity: 0;\n transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n }\n\n \/* State saat aktif (muncul) *\/\n .faq-lpm-container.faq-open {\n display: flex;\n opacity: 1;\n transform: translateY(-50%) scale(1);\n }\n\n .faq-lpm-header {\n padding: 15px; \n background: #1e3a8a; \/* Biru Tua *\/\n color: #ffffff;\n display: flex; justify-content: space-between; align-items: center;\n }\n\n .faq-lpm-header-text { font-size: 14px; font-weight: 600; text-transform: none; }\n .faq-lpm-close { cursor: pointer; font-family: monospace; font-size: 18px; padding: 0 5px; }\n\n .faq-lpm-body { padding: 15px; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; }\n\n .faq-lpm-item {\n background: #ffffff; border: 1px solid #e2e8f0; padding: 12px;\n border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 500;\n color: #1e293b; transition: 0.2s; text-align: left;\n }\n .faq-lpm-item:hover { \n border-color: #1e3a8a; \n background: #f0f7ff; \/* Background biru sangat muda saat hover *\/\n }\n\n .faq-lpm-ans {\n background: #f8fafc; padding: 12px; border-radius: 8px;\n font-size: 13px; line-height: 1.6; color: #64748b;\n border-left: 3px solid #1e3a8a; \/* Border kiri biru tua *\/\n display: none; margin-top: 2px;\n }\n\n \/* --- PPEPP MINI STYLE --- *\/\n .faq-lpm-link {\n display: flex; align-items: center; gap: 10px; text-decoration: none !important;\n margin-top: 10px; padding: 10px; border-radius: 8px; background: white;\n border: 1px solid #f1f5f9; transition: 0.2s;\n }\n .faq-lpm-link:hover { transform: translateY(-2px); box-shadow: 0 4px 6px rgba(0,0,0,0.05); }\n\n .faq-lpm-box {\n width: 35px; height: 35px; border-radius: 6px; display: flex;\n justify-content: center; align-items: center; color: white;\n font-weight: bold; font-size: 18px; flex-shrink: 0;\n }\n .faq-lpm-label { font-weight: bold; font-size: 12px; color: #1e293b; text-transform: uppercase; }\n\n .faq-red { background: #F00; } .faq-blue { background: #1e3a8a; } \/* Box juga disesuaikan *\/\n .faq-green { background: #70AD47; } .faq-gold { background: #FFC000; } \n .faq-darkred { background: #C00000; }\n <\/style>\n<\/head>\n<body class=\"faq-lpm-scope\">\n\n<div class=\"faq-lpm-trigger\" onclick=\"toggleFaqLPM()\">FAQ<\/div>\n\n<div class=\"faq-lpm-container\" id=\"faqLpmBox\">\n <div class=\"faq-lpm-header\">\n <span class=\"faq-lpm-header-text\" id=\"faqLpmTitle\">FAQ (Tanya Jawab)<\/span>\n <div class=\"faq-lpm-close\" onclick=\"toggleFaqLPM()\">x<\/div>\n <\/div>\n \n <div class=\"faq-lpm-body\">\n <div class=\"faq-lpm-item\" onclick=\"showFaqAns('q1')\">Di mana saya bisa melihat standar mutu?<\/div>\n <div id=\"ans-q1\" class=\"faq-lpm-ans\">\n Seluruh <strong>dokumen mutu,<\/strong> mulai dari Kebijakan, Manual\/Pedoman PPEPP, Standar, hingga Formulir\/Tata Cara Pendokumentasian dapat anda unduh langsung melalui menu <strong>“Penetapan”<\/strong> di website ini.\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-mutu\/\" class=\"faq-lpm-link\">\n <div class=\"faq-lpm-box faq-red\">P<\/div>\n <div class=\"faq-lpm-label\">Buka Penetapan<\/div>\n <\/a>\n <\/div>\n\n <div class=\"faq-lpm-item\" onclick=\"showFaqAns('q2')\">Bagaimana saya dapat mengunduh formulir mutu?<\/div>\n <div id=\"ans-q2\" class=\"faq-lpm-ans\">\n Silahkan anda mengunduh <strong>formulir mutu<\/strong> langsung melalui menu <strong>“Pelaksanaan”<\/strong> dan pilih cara Pendokumentasian di website ini. Gunakan fitur pencarian melalui browser anda untuk mempercepat mendapatkan file yang diinginkan.\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/pelaksanaan\/\" class=\"faq-lpm-link\">\n <div class=\"faq-lpm-box faq-blue\">P<\/div>\n <div class=\"faq-lpm-label\">Buka Pelaksanaan<\/div>\n <\/a>\n <\/div>\n\n <div class=\"faq-lpm-item\" onclick=\"showFaqAns('q3')\">Berapa kali AMI akan kita laksanakan?<\/div>\n <div id=\"ans-q3\" class=\"faq-lpm-ans\">\n AMI (Audit Mutu Internal) dilaksanakan secara rutin minimal 1 (satu) kali dalam setahun, biasanya bulan <strong>September<\/strong> untuk mengevaluasi kinerja seluruh Program Studi dan Unit Kerja. Klik menu <strong>“Evaluasi”<\/strong> untuk melihat dokumen AMI.\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-monev-dan-ami\/\" class=\"faq-lpm-link\">\n <div class=\"faq-lpm-box faq-green\">E<\/div>\n <div class=\"faq-lpm-label\">Buka Evaluasi<\/div>\n <\/a>\n <\/div>\n\n <div class=\"faq-lpm-item\" onclick=\"showFaqAns('q4')\">Kapan RTM dan RTL dilaksanakan?<\/div>\n <div id=\"ans-q4\" class=\"faq-lpm-ans\">\n Rapat Tinjauan Manajemen (RTM) dilaksanakan <strong>segera mungkin<\/strong> setelah AMI. Kemudian dilanjutkan Rencana Tindak Lanjut (RTL) sebagai langkah konkret untuk memperbaiki temuan audit. Dokumen RTM dan RTL dapat diakses di menu <strong>“Pengendalian”<\/strong>.\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/rapat-tinjauan-manajemen-dan-rencana-tindak-lanjut\/\" class=\"faq-lpm-link\">\n <div class=\"faq-lpm-box faq-gold\">P<\/div>\n <div class=\"faq-lpm-label\">Buka Pengendalian<\/div>\n <\/a>\n <\/div>\n\n <div class=\"faq-lpm-item\" onclick=\"showFaqAns('q5')\">Apa itu Benchmarking?<\/div>\n <div id=\"ans-q5\" class=\"faq-lpm-ans\">\n Benchmarking adalah proses sistematis untuk membandingkan <strong>(Best Practice\/Praktik Baik)<\/strong> institusi lain yang lebih unggul. Laporan benchmarking dapat dilihat di menu <strong>“Peningkatan”<\/strong> sebagai inspirasi peningkatan yang berkelanjutan.\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/benchmarking\/\" class=\"faq-lpm-link\">\n <div class=\"faq-lpm-box faq-darkred\">P<\/div>\n <div class=\"faq-lpm-label\">Buka Peningkatan<\/div>\n <\/a>\n <\/div>\n <\/div>\n<\/div>\n\n<script>\n function toggleFaqLPM() {\n const box = document.getElementById('faqLpmBox');\n \n if (box.style.display === 'none' || box.style.display === '') {\n box.style.display = 'flex';\n \/\/ Delay minimal agar transition CSS terbaca setelah display flex\n setTimeout(() => {\n box.classList.add('faq-open');\n runFaqScramble(document.getElementById('faqLpmTitle'));\n }, 10);\n } else {\n box.classList.remove('faq-open');\n \/\/ Sembunyikan setelah animasi transisi selesai\n setTimeout(() => {\n box.style.display = 'none';\n }, 300);\n }\n }\n\n function showFaqAns(id) {\n document.querySelectorAll('.faq-lpm-ans').forEach(el => el.style.display = 'none');\n const target = document.getElementById('ans-' + id);\n target.style.display = 'block';\n target.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n }\n\n function runFaqScramble(el) {\n const text = \"FAQ (Tanya Jawab)\";\n const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';\n let iter = 0;\n const interval = setInterval(() => {\n el.innerText = text.split(\"\").map((c, i) => {\n if(i < iter) return text[i];\n return chars[Math.floor(Math.random()*chars.length)];\n }).join(\"\");\n if(iter >= text.length) clearInterval(interval);\n iter += 1\/3;\n }, 30);\n }\n<\/script>\n\n<\/body>\n<\/html>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Akses Terbatas Dokumen Audit Mutu Internal AMI 2025 AMI 2024 AMI 2023 AMI 2022 AMI 2021 AMI 2020 AMI 2019 Survei Kepuasan Dokumen Monitoring dan Evaluasi \ud83d\udd0d Evaluasi (E) Proses membandingkan Pelaksanaan dengan Standar untuk mengukur pencapaian mutu dan mengidentifikasi … <\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-269","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/269","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/comments?post=269"}],"version-history":[{"count":109,"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/269\/revisions"}],"predecessor-version":[{"id":2236,"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/269\/revisions\/2236"}],"wp:attachment":[{"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/media?parent=269"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":269,"date":"2026-03-04T09:38:03","date_gmt":"2026-03-04T09:38:03","guid":{"rendered":"https:\/\/lpm.stikes-hi.ac.id\/?page_id=269"},"modified":"2026-05-02T13:41:12","modified_gmt":"2026-05-02T13:41:12","slug":"dokumen-monev-dan-ami","status":"publish","type":"page","link":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-monev-dan-ami\/","title":{"rendered":"Dokumen Monev dan AMI"},"content":{"rendered":"\n\n\n\n \n \n Akses Terbatas<\/title>\n \n <style>\n \/* Mendefinisikan keyframe untuk animasi 'munculNaik' *\/\n @keyframes munculNaik {\n from {\n opacity: 0;\n transform: translateY(30px); \/* Mulai dari 30px di bawah posisi asli *\/\n }\n to {\n opacity: 1;\n transform: translateY(0); \/* Kembali ke posisi asli *\/\n }\n }\n\n \/* Kelas CSS yang akan memicu animasi *\/\n .animasi-muncul {\n animation: munculNaik 0.8s ease-out; \/* Durasi 0.8 detik *\/\n }\n <\/style>\n<\/head>\n<body>\n\n<div style=\"text-align: center;\">\n <a href=\"javascript:void(0);\" onclick=\"aksesTerbatas()\">\n <img decoding=\"async\" id=\"gambarAkses\" src=\"https:\/\/lh3.googleusercontent.com\/d\/1P3GImhAu-uU9208gtDf0tv2ljfgqOM1R\" alt=\"Deskripsi Gambar\" style=\"max-width: 50%; height: auto; cursor: pointer;\">\n <\/a>\n<\/div>\n\n<script>\n\/\/ Fungsi asli Anda (Tidak diubah)\nfunction aksesTerbatas() {\n \/\/ Memunculkan kotak dialog untuk mengisi password\n var password = prompt(\"Silakan masukkan password untuk mengakses folder:\");\n var passwordBenar = \"spmihi\";\n var linkTujuan = \"https:\/\/drive.google.com\/drive\/folders\/1WfmsHm0suRPy-aREaItApQ3fu69uINQL?usp=sharing\";\n\n if (password === passwordBenar) {\n \/\/ Jika password benar, buka link di tab baru\n window.open(linkTujuan, '_blank');\n } else if (password === null) {\n \/\/ Jika pengguna menekan tombol 'Batal'\n return;\n } else {\n \/\/ Jika password salah\n alert(\"Password salah! Akses ditolak.\");\n }\n}\n\n\/\/ Tambahan JavaScript untuk memicu animasi saat halaman selesai dimuat\nwindow.onload = function() {\n var gambar = document.getElementById('gambarAkses');\n \/\/ Menambahkan kelas animasi ke gambar\n gambar.classList.add('animasi-muncul');\n};\n<\/script>\n\n<\/body>\n<\/html>\n\n\n\n<style>\n \/* --- ANIMASI MUNCUL NAIK --- *\/\n @keyframes fadeInUp {\n from { opacity: 0; transform: translateY(20px); }\n to { opacity: 1; transform: translateY(0); }\n }\n\n .lpm-doc-wrapper {\n display: flex;\n flex-direction: column;\n gap: 12px;\n max-width: 320px; \n margin: 20px auto; \n font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\n }\n\n \/* Container untuk tombol yang punya dropdown *\/\n .menu-container {\n display: flex;\n flex-direction: column;\n transition: all 0.3s ease;\n }\n\n \/* Gaya Dasar Tombol *\/\n .btn-lpm-locked {\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: #4472c4; \n color: #ffffff !important;\n padding: 12px 15px;\n text-decoration: none !important;\n border-radius: 6px;\n font-size: 13px;\n font-weight: normal; \n text-align: center;\n transition: all 0.3s ease;\n border: 1px solid #3b63a8;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n cursor: pointer;\n animation: fadeInUp 0.6s ease-out both;\n z-index: 2;\n }\n\n .btn-lpm-locked:hover {\n background-color: #335591;\n }\n\n .btn-lpm-locked::before {\n content: \"\ud83d\udd12\";\n margin-right: 10px;\n font-size: 14px;\n }\n\n \/* --- GAYA LIST AMI (AKORDION) --- *\/\n .ami-list {\n max-height: 0; \n overflow: hidden;\n transition: max-height 0.5s ease-in-out, margin 0.3s ease;\n display: flex;\n flex-direction: column;\n gap: 5px;\n padding: 0 10px;\n background: #f8f9fa;\n border-radius: 0 0 6px 6px;\n }\n\n \/* Munculkan list saat container di-hover *\/\n .menu-container:hover .ami-list {\n max-height: 400px; \n margin-top: 5px;\n margin-bottom: 10px;\n padding: 10px;\n border: 1px dashed #4472c4;\n }\n\n .ami-item {\n background: #ffffff;\n color: #4472c4;\n padding: 8px;\n font-size: 12px;\n border-radius: 4px;\n text-align: center;\n border: 1px solid #ddd;\n cursor: pointer;\n transition: 0.2s;\n }\n\n .ami-item:hover {\n background: #4472c4;\n color: white;\n }\n\n \/* Delay Animasi Tombol Utama *\/\n .btn-delay-1 { animation-delay: 0.1s; }\n .btn-delay-2 { animation-delay: 0.3s; }\n .btn-delay-3 { animation-delay: 0.5s; }\n<\/style>\n\n<div class=\"lpm-doc-wrapper\">\n <div class=\"menu-container btn-delay-1\">\n <div class=\"btn-lpm-locked\">\n Dokumen Audit Mutu Internal\n <\/div>\n <div class=\"ami-list\">\n <div class=\"ami-item\" onclick=\"masukAkses('2025')\">AMI 2025<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2024')\">AMI 2024<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2023')\">AMI 2023<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2022')\">AMI 2022<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2021')\">AMI 2021<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2020')\">AMI 2020<\/div>\n <div class=\"ami-item\" onclick=\"masukAkses('2019')\">AMI 2019<\/div>\n <\/div>\n <\/div>\n\n <div onclick=\"masukAkses('survei')\" class=\"btn-lpm-locked btn-delay-2\">\n Survei Kepuasan\n <\/div>\n\n <div onclick=\"masukAkses('monev')\" class=\"btn-lpm-locked btn-delay-3\">\n Dokumen Monitoring dan Evaluasi\n <\/div>\n<\/div>\n\n<script>\n function masukAkses(tahun) {\n var label;\n \/\/ Penyesuaian variabel survei\n if (tahun === 'survei') label = \"Survei Kepuasan\";\n else if (tahun === 'monev') label = \"Monitoring dan Evaluasi\";\n else label = \"AMI \" + tahun;\n\n var sandi = prompt(\"Dokumen \" + label + \" terbatas. Masukkan Password Akses:\");\n \n if (sandi === \"spmihi\") {\n let targetUrl = \"\";\n\n \/\/ Logika Link Tujuan\n if (tahun === '2025') {\n targetUrl = \"https:\/\/sites.google.com\/view\/amihi2025\";\n } else if (tahun === '2024') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1m2c9NYoY6vlymThw4msN37WaMd9ngeEm?usp=sharing\";\n } else if (tahun === '2023') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/12VLAqL-pLC-dhqHbKQtYP2wZ3DmqOygZ?usp=sharing\";\n } else if (tahun === '2022') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1QdNIaL4mysboRKJePb3q6MOgSuNa5lLD?usp=sharing\";\n } else if (tahun === '2021') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1RVpjX431PqoDFgeaBzO3Y13sGDNubev-?usp=sharing\";\n } else if (tahun === '2020') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1RZhiTWFNDbPSXf6ItQ_9laKE_AwLQmuv?usp=sharing\";\n } else if (tahun === '2019') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1RcFOmNNvaEmckSoXJW3y3G4fxVDYMlDE?usp=sharing\";\n } else if (tahun === 'survei') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1V2UBuu8gGcJjCDIIRIEpgdPNq1mUUh7Z?usp=sharing\";\n } else if (tahun === 'monev') {\n targetUrl = \"https:\/\/drive.google.com\/drive\/folders\/1WhPGZXS5DqRhTopk7p9JkWGRwoiesurj?usp=sharing\";\n } else {\n targetUrl = \"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-akses-terbatas\/\";\n }\n \n window.location.href = targetUrl;\n } else if (sandi === null || sandi === \"\") {\n return;\n } else {\n alert(\"Password salah! Silakan hubungi administrator.\");\n }\n }\n<\/script>\n\n\n\n<style>\n \/* --- ANIMASI MUNCUL --- *\/\n @keyframes slideInUp {\n from {\n opacity: 0;\n transform: translateY(30px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n :root {\n --blue-primary: #1e3a8a; \/* Deep Navy Blue *\/\n --blue-accent: #3b82f6; \/* Bright Blue for accents *\/\n --blue-soft: #eff6ff; \/* Very Light Azure *\/\n --blue-border: #1e3a8a; \/* Matching header border *\/\n }\n\n .ppepp-eval-mini {\n font-family: 'Inter', 'Segoe UI', -apple-system, sans-serif;\n max-width: 800px;\n margin: 10px auto;\n color: #1e293b;\n font-size: 14px;\n line-height: 1.5;\n animation: slideInUp 0.8s ease-out both;\n }\n\n .eval-card {\n border: 1px solid #e2e8f0;\n border-radius: 12px;\n padding: 24px;\n background: #fff;\n box-shadow: 0 4px 15px rgba(30, 58, 138, 0.08); \/* Soft shadow with blue tint *\/\n transition: all 0.3s ease;\n }\n\n .eval-card:hover {\n box-shadow: 0 10px 25px rgba(30, 58, 138, 0.15);\n transform: translateY(-2px);\n }\n\n .eval-header {\n border-bottom: 2px solid var(--blue-primary);\n color: var(--blue-primary);\n margin-bottom: 15px;\n padding-bottom: 8px;\n text-transform: uppercase;\n font-weight: 800;\n letter-spacing: 1px;\n }\n\n .eval-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n gap: 16px;\n margin-top: 15px;\n }\n\n .eval-item {\n background: var(--blue-soft);\n padding: 15px;\n border-radius: 10px;\n border-left: 5px solid var(--blue-primary);\n transition: transform 0.2s ease;\n }\n\n .eval-item:hover {\n background: #dbeafe; \/* Slightly darker light blue on hover *\/\n transform: scale(1.02);\n }\n\n \/* Warna Teks Biru Tua & Tebal *\/\n .text-blue-bold { \n color: var(--blue-primary); \n font-weight: 800; \n }\n<\/style>\n\n<div class=\"ppepp-eval-mini\">\n <div class=\"eval-card\">\n <div class=\"eval-header\">\ud83d\udd0d Evaluasi (E)<\/div>\n <p>Proses membandingkan <span class=\"text-blue-bold\">Pelaksanaan<\/span> dengan <span class=\"text-blue-bold\">Standar<\/span> untuk mengukur pencapaian mutu dan mengidentifikasi penyimpangan.<\/p>\n\n <div class=\"eval-grid\">\n <div class=\"eval-item\">\n <strong style=\"color: var(--blue-primary);\">Langkah Utama:<\/strong>\n <ul style=\"margin:8px 0 0 0; padding-left:18px; color: #334155;\">\n <li>Monitoring rutin<\/li>\n <li>Audit Mutu Internal (AMI)<\/li>\n <li>Rapat Tinjauan Manajemen<\/li>\n <\/ul>\n <\/div>\n <div class=\"eval-item\">\n <strong style=\"color: var(--blue-primary);\">Instrumen:<\/strong>\n <ul style=\"margin:8px 0 0 0; padding-left:18px; color: #334155;\">\n <li>Daftar Tilik<\/li>\n <li>Laporan Temuan KTS<\/li>\n <li>Survei Kepuasan<\/li>\n <\/ul>\n <\/div>\n <\/div>\n \n <p style=\"margin-top:15px; font-size:13px; color:#64748b; font-style:italic; border-top: 1px dashed #cbd5e1; padding-top: 10px;\">\n *Tanpa Evaluasi, tahap Pengendalian dan Peningkatan tidak memiliki dasar data yang kuat.\n <\/p>\n <\/div>\n<\/div>\n\n\n\n<div class=\"news-slider-container\">\n <div class=\"news-slider\" id=\"newsSlider\">\n <div style=\"padding: 30px; text-align: center; width: 100%; color: #94a3b8; font-size: 12px;\">Memuat berita terbaru…<\/div>\n <\/div>\n\n <div class=\"slider-controls\">\n <button class=\"nav-btn btn-visible\" onclick=\"moveSlide(-1)\" aria-label=\"Previous\">\n <span class=\"nav-symbol\"><<<\/span>\n <\/button>\n \n <div class=\"dots-container\" id=\"dotsContainer\"><\/div>\n \n <button class=\"nav-btn btn-visible\" onclick=\"moveSlide(1)\" aria-label=\"Next\">\n <span class=\"nav-symbol\">>><\/span>\n <\/button>\n <\/div>\n<\/div>\n\n<style>\n .news-slider-container {\n position: relative;\n max-width: 700px;\n margin: 10px auto;\n overflow: hidden;\n border-radius: 12px;\n background: #fff;\n border: 1px solid #e2e8f0;\n font-family: 'Inter', -apple-system, sans-serif;\n box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);\n }\n\n .news-slider {\n display: flex;\n transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);\n }\n\n .news-slide {\n min-width: 100%;\n display: flex;\n flex-direction: column;\n }\n\n .news-slide img {\n width: 100%;\n height: 300px;\n object-fit: cover;\n background: #f1f5f9;\n }\n\n .news-caption {\n padding: 20px;\n background: #fff;\n }\n\n .news-caption h3 { \n margin: 0 0 8px; \n font-size: 16px; \n line-height: 1.4;\n font-weight: 700;\n color: #1e293b;\n }\n \n .news-caption p { \n margin: 0 0 15px; \n font-size: 13px;\n line-height: 1.6;\n color: #475569;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n }\n\n .read-more {\n display: inline-block;\n padding: 8px 16px;\n background: #1e3a8a; \/* Biru Tua *\/\n color: #fff !important;\n text-decoration: none !important;\n border-radius: 6px;\n font-size: 12px;\n font-weight: 600;\n transition: 0.3s;\n }\n\n .read-more:hover {\n background: #172554;\n box-shadow: 0 4px 12px rgba(30, 58, 138, 0.3);\n }\n\n .slider-controls {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 20px;\n border-top: 1px solid #f1f5f9;\n background: #fcfcfc;\n }\n\n .nav-btn.btn-visible {\n background: #1e3a8a;\n border: none;\n width: 40px;\n height: 36px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border-radius: 8px;\n }\n\n .nav-symbol { color: #ffffff; font-size: 14px; font-weight: bold; }\n\n .dots-container { display: flex; gap: 8px; }\n\n .dot {\n height: 8px; \n width: 8px;\n background-color: #cbd5e1; \n border-radius: 50%;\n cursor: pointer;\n transition: 0.3s;\n }\n\n .dot.active { \n background-color: #1e3a8a;\n width: 20px; \n border-radius: 10px; \n }\n\n @media (max-width: 600px) {\n .news-slide img { height: 200px; }\n .news-caption h3 { font-size: 14px; }\n }\n<\/style>\n\n<script>\n let currentSlide = 0;\n let totalSlides = 0;\n const slider = document.getElementById('newsSlider');\n const dotsContainer = document.getElementById('dotsContainer');\n\n async function fetchNews() {\n try {\n \/\/ UPDATED: categories diubah menjadi 16\n const apiUrl = 'https:\/\/lpm.stikes-hi.ac.id\/wp-json\/wp\/v2\/posts?categories=16&_embed&per_page=5';\n \n const response = await fetch(apiUrl);\n if (!response.ok) throw new Error('Network response was not ok');\n \n const posts = await response.json();\n\n if (posts && posts.length > 0) {\n slider.innerHTML = '';\n dotsContainer.innerHTML = '';\n totalSlides = posts.length;\n\n posts.forEach((post, i) => {\n let imageUrl = 'https:\/\/via.placeholder.com\/800x450\/f1f5f9\/64748b?text=STIKES+HI+JAMBI';\n \n try {\n if (post._embedded && post._embedded['wp:featuredmedia'] && post._embedded['wp:featuredmedia'][0]) {\n imageUrl = post._embedded['wp:featuredmedia'][0].source_url;\n } else if (post.content.rendered.includes('<img')) {\n const div = document.createElement('div');\n div.innerHTML = post.content.rendered;\n const firstImg = div.querySelector('img');\n if (firstImg) imageUrl = firstImg.src;\n }\n } catch (e) { console.error(\"Error parsing image\", e); }\n\n const cleanTitle = post.title.rendered\n .replace(\/ \/g, ' ')\n .replace(\/&\/g, '&')\n .replace(\/–\/g, '-')\n .replace(\/’\/g, \"'\")\n .replace(\/“\/g, '\"')\n .replace(\/”\/g, '\"');\n \n const excerpt = post.excerpt.rendered.replace(\/<[^>]*>?\/gm, '').substring(0, 100) + '...';\n\n const slide = document.createElement('div');\n slide.classList.add('news-slide');\n slide.innerHTML = `\n <img decoding=\"async\" src=\"${imageUrl}\" alt=\"${cleanTitle}\" onerror=\"this.src='https:\/\/via.placeholder.com\/800x450\/f1f5f9\/64748b?text=Berita+STIKES+HI'\">\n <div class=\"news-caption\">\n <h3>${cleanTitle}<\/h3>\n <p>${excerpt}<\/p>\n <a href=\"${post.link}\" class=\"read-more\" target=\"_blank\">Baca Selengkapnya<\/a>\n <\/div>\n `;\n slider.appendChild(slide);\n\n const dot = document.createElement('span');\n dot.classList.add('dot');\n if (i === 0) dot.classList.add('active');\n dot.onclick = () => goToSlide(i);\n dotsContainer.appendChild(dot);\n });\n } else {\n slider.innerHTML = '<div style=\"padding: 40px; text-align: center; width: 100%; color: #64748b;\">Belum ada berita terbaru di kategori ini.<\/div>';\n }\n } catch (error) {\n console.error('Error:', error);\n slider.innerHTML = '<div style=\"padding: 40px; text-align: center; width: 100%; color: #ef4444;\">Gagal memuat berita.<\/div>';\n }\n }\n\n function updateDots() {\n const dots = document.querySelectorAll('.dot');\n dots.forEach((dot, i) => {\n dot.classList.toggle('active', i === currentSlide);\n });\n }\n\n function moveSlide(step) {\n if (totalSlides === 0) return;\n currentSlide = (currentSlide + step + totalSlides) % totalSlides;\n slider.style.transform = `translateX(-${currentSlide * 100}%)`;\n updateDots();\n }\n\n function goToSlide(index) {\n currentSlide = index;\n slider.style.transform = `translateX(-${currentSlide * 100}%)`;\n updateDots();\n }\n\n fetchNews();\n\n let autoSlide = setInterval(() => moveSlide(1), 7000);\n document.querySelector('.news-slider-container').addEventListener('mouseenter', () => clearInterval(autoSlide));\n document.querySelector('.news-slider-container').addEventListener('mouseleave', () => {\n autoSlide = setInterval(() => moveSlide(1), 7000);\n });\n<\/script>\n\n\n\n<div class=\"lpm-unified-container\">\n \n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/auditor-internal\/\" class=\"lpm-custom-button reveal\">\n <div class=\"button-content\">\n <span class=\"icon\">\ud83d\udd0d<\/span>\n <div class=\"text-group\">\n <span class=\"title\">Data Auditor Internal<\/span>\n <\/div>\n <\/div>\n <\/a>\n\n <a href=\"https:\/\/siami.stikes-hi.ac.id\/\" class=\"lpm-custom-button reveal\" target=\"_blank\" rel=\"noopener noreferrer\">\n <div class=\"button-content\">\n <span class=\"icon\">\ud83d\udda5\ufe0f<\/span>\n <div class=\"text-group\">\n <span class=\"title\">Sistem Informasi Audit Mutu Internal (SiAmi)<\/span>\n <\/div>\n <\/div>\n <\/a>\n\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/spme\/\" class=\"lpm-custom-button reveal\">\n <div class=\"button-content\">\n <span class=\"icon\">\ud83c\udfc5<\/span>\n <div class=\"text-group\">\n <span class=\"title\">Akreditasi<\/span>\n <\/div>\n <\/div>\n <\/a>\n\n<\/div>\n\n<style>\n \/* --- CSS EFEK REVEAL --- *\/\n .reveal {\n opacity: 0;\n transform: translateY(30px);\n transition: all 0.8s cubic-bezier(0.2, 1, 0.3, 1);\n visibility: hidden;\n }\n\n .reveal.active {\n opacity: 1;\n transform: translateY(0);\n visibility: visible;\n }\n\n \/* --- STYLE DASAR --- *\/\n .lpm-unified-container {\n max-width: 600px;\n margin: 15px auto;\n font-family: 'Inter', system-ui, sans-serif;\n display: flex;\n flex-direction: column;\n gap: 15px;\n }\n\n .lpm-custom-button {\n width: 100%;\n display: flex;\n justify-content: flex-start;\n align-items: center;\n padding: 16px 20px;\n background: #ffffff;\n border: 1px solid #e2e8f0;\n border-radius: 10px;\n text-decoration: none !important;\n box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n transition: transform 0.2s, background 0.2s, box-shadow 0.2s, opacity 0.8s, transform 0.8s;\n cursor: pointer;\n box-sizing: border-box;\n }\n\n .lpm-custom-button:hover {\n background: #f8fafc;\n transform: translateY(-2px);\n box-shadow: 0 6px 15px rgba(0,0,0,0.08);\n border-color: #cbd5e1;\n }\n\n .button-content {\n display: flex;\n align-items: center;\n gap: 15px;\n text-align: left;\n }\n\n .icon { font-size: 20px; }\n\n .text-group .title {\n font-weight: 700;\n color: #1e293b;\n font-size: 15px;\n line-height: 1.3;\n text-transform: none !important;\n }\n\n \/* Responsif Mobile *\/\n @media (max-width: 480px) {\n .lpm-custom-button { padding: 14px 15px; }\n .text-group .title { font-size: 14px; }\n }\n<\/style>\n\n<script>\n\/\/ Efek Muncul Saat Scroll (Intersection Observer)\ndocument.addEventListener('DOMContentLoaded', function() {\n const observerOptions = {\n threshold: 0.15 \n };\n\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('active');\n }\n });\n }, observerOptions);\n\n document.querySelectorAll('.reveal').forEach(el => {\n observer.observe(el);\n });\n});\n<\/script>\n\n\n\n<div class=\"lpm-history-wrapper lpm-scroll-reveal\">\n <div class=\"lpm-dropdown-container\">\n <button class=\"lpm-dropdown-trigger\" onclick=\"toggleSiklus(this)\">\n <div class=\"trigger-content\">\n <span class=\"icon\">\ud83d\udd04<\/span>\n <div class=\"text-group\">\n <span class=\"title\">Kalender Audit Tahunan<\/span>\n <\/div>\n <\/div>\n <i class=\"arrow-icon\"><\/i>\n <\/button>\n\n <div class=\"lpm-dropdown-content\" id=\"siklusContent\">\n <div class=\"lpm-timeline-compact\">\n <div class=\"timeline-path\">\n \n <div class=\"timeline-node cat-monitoring\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Januari – Maret<\/span>\n <h4 class=\"t-title\">Monitoring Ganjil<\/h4>\n <p class=\"t-desc\">Pengawasan standar pembelajaran dan layanan unit.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-survey\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Februari<\/span>\n <h4 class=\"t-title\">Survei Kepuasan Ganjil<\/h4>\n <p class=\"t-desc\">Pengumpulan data kepuasan mahasiswa, dosen, dan tendik.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-monitoring\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Juli – September<\/span>\n <h4 class=\"t-title\">Monitoring Genap<\/h4>\n <p class=\"t-desc\">Pemantauan efektivitas proses akademik semester genap.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-survey\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Agustus<\/span>\n <h4 class=\"t-title\">Survei Kepuasan Genap<\/h4>\n <p class=\"t-desc\">Evaluasi kepuasan layanan sebagai dasar data RTM.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-audit\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">September – Oktober<\/span>\n <h4 class=\"t-title\">Audit Mutu Internal (AMI)<\/h4>\n <p class=\"t-desc\">Verifikasi kesesuaian standar di seluruh unit kerja.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-rtm\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Oktober<\/span>\n <h4 class=\"t-title\">Rapat Tinjauan Manajemen<\/h4>\n <p class=\"t-desc\">Tindak lanjut temuan audit oleh pimpinan institusi.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-peningkatan\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Desember – Januari<\/span>\n <h4 class=\"t-title\">Perumusan Peningkatan<\/h4>\n <p class=\"t-desc\">Menaikkan target indikator hasil evaluasi siklus.<\/p>\n <\/div>\n <\/div>\n\n <div class=\"timeline-node cat-peningkatan\">\n <div class=\"timeline-card-compact\">\n <span class=\"t-month\">Januari<\/span>\n <h4 class=\"t-title\">Sosialisasi Peningkatan<\/h4>\n <p class=\"t-desc\">Penyampaian dokumen standar baru kepada sivitas.<\/p>\n <\/div>\n <\/div>\n\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n<\/div>\n\n<style>\n \/* --- CSS BARU UNTUK EFEK SCROLL REVEAL --- *\/\n .lpm-scroll-reveal {\n opacity: 0;\n transform: translateY(30px);\n transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);\n visibility: hidden;\n }\n\n .lpm-scroll-reveal.reveal-active {\n opacity: 1;\n transform: translateY(0);\n visibility: visible;\n }\n\n \/* --- STYLE ASLI --- *\/\n .lpm-history-wrapper {\n max-width: 600px;\n margin: 15px auto;\n font-family: 'Inter', system-ui, sans-serif;\n }\n\n .lpm-dropdown-container {\n background: #ffffff;\n border: 1px solid #e2e8f0;\n border-radius: 10px;\n overflow: hidden;\n box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n }\n\n .lpm-dropdown-trigger {\n width: 100%;\n padding: 15px 20px;\n background: #fff;\n border: none;\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: pointer;\n transition: background 0.2s;\n }\n\n .lpm-dropdown-trigger:hover { background: #f8fafc; }\n .trigger-content { display: flex; align-items: center; gap: 12px; }\n .trigger-content .icon { font-size: 18px; }\n \n .trigger-content .title { \n font-weight: 700; \n color: #1e293b; \n font-size: 15px;\n text-transform: none !important; \n }\n\n .arrow-icon {\n width: 7px; height: 7px;\n border-right: 2px solid #64748b;\n border-bottom: 2px solid #64748b;\n transform: rotate(45deg);\n transition: transform 0.3s ease;\n }\n\n .lpm-dropdown-content {\n max-height: 0;\n overflow: hidden;\n transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);\n background: #fdfdfd;\n }\n\n .active .lpm-dropdown-content {\n max-height: 1500px;\n transition: max-height 0.8s ease-in;\n }\n\n .active .arrow-icon { transform: rotate(-135deg); }\n\n .lpm-timeline-compact { padding: 20px; }\n .timeline-path {\n position: relative;\n padding-left: 20px;\n border-left: 2px solid #f1f5f9;\n margin-left: 10px;\n }\n\n .timeline-node {\n position: relative;\n margin-bottom: 12px;\n opacity: 0;\n transform: translateX(20px);\n }\n\n .active .timeline-node {\n animation: fadeInNode 0.5s ease-out forwards;\n }\n\n @keyframes fadeInNode {\n to { opacity: 1; transform: translateX(0); }\n }\n\n .timeline-node::before {\n content: '';\n position: absolute;\n left: -27px;\n top: 12px;\n width: 10px;\n height: 10px;\n background: #fff;\n border: 2.5px solid #cbd5e1;\n border-radius: 50%;\n z-index: 2;\n }\n\n .timeline-card-compact {\n background: #fff;\n border-radius: 8px;\n padding: 8px 15px;\n border: 1px solid #f1f5f9;\n border-left: 4px solid #cbd5e1;\n }\n\n .t-month {\n font-size: 9px;\n font-weight: 800;\n color: #94a3b8;\n display: block;\n text-transform: none !important;\n }\n\n .t-title { font-size: 13px; font-weight: 700; color: #1e293b; margin: 2px 0; }\n .t-desc { font-size: 11px; color: #64748b; margin: 0; line-height: 1.4; }\n\n .cat-monitoring .timeline-card-compact { border-left-color: #3b82f6; }\n .cat-survey .timeline-card-compact { border-left-color: #10b981; }\n .cat-audit .timeline-card-compact { border-left-color: #f59e0b; }\n .cat-rtm .timeline-card-compact { border-left-color: #ef4444; }\n .cat-peningkatan .timeline-card-compact { border-left-color: #8B0000; }\n\n .active .timeline-node:nth-child(1) { animation-delay: 0.1s; }\n .active .timeline-node:nth-child(2) { animation-delay: 0.15s; }\n .active .timeline-node:nth-child(3) { animation-delay: 0.2s; }\n .active .timeline-node:nth-child(4) { animation-delay: 0.25s; }\n .active .timeline-node:nth-child(5) { animation-delay: 0.3s; }\n .active .timeline-node:nth-child(6) { animation-delay: 0.35s; }\n .active .timeline-node:nth-child(7) { animation-delay: 0.4s; }\n .active .timeline-node:nth-child(8) { animation-delay: 0.45s; }\n<\/style>\n\n<script>\n\/\/ 1. Fungsi Toggle Dropdown (Asli)\nfunction toggleSiklus(btn) {\n const container = btn.parentElement;\n container.classList.toggle('active');\n}\n\n\/\/ 2. Skrip Intersection Observer untuk Scroll Reveal\ndocument.addEventListener('DOMContentLoaded', function() {\n const observerOptions = {\n threshold: 0.15 \/\/ Elemen muncul saat 15% bagian terlihat\n };\n\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('reveal-active');\n \/\/ observer.unobserve(entry.target); \/\/ Buka komen ini jika ingin animasi hanya 1x saja\n }\n });\n }, observerOptions);\n\n const revealElements = document.querySelectorAll('.lpm-scroll-reveal');\n revealElements.forEach(el => observer.observe(el));\n});\n<\/script>\n\n\n\n<div id=\"siami-portal-modern\" class=\"siami-reveal\">\n <style>\n \/* Efek Animasi Masuk *\/\n .siami-reveal {\n opacity: 0;\n transform: translateY(50px);\n transition: all 0.8s cubic-bezier(0.22, 1, 0.36, 1);\n }\n\n \/* Class aktif yang dipicu oleh JavaScript *\/\n .siami-reveal.active {\n opacity: 1;\n transform: translateY(0);\n }\n\n #siami-portal-modern {\n margin: 20px auto;\n max-width: 450px;\n padding: 40px 20px;\n background: #ffffff;\n border-radius: 15px;\n border: 1px solid #3e9ac9; \n box-shadow: 0 4px 25px rgba(0,0,0,0.1);\n font-family: 'Segoe UI', Arial, sans-serif;\n text-align: center;\n }\n\n #siami-portal-modern .logo-box {\n margin-bottom: 25px;\n }\n\n #siami-portal-modern .logo-box img {\n max-width: 100px;\n height: auto;\n }\n\n #siami-portal-modern .main-title {\n font-size: 1.25rem;\n color: #3f4e85;\n font-weight: 600;\n line-height: 1.2;\n margin: 0 0 30px 0;\n }\n\n #siami-portal-modern .btn-group {\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-bottom: 25px;\n padding: 0 10px;\n }\n\n #siami-portal-modern .siami-btn {\n display: block;\n padding: 16px;\n border-radius: 40px;\n color: #ffffff !important;\n text-decoration: none !important;\n text-transform: uppercase;\n font-size: 0.85rem;\n font-weight: 700;\n letter-spacing: 0.8px;\n transition: transform 0.2s ease, opacity 0.2s ease;\n }\n\n #siami-portal-modern .siami-btn:hover {\n opacity: 0.9;\n transform: scale(1.02);\n }\n\n .btn-auditor { background-color: #a93ec9; }\n .btn-ketua { background-color: #3ec953; }\n .btn-prodi { background-color: #3e9ac9; }\n .btn-lpm { background-color: #fbb001; }\n\n #siami-portal-modern .footer-text {\n font-size: 0.8rem;\n color: #7f8c8d;\n margin-top: 25px;\n }\n <\/style>\n\n <div class=\"logo-box\">\n <img decoding=\"async\" src=\"https:\/\/storage.stikes-hi.ac.id\/stikes-hi-media\/3fbebd76-22d3-4641-a12f-ec3c51280150.png\" alt=\"Logo STIKES HI\">\n <\/div>\n\n <p class=\"main-title\">\n Sistem Informasi Audit Mutu Internal<br>(SiAmi)\n <\/p>\n\n <div class=\"btn-group\">\n <a href=\"https:\/\/siami.stikes-hi.ac.id\/\" target=\"_blank\" class=\"siami-btn btn-auditor\">Auditor<\/a>\n <a href=\"https:\/\/siami.stikes-hi.ac.id\/\" target=\"_blank\" class=\"siami-btn btn-ketua\">Ketua<\/a>\n <a href=\"https:\/\/siami.stikes-hi.ac.id\/\" target=\"_blank\" class=\"siami-btn btn-prodi\">Program Studi<\/a>\n <a href=\"https:\/\/siami.stikes-hi.ac.id\/\" target=\"_blank\" class=\"siami-btn btn-lpm\">Lembaga Penjaminan Mutu<\/a>\n <\/div>\n\n <div class=\"footer-text\">\n Copyright \u00a9 LPM STIKES HI 2023\n <\/div>\n<\/div>\n\n<script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n const observerOptions = {\n threshold: 0.15 \/\/ Animasi mulai saat 15% elemen terlihat di layar\n };\n\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('active');\n \/\/ Berhenti mengamati setelah animasi jalan sekali (opsional)\n \/\/ observer.unobserve(entry.target); \n }\n });\n }, observerOptions);\n\n const target = document.querySelector('.siami-reveal');\n if (target) {\n observer.observe(target);\n }\n });\n<\/script>\n\n\n\n<style>\n \/* Keyframe Animasi Muncul *\/\n @keyframes fadeUp {\n from {\n opacity: 0;\n transform: translateY(15px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n .ppepp-mini-wrapper {\n display: flex;\n flex-wrap: wrap;\n gap: 10px;\n justify-content: center;\n padding: 15px 5px;\n font-family: 'Inter', -apple-system, sans-serif;\n }\n\n .ppepp-btn {\n display: flex;\n align-items: center;\n padding: 6px 14px;\n border-radius: 50px;\n text-decoration: none !important;\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n border: 1px solid transparent;\n background: #f8f9fa;\n box-shadow: 0 2px 4px rgba(0,0,0,0.05);\n \n \/* Terapkan animasi ke tombol *\/\n animation: fadeUp 0.5s ease-out both;\n }\n\n \/* Delay bergantian agar muncul satu per satu *\/\n .btn-p1 { animation-delay: 0.1s; }\n .btn-p2 { animation-delay: 0.2s; }\n .btn-e { animation-delay: 0.3s; }\n .btn-p3 { animation-delay: 0.4s; }\n .btn-p4 { animation-delay: 0.5s; }\n\n .ppepp-char {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 22px;\n height: 22px;\n border-radius: 50%;\n color: #fff;\n font-weight: 800;\n font-size: 11px;\n margin-right: 8px;\n flex-shrink: 0;\n }\n\n .ppepp-text {\n font-size: 13px;\n font-weight: 600;\n color: #444;\n white-space: nowrap;\n }\n\n \/* Warna Identitas *\/\n .btn-p1 .ppepp-char { background: #e74c3c; } .btn-p1:hover { border-color: #e74c3c; background: #fff5f5; }\n .btn-p2 .ppepp-char { background: #3498db; } .btn-p2:hover { border-color: #3498db; background: #f0f7ff; }\n .btn-e .ppepp-char { background: #2ecc71; } .btn-e:hover { border-color: #2ecc71; background: #f2fff7; }\n .btn-p3 .ppepp-char { background: #f1c40f; } .btn-p3:hover { border-color: #f1c40f; background: #fffdf0; }\n .btn-p4 .ppepp-char { background: #c0392b; } .btn-p4:hover { border-color: #c0392b; background: #fff5f5; }\n\n .ppepp-btn:hover {\n transform: translateY(-3px);\n box-shadow: 0 6px 12px rgba(0,0,0,0.08);\n }\n\n @media (max-width: 480px) {\n .ppepp-mini-wrapper { gap: 6px; }\n .ppepp-btn { padding: 5px 10px; }\n .ppepp-text { font-size: 11px; }\n .ppepp-char { width: 18px; height: 18px; font-size: 9px; margin-right: 5px; }\n }\n<\/style>\n\n<div class=\"ppepp-mini-wrapper\">\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-mutu\/\" class=\"ppepp-btn btn-p1\">\n <div class=\"ppepp-char\">P<\/div> <span class=\"ppepp-text\">Penetapan<\/span>\n <\/a>\n\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/pelaksanaan\/\" class=\"ppepp-btn btn-p2\">\n <div class=\"ppepp-char\">P<\/div> <span class=\"ppepp-text\">Pelaksanaan<\/span>\n <\/a>\n\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-monev-dan-ami\/\" class=\"ppepp-btn btn-e\">\n <div class=\"ppepp-char\">E<\/div> <span class=\"ppepp-text\">Evaluasi<\/span>\n <\/a>\n\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/rapat-tinjauan-manajemen-dan-rencana-tindak-lanjut\/\" class=\"ppepp-btn btn-p3\">\n <div class=\"ppepp-char\">P<\/div> <span class=\"ppepp-text\">Pengendalian<\/span>\n <\/a>\n\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/benchmarking\/\" class=\"ppepp-btn btn-p4\">\n <div class=\"ppepp-char\">P<\/div> <span class=\"ppepp-text\">Peningkatan<\/span>\n <\/a>\n<\/div>\n\n\n\n<!DOCTYPE html>\n<html lang=\"id\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <style>\n \/* Menggunakan scope khusus agar tidak merusak CSS template utama *\/\n .faq-lpm-scope {\n --faq-accent: #1e3a8a; \/* Berubah ke Biru Tua *\/\n --faq-bg: #ffffff;\n --faq-text: #1e293b;\n --faq-muted: #64748b;\n }\n\n \/* --- TOMBOL FAQ (KANAN) --- *\/\n .faq-lpm-trigger {\n position: fixed; \n right: 0; \n top: 55%; \n transform: translateY(-50%);\n background: #1e3a8a; \/* Biru Tua *\/\n color: white; \n padding: 18px 8px;\n border-radius: 10px 0 0 10px; \n cursor: pointer; \n writing-mode: vertical-rl;\n font-weight: 700; \n letter-spacing: 1px; \n font-family: 'Inter', sans-serif;\n z-index: 1000; \n box-shadow: -2px 0 10px rgba(0,0,0,0.1);\n transition: all 0.3s ease;\n }\n \n .faq-lpm-trigger:hover { \n padding-right: 15px;\n background: #172554; \/* Biru sangat gelap saat hover *\/\n }\n\n \/* --- CONTAINER CHAT --- *\/\n .faq-lpm-container {\n position: fixed; \n right: 50px; \/* Jarak dari tepi kanan agar tidak menutupi tombol sepenuhnya *\/\n top: 55%; \n transform: translateY(-50%) scale(0.5); \/* Mulai dari skala kecil *\/\n transform-origin: right center; \/* Titik muncul dari kanan tengah (arah tombol) *\/\n width: 360px;\n max-height: 80vh; \n background: #ffffff; \n border-radius: 15px;\n box-shadow: 0 10px 25px rgba(0,0,0,0.15); \n display: none; \n flex-direction: column;\n overflow: hidden; \n z-index: 999; \n border: 1px solid #e2e8f0;\n font-family: 'Inter', sans-serif;\n opacity: 0;\n transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n }\n\n \/* State saat aktif (muncul) *\/\n .faq-lpm-container.faq-open {\n display: flex;\n opacity: 1;\n transform: translateY(-50%) scale(1);\n }\n\n .faq-lpm-header {\n padding: 15px; \n background: #1e3a8a; \/* Biru Tua *\/\n color: #ffffff;\n display: flex; justify-content: space-between; align-items: center;\n }\n\n .faq-lpm-header-text { font-size: 14px; font-weight: 600; text-transform: none; }\n .faq-lpm-close { cursor: pointer; font-family: monospace; font-size: 18px; padding: 0 5px; }\n\n .faq-lpm-body { padding: 15px; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; }\n\n .faq-lpm-item {\n background: #ffffff; border: 1px solid #e2e8f0; padding: 12px;\n border-radius: 8px; cursor: pointer; font-size: 13px; font-weight: 500;\n color: #1e293b; transition: 0.2s; text-align: left;\n }\n .faq-lpm-item:hover { \n border-color: #1e3a8a; \n background: #f0f7ff; \/* Background biru sangat muda saat hover *\/\n }\n\n .faq-lpm-ans {\n background: #f8fafc; padding: 12px; border-radius: 8px;\n font-size: 13px; line-height: 1.6; color: #64748b;\n border-left: 3px solid #1e3a8a; \/* Border kiri biru tua *\/\n display: none; margin-top: 2px;\n }\n\n \/* --- PPEPP MINI STYLE --- *\/\n .faq-lpm-link {\n display: flex; align-items: center; gap: 10px; text-decoration: none !important;\n margin-top: 10px; padding: 10px; border-radius: 8px; background: white;\n border: 1px solid #f1f5f9; transition: 0.2s;\n }\n .faq-lpm-link:hover { transform: translateY(-2px); box-shadow: 0 4px 6px rgba(0,0,0,0.05); }\n\n .faq-lpm-box {\n width: 35px; height: 35px; border-radius: 6px; display: flex;\n justify-content: center; align-items: center; color: white;\n font-weight: bold; font-size: 18px; flex-shrink: 0;\n }\n .faq-lpm-label { font-weight: bold; font-size: 12px; color: #1e293b; text-transform: uppercase; }\n\n .faq-red { background: #F00; } .faq-blue { background: #1e3a8a; } \/* Box juga disesuaikan *\/\n .faq-green { background: #70AD47; } .faq-gold { background: #FFC000; } \n .faq-darkred { background: #C00000; }\n <\/style>\n<\/head>\n<body class=\"faq-lpm-scope\">\n\n<div class=\"faq-lpm-trigger\" onclick=\"toggleFaqLPM()\">FAQ<\/div>\n\n<div class=\"faq-lpm-container\" id=\"faqLpmBox\">\n <div class=\"faq-lpm-header\">\n <span class=\"faq-lpm-header-text\" id=\"faqLpmTitle\">FAQ (Tanya Jawab)<\/span>\n <div class=\"faq-lpm-close\" onclick=\"toggleFaqLPM()\">x<\/div>\n <\/div>\n \n <div class=\"faq-lpm-body\">\n <div class=\"faq-lpm-item\" onclick=\"showFaqAns('q1')\">Di mana saya bisa melihat standar mutu?<\/div>\n <div id=\"ans-q1\" class=\"faq-lpm-ans\">\n Seluruh <strong>dokumen mutu,<\/strong> mulai dari Kebijakan, Manual\/Pedoman PPEPP, Standar, hingga Formulir\/Tata Cara Pendokumentasian dapat anda unduh langsung melalui menu <strong>“Penetapan”<\/strong> di website ini.\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-mutu\/\" class=\"faq-lpm-link\">\n <div class=\"faq-lpm-box faq-red\">P<\/div>\n <div class=\"faq-lpm-label\">Buka Penetapan<\/div>\n <\/a>\n <\/div>\n\n <div class=\"faq-lpm-item\" onclick=\"showFaqAns('q2')\">Bagaimana saya dapat mengunduh formulir mutu?<\/div>\n <div id=\"ans-q2\" class=\"faq-lpm-ans\">\n Silahkan anda mengunduh <strong>formulir mutu<\/strong> langsung melalui menu <strong>“Pelaksanaan”<\/strong> dan pilih cara Pendokumentasian di website ini. Gunakan fitur pencarian melalui browser anda untuk mempercepat mendapatkan file yang diinginkan.\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/pelaksanaan\/\" class=\"faq-lpm-link\">\n <div class=\"faq-lpm-box faq-blue\">P<\/div>\n <div class=\"faq-lpm-label\">Buka Pelaksanaan<\/div>\n <\/a>\n <\/div>\n\n <div class=\"faq-lpm-item\" onclick=\"showFaqAns('q3')\">Berapa kali AMI akan kita laksanakan?<\/div>\n <div id=\"ans-q3\" class=\"faq-lpm-ans\">\n AMI (Audit Mutu Internal) dilaksanakan secara rutin minimal 1 (satu) kali dalam setahun, biasanya bulan <strong>September<\/strong> untuk mengevaluasi kinerja seluruh Program Studi dan Unit Kerja. Klik menu <strong>“Evaluasi”<\/strong> untuk melihat dokumen AMI.\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-monev-dan-ami\/\" class=\"faq-lpm-link\">\n <div class=\"faq-lpm-box faq-green\">E<\/div>\n <div class=\"faq-lpm-label\">Buka Evaluasi<\/div>\n <\/a>\n <\/div>\n\n <div class=\"faq-lpm-item\" onclick=\"showFaqAns('q4')\">Kapan RTM dan RTL dilaksanakan?<\/div>\n <div id=\"ans-q4\" class=\"faq-lpm-ans\">\n Rapat Tinjauan Manajemen (RTM) dilaksanakan <strong>segera mungkin<\/strong> setelah AMI. Kemudian dilanjutkan Rencana Tindak Lanjut (RTL) sebagai langkah konkret untuk memperbaiki temuan audit. Dokumen RTM dan RTL dapat diakses di menu <strong>“Pengendalian”<\/strong>.\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/rapat-tinjauan-manajemen-dan-rencana-tindak-lanjut\/\" class=\"faq-lpm-link\">\n <div class=\"faq-lpm-box faq-gold\">P<\/div>\n <div class=\"faq-lpm-label\">Buka Pengendalian<\/div>\n <\/a>\n <\/div>\n\n <div class=\"faq-lpm-item\" onclick=\"showFaqAns('q5')\">Apa itu Benchmarking?<\/div>\n <div id=\"ans-q5\" class=\"faq-lpm-ans\">\n Benchmarking adalah proses sistematis untuk membandingkan <strong>(Best Practice\/Praktik Baik)<\/strong> institusi lain yang lebih unggul. Laporan benchmarking dapat dilihat di menu <strong>“Peningkatan”<\/strong> sebagai inspirasi peningkatan yang berkelanjutan.\n <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/benchmarking\/\" class=\"faq-lpm-link\">\n <div class=\"faq-lpm-box faq-darkred\">P<\/div>\n <div class=\"faq-lpm-label\">Buka Peningkatan<\/div>\n <\/a>\n <\/div>\n <\/div>\n<\/div>\n\n<script>\n function toggleFaqLPM() {\n const box = document.getElementById('faqLpmBox');\n \n if (box.style.display === 'none' || box.style.display === '') {\n box.style.display = 'flex';\n \/\/ Delay minimal agar transition CSS terbaca setelah display flex\n setTimeout(() => {\n box.classList.add('faq-open');\n runFaqScramble(document.getElementById('faqLpmTitle'));\n }, 10);\n } else {\n box.classList.remove('faq-open');\n \/\/ Sembunyikan setelah animasi transisi selesai\n setTimeout(() => {\n box.style.display = 'none';\n }, 300);\n }\n }\n\n function showFaqAns(id) {\n document.querySelectorAll('.faq-lpm-ans').forEach(el => el.style.display = 'none');\n const target = document.getElementById('ans-' + id);\n target.style.display = 'block';\n target.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n }\n\n function runFaqScramble(el) {\n const text = \"FAQ (Tanya Jawab)\";\n const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';\n let iter = 0;\n const interval = setInterval(() => {\n el.innerText = text.split(\"\").map((c, i) => {\n if(i < iter) return text[i];\n return chars[Math.floor(Math.random()*chars.length)];\n }).join(\"\");\n if(iter >= text.length) clearInterval(interval);\n iter += 1\/3;\n }, 30);\n }\n<\/script>\n\n<\/body>\n<\/html>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Akses Terbatas Dokumen Audit Mutu Internal AMI 2025 AMI 2024 AMI 2023 AMI 2022 AMI 2021 AMI 2020 AMI 2019 Survei Kepuasan Dokumen Monitoring dan Evaluasi \ud83d\udd0d Evaluasi (E) Proses membandingkan Pelaksanaan dengan Standar untuk mengukur pencapaian mutu dan mengidentifikasi … <\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-269","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/269","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/comments?post=269"}],"version-history":[{"count":109,"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/269\/revisions"}],"predecessor-version":[{"id":2236,"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/269\/revisions\/2236"}],"wp:attachment":[{"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/media?parent=269"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}