{"id":273,"date":"2026-03-04T09:42:13","date_gmt":"2026-03-04T09:42:13","guid":{"rendered":"https:\/\/lpm.stikes-hi.ac.id\/?page_id=273"},"modified":"2026-04-06T07:09:21","modified_gmt":"2026-04-06T07:09:21","slug":"dokumen-mutu","status":"publish","type":"page","link":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/dokumen-mutu\/","title":{"rendered":"Dokumen Mutu"},"content":{"rendered":"\n<style>\n  \/* --- GLOBAL ANIMATIONS --- *\/\n  @keyframes slideInRight {\n    from { opacity: 0; transform: translateX(50px); }\n    to { opacity: 1; transform: translateX(0); }\n  }\n\n  .spmi-main-container {\n    max-width: 900px;\n    margin: 20px auto;\n    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\n    animation: slideInRight 0.8s cubic-bezier(0.25, 1, 0.5, 1) both;\n    position: relative;\n    overflow: visible; \n  }\n\n  \/* --- VERTICAL GROUP STYLES --- *\/\n  .spmi-group { \n    margin-bottom: 12px; \n    display: block; \n    position: relative; \n    width: fit-content;\n    z-index: 10; \n  }\n\n  .spmi-group:hover {\n    z-index: 999;\n  }\n  \n  .spmi-btn-base {\n    color: white;\n    padding: 14px 24px;\n    font-size: 16px;\n    font-weight: bold;\n    border: none;\n    cursor: pointer;\n    border-radius: 8px;\n    min-width: 280px;\n    text-align: left;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    box-shadow: 0 4px 15px rgba(0,0,0,0.1);\n    transition: 0.3s;\n    position: relative;\n  }\n\n  .spmi-btn-base::after { \n    content: '\u25b6'; \n    font-size: 11px; \n    transition: 0.3s; \n    margin-left: 15px; \n  }\n\n  \/* Colors per Year *\/\n  .btn-2025 { background: linear-gradient(135deg, #0056b3 0%, #003d80 100%); }\n  .btn-2021 { background: #27ae60; }\n  .btn-2017 { background: linear-gradient(135deg, #e67e22 0%, #d35400 100%); }\n\n  \/* --- DROPDOWN KE KANAN --- *\/\n  .spmi-content-base {\n    display: none;\n    position: absolute;\n    left: 100%; \n    top: 0;\n    padding-left: 15px; \n    background-color: transparent; \n    min-width: 260px;\n    z-index: 1000;\n  }\n\n  .spmi-content-inner {\n    background-color: white;\n    box-shadow: 10px 10px 30px rgba(0,0,0,0.2);\n    border-radius: 8px;\n    overflow: hidden;\n    border: 1px solid #e0e0e0;\n    animation: slideInRight 0.3s ease-out;\n  }\n\n  .spmi-group:hover .spmi-content-base { \n    display: block; \n  }\n\n  .spmi-group:hover .spmi-btn-base::after { \n    transform: translateX(5px); \n  }\n\n  .spmi-content-inner a {\n    color: #444;\n    padding: 12px 20px;\n    text-decoration: none;\n    display: block;\n    border-bottom: 1px solid #f0f0f0;\n    font-size: 14px;\n    transition: 0.2s;\n  }\n\n  .spmi-content-inner a:hover { padding-left: 30px; }\n  .btn-2025-hover:hover { background-color: #f8fbff; color: #0056b3; }\n  .btn-2021-hover:hover { background-color: #f1f8f4; color: #27ae60; }\n  .btn-2017-hover:hover { background-color: #fff9f4; color: #d35400; }\n\n  \/* --- PREVIEW BOX --- *\/\n  .preview-display-box {\n    margin-top: 25px;\n    background: #fff;\n    border-radius: 12px;\n    border: 1px solid #ddd;\n    overflow: hidden;\n    box-shadow: 0 10px 25px rgba(0,0,0,0.08);\n    display: none;\n    clear: both;\n    position: relative;\n    z-index: 1; \n  }\n\n  .preview-active { animation: slideInRight 0.6s cubic-bezier(0.25, 1, 0.5, 1) forwards; }\n\n  .preview-nav-header {\n    padding: 12px 20px;\n    font-size: 13px;\n    font-weight: bold;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n  }\n\n  .header-2025 { background: #f1f4f9; color: #0056b3; border-bottom: 1px solid #ddd; }\n  .header-2021 { background: #f1f8f4; color: #27ae60; border-bottom: 1px solid #d5e8db; }\n  .header-2017 { background: #fdf2e9; color: #d35400; border-bottom: 1px solid #f5d5ba; }\n\n  .iframe-container { width: 100%; height: 550px; border: none; background: #fff; }\n\n  @media (max-width: 768px) {\n    .spmi-group { width: 100%; }\n    .spmi-btn-base { min-width: 100%; }\n    .spmi-content-base { \n      position: static; \n      width: 100%; \n      padding-left: 0;\n    }\n    .spmi-content-inner {\n      border-radius: 0 0 8px 8px;\n      box-shadow: none;\n    }\n  }\n<\/style>\n\n<div class=\"spmi-main-container\">\n  \n  <div class=\"spmi-group\">\n    <button class=\"spmi-btn-base btn-2025\">Perangkat SPMI 2025<\/button>\n    <div class=\"spmi-content-base\">\n      <div class=\"spmi-content-inner\">\n        <a href=\"javascript:void(0)\" onclick=\"viewDrive('1InugcbCcQpKtzI4YjjQ7dROgzStS-yAn', 'Kebijakan SPMI', true, 'header-2025')\" class=\"btn-2025-hover\">Kebijakan SPMI<\/a>\n        <a href=\"javascript:void(0)\" onclick=\"viewDrive('142o_IAXMqz0EYrk8wKpHuFmhKIWlsJnI', 'Pedoman Penerapan PPEPP', true, 'header-2025')\" class=\"btn-2025-hover\">Pedoman Penerapan PPEPP<\/a>\n        <a href=\"javascript:void(0)\" onclick=\"viewDrive('1JKap5cS5xnR0sRPojkg-q8Z7Wly0qsT8', 'Standar Mutu 2025', false, 'header-2025')\" class=\"btn-2025-hover\">Standar Mutu \ud83d\udd25<\/a>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"spmi-group\">\n    <button class=\"spmi-btn-base btn-2021\">Dokumen SPMI 2021<\/button>\n    <div class=\"spmi-content-base\">\n      <div class=\"spmi-content-inner\">\n        <a href=\"javascript:void(0)\" onclick=\"viewDrive('1O5m4D48c-5dcnQWa1dY30eIYZM7ICVsW', 'Revisi Standar Pendidikan', true, 'header-2021')\" class=\"btn-2021-hover\">\ud83d\udcdd Revisi Standar Pendidikan<\/a>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div class=\"spmi-group\">\n    <button class=\"spmi-btn-base btn-2017\">Dokumen SPMI 2017<\/button>\n    <div class=\"spmi-content-base\">\n      <div class=\"spmi-content-inner\">\n        <a href=\"javascript:void(0)\" onclick=\"viewDrive('1gdDC76Ky0x_UdpC2dVVR46Q9ReIBgjOY', 'Kebijakan Mutu 2017', true, 'header-2017')\" class=\"btn-2017-hover\">\ud83d\udcc4 Kebijakan Mutu<\/a>\n        <a href=\"javascript:void(0)\" onclick=\"viewDrive('0Bxm2UJCDRCiTS3Vmek5ybzZ2UW8&#038;resourcekey=0-hABLqaVsHlaJD95Lwve75Q', 'Manual Mutu 2017', false, 'header-2017')\" class=\"btn-2017-hover\">\ud83d\udcc2 Manual Mutu<\/a>\n        <a href=\"javascript:void(0)\" onclick=\"viewDrive('0Bxm2UJCDRCiTUml5aUZNMlZ2OEk&#038;resourcekey=0-bsi1oNEMWqkE1SSiCBsN6g', 'Standar Mutu 2017', false, 'header-2017')\" class=\"btn-2017-hover\">\ud83d\udcc2 Standar Mutu<\/a>\n        <a href=\"javascript:void(0)\" onclick=\"viewDrive('0Bxm2UJCDRCiTak80d194VmlfdW8&#038;resourcekey=0-5uy85N32YVq2vkFz7j6ZLg', 'Formulir Mutu 2017', false, 'header-2017')\" class=\"btn-2017-hover\">\ud83d\udcc2 Formulir Mutu<\/a>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <div id=\"universal-preview\" class=\"preview-display-box\">\n    <div id=\"preview-header-bar\" class=\"preview-nav-header\">\n      <span id=\"preview-label\">Pilih Dokumen<\/span>\n      <span style=\"background: rgba(255,255,255,0.6); padding: 3px 10px; border-radius: 15px; font-size: 10px;\">LIVE DRIVE<\/span>\n    <\/div>\n    <iframe id=\"universal-frame\" src=\"\" class=\"iframe-container\" frameborder=\"0\"><\/iframe>\n  <\/div>\n\n<\/div>\n\n<script>\n  function viewDrive(id, title, isFile, themeClass) {\n    const container = document.getElementById('universal-preview');\n    const frame = document.getElementById('universal-frame');\n    const label = document.getElementById('preview-label');\n    const header = document.getElementById('preview-header-bar');\n    \n    let driveUrl = \"\";\n    if (id.includes('http')) {\n       let folderId = id.split('\/folders\/');\n       driveUrl = \"https:\/\/drive.google.com\/embeddedfolderview?id=\" + folderId + \"#list\";\n    } else {\n       driveUrl = isFile \n        ? \"https:\/\/drive.google.com\/file\/d\/\" + id + \"\/preview\"\n        : \"https:\/\/drive.google.com\/embeddedfolderview?id=\" + id + \"#list\";\n    }\n    \n    frame.src = driveUrl;\n    label.innerHTML = \"<strong>Menampilkan:<\/strong> \" + title;\n    header.className = \"preview-nav-header \" + themeClass;\n    \n    container.style.display = 'block';\n    container.classList.remove('preview-active');\n    void container.offsetWidth; \n    container.classList.add('preview-active');\n    \n    setTimeout(() => {\n      container.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\n    }, 150);\n  }\n<\/script>\n\n\n\n\n<style>\n    @keyframes slideInRightPPEPP {\n        from { opacity: 0; transform: translateX(30px); }\n        to { opacity: 1; transform: translateX(0); }\n    }\n\n    :root {\n        --blue-primary: #1e40af; \/* Deep Royal Blue *\/\n        --blue-gradient: linear-gradient(90deg, #1e40af, #3b82f6);\n        --blue-soft: #eff6ff;\n        --text-main: #1e293b;\n        --text-muted: #64748b;\n    }\n\n    .ppepp-minimal-container {\n        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n        max-width: 320px; \n        margin: 15px 0;\n        animation: slideInRightPPEPP 0.6s ease-out both;\n        position: relative;\n        z-index: 1;\n    }\n\n    .ppepp-card-slim {\n        background: #ffffff;\n        padding: 20px;\n        border-radius: 16px;\n        \/* Shadow lebih dalam dengan rona biru tipis *\/\n        box-shadow: 0 10px 25px rgba(30, 64, 175, 0.05), 0 4px 10px rgba(0,0,0,0.02);\n        transition: all 0.3s ease;\n        position: relative;\n        overflow: hidden;\n        border: 1px solid #f1f5f9;\n    }\n\n    \/* Aksen minimalis di bagian atas - Gradasi Biru *\/\n    .ppepp-card-slim::before {\n        content: \"\";\n        position: absolute;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 4px;\n        background: var(--blue-gradient);\n    }\n\n    .ppepp-card-slim:hover {\n        transform: translateY(-4px);\n        box-shadow: 0 15px 35px rgba(30, 64, 175, 0.1);\n        border-color: #dbeafe;\n    }\n\n    .ppepp-title {\n        color: var(--blue-primary);\n        font-size: 16px;\n        font-weight: 700;\n        margin-bottom: 8px;\n        display: flex;\n        align-items: center;\n        text-transform: uppercase;\n        letter-spacing: 0.8px;\n    }\n\n    .ppepp-desc {\n        color: var(--text-muted);\n        font-size: 13px;\n        margin-bottom: 15px;\n        line-height: 1.5;\n    }\n\n    .ppepp-items {\n        padding: 0;\n        margin: 0;\n        list-style: none;\n        border-top: 1px solid #f1f5f9;\n        padding-top: 12px;\n    }\n\n    .ppepp-items li {\n        color: var(--text-main);\n        font-size: 12.5px;\n        margin-bottom: 10px;\n        display: flex;\n        align-items: flex-start;\n        gap: 10px;\n    }\n\n    .ppepp-items li strong {\n        color: var(--blue-primary);\n        font-weight: 600;\n    }\n\n    \/* Simbol Dot yang diserasikan dengan warna biru *\/\n    .ppepp-dot {\n        color: #3b82f6;\n        font-size: 18px;\n        line-height: 1;\n    }\n<\/style>\n\n<div class=\"ppepp-minimal-container\">\n    <div class=\"ppepp-card-slim\">\n        <div class=\"ppepp-title\">\n            <span>Penetapan (P1)<\/span>\n        <\/div>\n        <p class=\"ppepp-desc\">Pengesahan dan implementasi standar mutu baru sebagai awal siklus sistem penjaminan mutu.<\/p>\n        \n        <ul class=\"ppepp-items\">\n            <li>\n                <span class=\"ppepp-dot\">\ud83d\udd39<\/span>\n                <span><strong>Legalitas:<\/strong> Pengesahan SK resmi pimpinan.<\/span>\n            <\/li>\n            <li>\n                <span class=\"ppepp-dot\">\ud83d\udd39<\/span>\n                <span><strong>Sosialisasi:<\/strong> Pemahaman menyeluruh unit kerja.<\/span>\n            <\/li>\n            <li>\n                <span class=\"ppepp-dot\">\ud83d\udd39<\/span>\n                <span><strong>Eksekusi:<\/strong> Alokasi SDM, sarana &#038; anggaran.<\/span>\n            <\/li>\n        <\/ul>\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&#8230;<\/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\">&lt;&lt;<\/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\">&gt;&gt;<\/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: ID kategori diubah menjadi 17\n            const apiUrl = 'https:\/\/lpm.stikes-hi.ac.id\/wp-json\/wp\/v2\/posts?categories=17&_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(\/&nbsp;\/g, ' ')\n                        .replace(\/&amp;\/g, '&#038;')\n                        .replace(\/&#8211;\/g, '-')\n                        .replace(\/&#8217;\/g, \"'\")\n                        .replace(\/&#8220;\/g, '\"')\n                        .replace(\/&#8221;\/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-button-container-small animate-entrance\">\n    <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/profil-lpm\/\" class=\"lpm-btn-sm-outline\">\n        <span class=\"icon\">\u2139\ufe0f<\/span> Profil LPM\n    <\/a>\n    \n    <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/gugus-kendali-mutu-program-studi\/\" class=\"lpm-btn-sm-outline\">\n        <span class=\"icon\">\ud83d\udee1\ufe0f<\/span> GKM Prodi\n    <\/a>\n    \n    <a href=\"https:\/\/lpm.stikes-hi.ac.id\/index.php\/auditor-internal\/\" class=\"lpm-btn-sm-outline\">\n        <span class=\"icon\">\ud83d\udd0d<\/span> Auditor\n    <\/a>\n<\/div>\n\n<style>\n    \/* Animasi Muncul ke Atas (Konsisten dengan modul lain) *\/\n    @keyframes entranceFadeUp {\n        from { opacity: 0; transform: translateY(20px); }\n        to { opacity: 1; transform: translateY(0); }\n    }\n\n    .animate-entrance {\n        animation: entranceFadeUp 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;\n    }\n\n    .lpm-button-container-small {\n        display: flex;\n        flex-direction: row;\n        flex-wrap: wrap;\n        justify-content: center;\n        gap: 10px; \/* Jarak lebih rapat *\/\n        padding: 15px 0;\n        width: 100%;\n        max-width: 700px;\n        margin: 0 auto;\n    }\n\n    \/* Gaya Tombol Versi Kecil *\/\n    .lpm-btn-sm-outline {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        background-color: transparent;\n        color: #0056b3 !important;\n        padding: 6px 14px; \/* Padding diperkecil *\/\n        text-decoration: none !important;\n        border-radius: 6px; \/* Radius lebih kecil *\/\n        font-family: 'Inter', system-ui, sans-serif;\n        font-size: 12px; \/* Ukuran font diperkecil *\/\n        font-weight: 600;\n        transition: all 0.3s ease;\n        border: 1.5px solid #0056b3; \/* Border lebih tipis *\/\n        box-sizing: border-box;\n        white-space: nowrap;\n    }\n\n    \/* Efek Hover *\/\n    .lpm-btn-sm-outline:hover {\n        background-color: #0056b3;\n        color: #ffffff !important;\n        transform: translateY(-3px); \/* Efek naik lebih halus *\/\n        box-shadow: 0 4px 10px rgba(0, 86, 179, 0.15);\n    }\n\n    .icon {\n        margin-right: 6px;\n        font-size: 14px; \/* Icon diperkecil *\/\n    }\n\n    \/* Responsif Mobile *\/\n    @media screen and (max-width: 600px) {\n        .lpm-button-container-small {\n            gap: 8px;\n        }\n        .lpm-btn-sm-outline {\n            flex: 1; \/* Di mobile tombol membagi ruang rata *\/\n            min-width: 100px;\n            font-size: 11px;\n            padding: 8px 10px;\n        }\n    }\n<\/style>\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>&#8220;Penetapan&#8221;<\/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>&#8220;Pelaksanaan&#8221;<\/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>&#8220;Evaluasi&#8221;<\/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>&#8220;Pengendalian&#8221;<\/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>&#8220;Peningkatan&#8221;<\/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>Perangkat SPMI 2025 Kebijakan SPMI Pedoman Penerapan PPEPP Standar Mutu \ud83d\udd25 Dokumen SPMI 2021 \ud83d\udcdd Revisi Standar Pendidikan Dokumen SPMI 2017 \ud83d\udcc4 Kebijakan Mutu \ud83d\udcc2 Manual Mutu \ud83d\udcc2 Standar Mutu \ud83d\udcc2 Formulir Mutu Pilih Dokumen LIVE DRIVE Penetapan (P1) Pengesahan &hellip; <\/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-273","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/273","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=273"}],"version-history":[{"count":77,"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/273\/revisions"}],"predecessor-version":[{"id":1872,"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/273\/revisions\/1872"}],"wp:attachment":[{"href":"https:\/\/lpm.stikes-hi.ac.id\/index.php\/wp-json\/wp\/v2\/media?parent=273"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}