{"id":1132,"date":"2026-08-25T11:47:59","date_gmt":"2026-08-25T04:47:59","guid":{"rendered":"https:\/\/iptar.ac.id\/?page_id=1132"},"modified":"2026-08-25T12:32:13","modified_gmt":"2026-08-25T05:32:13","slug":"humas","status":"publish","type":"page","link":"https:\/\/iptar.ac.id\/index.php\/humas\/","title":{"rendered":"HUMAS"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1132\" class=\"elementor elementor-1132\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a21ec26 e-con-full e-flex e-con e-parent\" data-id=\"a21ec26\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6f7cf65 elementor-widget elementor-widget-html\" data-id=\"6f7cf65\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- =========================================================\n     HUMAS IPTAR\n     HUBUNGAN MASYARAKAT\n     FULL WIDTH ELEMENTOR\n     HTML + CSS + JAVASCRIPT\n========================================================= -->\n\n<section id=\"humas-iptar\">\n\n    <!-- BACKGROUND DECORATION -->\n    <div class=\"humas-bg-circle humas-bg-one\"><\/div>\n    <div class=\"humas-bg-circle humas-bg-two\"><\/div>\n    <div class=\"humas-bg-dots\"><\/div>\n\n    <div class=\"humas-container\">\n\n\n        <!-- =====================================================\n             DATA HUMAS\n             EDIT BAGIAN INI SAJA\n        ====================================================== -->\n\n        <script>\n\n        const DATA_HUMAS = {\n\n            \/* =================================================\n               IDENTITAS\n            ================================================= *\/\n\n            singkatan: \"HUMAS\",\n\n            nama:\n            \"Hubungan Masyarakat IPTAR\",\n\n            tagline:\n            \"Communication \u2022 Publication \u2022 Information \u2022 Branding\",\n\n\n            \/* =================================================\n               KEPALA HUMAS\n            ================================================= *\/\n\n            kepala:\n            \"Muhamad Fadlhi Gusvino, S.Si\",\n\n            jabatan:\n            \"Kepala Hubungan Masyarakat\",\n\n\n            \/* =================================================\n               FOTO KEPALA HUMAS\n\n               Ganti dengan URL foto dari:\n               WordPress Media Library\n               atau Google Drive\n            ================================================= *\/\n\n            foto:\n            \"https:\/\/ui-avatars.com\/api\/?name=Muhamad+Fadlhi+Gusvino&background=059669&color=ffffff&size=600&bold=true\",\n\n\n            \/* =================================================\n               DESKRIPSI\n            ================================================= *\/\n\n            deskripsi: `\n\n                <strong>Hubungan Masyarakat (Humas) IPTAR<\/strong>\n                merupakan unit yang berperan dalam membangun,\n                mengelola, dan memperkuat komunikasi serta citra\n                Institut Pendidikan dan Teknologi 'Aisyiyah Riau\n                kepada masyarakat dan seluruh pemangku kepentingan.\n\n                <br><br>\n\n                Humas IPTAR melaksanakan pengelolaan informasi,\n                publikasi kegiatan, media sosial, dokumentasi,\n                hubungan media, penyebarluasan informasi institusi,\n                serta mendukung penguatan branding IPTAR secara\n                profesional, informatif, kreatif, dan berkelanjutan.\n\n            `,\n\n\n            \/* =================================================\n               LAYANAN \/ FOKUS HUMAS\n            ================================================= *\/\n\n            layanan: [\n\n                {\n                    icon: \"publication\",\n\n                    kategori:\n                    \"Publikasi\",\n\n                    nama:\n                    \"Publikasi Kampus\",\n\n                    deskripsi:\n                    \"Publikasi kegiatan akademik, kemahasiswaan, penelitian, pengabdian, prestasi dan informasi institusi.\"\n                },\n\n                {\n                    icon: \"social\",\n\n                    kategori:\n                    \"Digital Media\",\n\n                    nama:\n                    \"Media Sosial\",\n\n                    deskripsi:\n                    \"Pengelolaan konten dan komunikasi melalui kanal media sosial resmi IPTAR.\"\n                },\n\n                {\n                    icon: \"camera\",\n\n                    kategori:\n                    \"Dokumentasi\",\n\n                    nama:\n                    \"Dokumentasi Kegiatan\",\n\n                    deskripsi:\n                    \"Dokumentasi foto dan video kegiatan resmi institusi untuk kebutuhan publikasi dan arsip.\"\n                },\n\n                {\n                    icon: \"news\",\n\n                    kategori:\n                    \"Media\",\n\n                    nama:\n                    \"Berita & Press Release\",\n\n                    deskripsi:\n                    \"Penyusunan berita kampus, siaran pers, publikasi website dan penyampaian informasi kepada media.\"\n                },\n\n                {\n                    icon: \"branding\",\n\n                    kategori:\n                    \"Branding\",\n\n                    nama:\n                    \"Branding Institusi\",\n\n                    deskripsi:\n                    \"Penguatan identitas, citra dan konsistensi komunikasi visual Institut Pendidikan dan Teknologi 'Aisyiyah Riau.\"\n                },\n\n                {\n                    icon: \"communication\",\n\n                    kategori:\n                    \"Komunikasi\",\n\n                    nama:\n                    \"Informasi Publik\",\n\n                    deskripsi:\n                    \"Mendukung penyampaian informasi institusi kepada mahasiswa, masyarakat, mitra dan pemangku kepentingan.\"\n                }\n\n            ],\n\n\n            \/* =================================================\n               MEDIA RESMI\n               GANTI LINK SESUAI AKUN RESMI IPTAR\n            ================================================= *\/\n\n            media: [\n\n                {\n                    icon: \"instagram\",\n                    nama: \"Instagram\",\n                    akun: \"@kampus.iptar\",\n                    url: \"https:\/\/instagram.com\/kampus.iptar\"\n                },\n\n                {\n                    icon: \"tiktok\",\n                    nama: \"TikTok\",\n                    akun: \"@kampus.iptar\",\n                    url: \"https:\/\/tiktok.com\/@kampus.iptar\"\n                },\n\n                {\n                    icon: \"youtube\",\n                    nama: \"YouTube\",\n                    akun: \"Kampus IPTAR\",\n                    url: \"#\"\n                },\n\n                {\n                    icon: \"website\",\n                    nama: \"Website\",\n                    akun: \"Website Resmi IPTAR\",\n                    url: \"#\"\n                }\n\n            ],\n\n\n            \/* =================================================\n               DOKUMEN HUMAS\n\n               nama      = nama dokumen\n               kategori  = kategori\n               tahun     = tahun\n               cover     = URL gambar cover\n               fileId    = ID Google Drive\n            ================================================= *\/\n\n            dokumen: [\n\n                {\n                    nama:\n                    \"Pedoman Publikasi IPTAR\",\n\n                    kategori:\n                    \"Pedoman\",\n\n                    tahun:\n                    \"2026\",\n\n                    cover:\n                    \"https:\/\/drive.google.com\/thumbnail?id=GANTI_ID_COVER_1&sz=w800\",\n\n                    fileId:\n                    \"GANTI_ID_FILE_1\"\n                },\n\n                {\n                    nama:\n                    \"Panduan Identitas Visual IPTAR\",\n\n                    kategori:\n                    \"Branding\",\n\n                    tahun:\n                    \"2026\",\n\n                    cover:\n                    \"https:\/\/drive.google.com\/thumbnail?id=GANTI_ID_COVER_2&sz=w800\",\n\n                    fileId:\n                    \"GANTI_ID_FILE_2\"\n                },\n\n                {\n                    nama:\n                    \"Program Kerja Humas\",\n\n                    kategori:\n                    \"Program Kerja\",\n\n                    tahun:\n                    \"2026\",\n\n                    cover:\n                    \"https:\/\/drive.google.com\/thumbnail?id=GANTI_ID_COVER_3&sz=w800\",\n\n                    fileId:\n                    \"GANTI_ID_FILE_3\"\n                },\n\n                {\n                    nama:\n                    \"Template Publikasi Kegiatan\",\n\n                    kategori:\n                    \"Template\",\n\n                    tahun:\n                    \"2026\",\n\n                    cover:\n                    \"https:\/\/drive.google.com\/thumbnail?id=GANTI_ID_COVER_4&sz=w800\",\n\n                    fileId:\n                    \"GANTI_ID_FILE_4\"\n                },\n\n                {\n                    nama:\n                    \"Laporan Kegiatan Humas\",\n\n                    kategori:\n                    \"Laporan\",\n\n                    tahun:\n                    \"2026\",\n\n                    cover:\n                    \"https:\/\/drive.google.com\/thumbnail?id=GANTI_ID_COVER_5&sz=w800\",\n\n                    fileId:\n                    \"GANTI_ID_FILE_5\"\n                },\n\n                {\n                    nama:\n                    \"Dokumentasi dan Publikasi Institusi\",\n\n                    kategori:\n                    \"Dokumentasi\",\n\n                    tahun:\n                    \"2026\",\n\n                    cover:\n                    \"https:\/\/drive.google.com\/thumbnail?id=GANTI_ID_COVER_6&sz=w800\",\n\n                    fileId:\n                    \"GANTI_ID_FILE_6\"\n                }\n\n            ]\n\n        };\n\n        <\/script>\n\n\n\n        <!-- =====================================================\n             PROFIL HUMAS\n        ====================================================== -->\n\n        <section class=\"humas-profile-section\">\n\n\n            <!-- ===============================================\n                 KEPALA HUMAS\n            ================================================ -->\n\n            <div class=\"humas-profile\">\n\n                <div class=\"humas-photo-wrap\">\n\n                    <div class=\"humas-photo-decoration\"><\/div>\n\n                    <div class=\"humas-photo\">\n\n                        <div class=\"humas-photo-fallback\">\n                            HUMAS\n                        <\/div>\n\n                        <img decoding=\"async\"\n                            id=\"humasFoto\"\n                            src=\"\"\n                            alt=\"Kepala Humas IPTAR\"\n                            loading=\"lazy\"\n                        >\n\n                    <\/div>\n\n\n                    <div class=\"humas-position-badge\">\n\n                        <svg\n                            width=\"15\"\n                            height=\"15\"\n                            viewBox=\"0 0 24 24\"\n                            fill=\"none\"\n                            stroke=\"currentColor\"\n                            stroke-width=\"2\">\n\n                            <path d=\"M20 21v-2a4 4 0 0 0-4-4H8\n                                     a4 4 0 0 0-4 4v2\">\n                            <\/path>\n\n                            <circle cx=\"12\" cy=\"7\" r=\"4\"><\/circle>\n\n                        <\/svg>\n\n                        Kepala Humas\n\n                    <\/div>\n\n                <\/div>\n\n\n                <div class=\"humas-leader-info\">\n\n                    <span>\n                        Kepala Unit\n                    <\/span>\n\n                    <h3 id=\"humasKepala\"><\/h3>\n\n                    <p id=\"humasJabatan\"><\/p>\n\n                <\/div>\n\n            <\/div>\n\n\n\n            <!-- ===============================================\n                 INFORMASI HUMAS\n            ================================================ -->\n\n            <div class=\"humas-info\">\n\n\n                <div class=\"humas-label\">\n\n                    <span class=\"humas-label-icon\">\n\n                        <svg\n                            width=\"17\"\n                            height=\"17\"\n                            viewBox=\"0 0 24 24\"\n                            fill=\"none\"\n                            stroke=\"currentColor\"\n                            stroke-width=\"2\">\n\n                            <path d=\"M3 11l18-5v12L3 13z\"><\/path>\n\n                            <path d=\"M11.6 16.8L13 21H8l-1.5-6\"><\/path>\n\n                        <\/svg>\n\n                    <\/span>\n\n                    INFORMASI & KOMUNIKASI IPTAR\n\n                <\/div>\n\n\n                <div\n                    class=\"humas-kicker\"\n                    id=\"humasTagline\">\n                <\/div>\n\n\n                <h1>\n\n                    <span id=\"humasSingkatan\">\n                        HUMAS\n                    <\/span>\n\n                    <small>\n                        IPTAR\n                    <\/small>\n\n                <\/h1>\n\n\n                <h2 id=\"humasNama\"><\/h2>\n\n\n                <div class=\"humas-title-line\">\n\n                    <span><\/span>\n                    <i><\/i>\n                    <span><\/span>\n\n                <\/div>\n\n\n                <div\n                    class=\"humas-description\"\n                    id=\"humasDescription\">\n                <\/div>\n\n\n\n                <!-- VALUE -->\n\n                <div class=\"humas-values\">\n\n\n                    <div class=\"humas-value\">\n\n                        <div class=\"humas-value-icon\">\n\n                            <svg\n                                width=\"19\"\n                                height=\"19\"\n                                viewBox=\"0 0 24 24\"\n                                fill=\"none\"\n                                stroke=\"currentColor\"\n                                stroke-width=\"2\">\n\n                                <path d=\"M3 11l18-5v12L3 13z\"><\/path>\n\n                            <\/svg>\n\n                        <\/div>\n\n                        <div>\n\n                            <strong>\n                                Publikasi\n                            <\/strong>\n\n                            <span>\n                                Informasi institusi\n                            <\/span>\n\n                        <\/div>\n\n                    <\/div>\n\n\n\n                    <div class=\"humas-value\">\n\n                        <div class=\"humas-value-icon yellow\">\n\n                            <svg\n                                width=\"19\"\n                                height=\"19\"\n                                viewBox=\"0 0 24 24\"\n                                fill=\"none\"\n                                stroke=\"currentColor\"\n                                stroke-width=\"2\">\n\n                                <circle\n                                    cx=\"12\"\n                                    cy=\"12\"\n                                    r=\"10\">\n                                <\/circle>\n\n                                <path d=\"M2 12h20\"><\/path>\n\n                                <path d=\"M12 2a15 15 0 0 1 4 10\n                                         15 15 0 0 1-4 10\n                                         15 15 0 0 1-4-10\n                                         15 15 0 0 1 4-10z\">\n                                <\/path>\n\n                            <\/svg>\n\n                        <\/div>\n\n                        <div>\n\n                            <strong>\n                                Digital\n                            <\/strong>\n\n                            <span>\n                                Website & media sosial\n                            <\/span>\n\n                        <\/div>\n\n                    <\/div>\n\n\n\n                    <div class=\"humas-value\">\n\n                        <div class=\"humas-value-icon orange\">\n\n                            <svg\n                                width=\"19\"\n                                height=\"19\"\n                                viewBox=\"0 0 24 24\"\n                                fill=\"none\"\n                                stroke=\"currentColor\"\n                                stroke-width=\"2\">\n\n                                <circle\n                                    cx=\"12\"\n                                    cy=\"12\"\n                                    r=\"3\">\n                                <\/circle>\n\n                                <path d=\"M20.4 15\n                                         a1.65 1.65 0 0 0 .33 1.82\n                                         l.06.06\n                                         a2 2 0 1 1-2.83 2.83\n                                         l-.06-.06\n                                         a1.65 1.65 0 0 0-1.82-.33\n                                         1.65 1.65 0 0 0-1 1.51V21\n                                         a2 2 0 1 1-4 0v-.09\n                                         a1.65 1.65 0 0 0-1.08-1.51\n                                         1.65 1.65 0 0 0-1.82.33\n                                         l-.06.06\n                                         a2 2 0 1 1-2.83-2.83\n                                         l.06-.06\n                                         A1.65 1.65 0 0 0 5.6 15\n                                         a1.65 1.65 0 0 0-1.51-1H4\n                                         a2 2 0 1 1 0-4h.09\n                                         A1.65 1.65 0 0 0 5.6 9\n                                         a1.65 1.65 0 0 0-.33-1.82\n                                         l-.06-.06\n                                         a2 2 0 1 1 2.83-2.83\n                                         l.06.06\n                                         a1.65 1.65 0 0 0 1.82.33H10\n                                         A1.65 1.65 0 0 0 11 3.17V3\n                                         a2 2 0 1 1 4 0v.09\n                                         a1.65 1.65 0 0 0 1 1.51\n                                         1.65 1.65 0 0 0 1.82-.33\n                                         l.06-.06\n                                         a2 2 0 1 1 2.83 2.83\n                                         l-.06.06\n                                         a1.65 1.65 0 0 0-.33 1.82V9\n                                         c.12.6.64 1.05 1.25 1.08H22\n                                         a2 2 0 1 1 0 4h-.09\n                                         c-.6 0-1.15.4-1.51 1z\">\n                                <\/path>\n\n                            <\/svg>\n\n                        <\/div>\n\n                        <div>\n\n                            <strong>\n                                Branding\n                            <\/strong>\n\n                            <span>\n                                Citra dan identitas IPTAR\n                            <\/span>\n\n                        <\/div>\n\n                    <\/div>\n\n\n                <\/div>\n\n            <\/div>\n\n        <\/section>\n\n\n\n        <!-- =====================================================\n             LAYANAN HUMAS\n        ====================================================== -->\n\n        <section class=\"humas-service-section\">\n\n\n            <div class=\"humas-section-heading\">\n\n                <div class=\"humas-heading-left\">\n\n                    <div class=\"humas-heading-icon\">\n\n                        <svg\n                            width=\"23\"\n                            height=\"23\"\n                            viewBox=\"0 0 24 24\"\n                            fill=\"none\"\n                            stroke=\"currentColor\"\n                            stroke-width=\"2\">\n\n                            <rect\n                                x=\"3\"\n                                y=\"3\"\n                                width=\"7\"\n                                height=\"7\"\n                                rx=\"2\">\n                            <\/rect>\n\n                            <rect\n                                x=\"14\"\n                                y=\"3\"\n                                width=\"7\"\n                                height=\"7\"\n                                rx=\"2\">\n                            <\/rect>\n\n                            <rect\n                                x=\"3\"\n                                y=\"14\"\n                                width=\"7\"\n                                height=\"7\"\n                                rx=\"2\">\n                            <\/rect>\n\n                            <rect\n                                x=\"14\"\n                                y=\"14\"\n                                width=\"7\"\n                                height=\"7\"\n                                rx=\"2\">\n                            <\/rect>\n\n                        <\/svg>\n\n                    <\/div>\n\n\n                    <div>\n\n                        <span class=\"humas-small-title\">\n                            RUANG LINGKUP HUMAS\n                        <\/span>\n\n                        <h2>\n                            Layanan & Aktivitas Humas\n                        <\/h2>\n\n                        <p>\n                            Mendukung komunikasi, publikasi dan\n                            penguatan citra institusi.\n                        <\/p>\n\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n\n\n            <div\n                class=\"humas-service-grid\"\n                id=\"humasServiceGrid\">\n            <\/div>\n\n        <\/section>\n\n\n\n        <!-- =====================================================\n             MEDIA SOSIAL RESMI\n        ====================================================== -->\n\n        <section class=\"humas-media-section\">\n\n\n            <div class=\"humas-media-header\">\n\n                <div>\n\n                    <span>\n                        MEDIA RESMI IPTAR\n                    <\/span>\n\n                    <h2>\n                        Terhubung dengan IPTAR\n                    <\/h2>\n\n                    <p>\n                        Ikuti informasi, aktivitas, prestasi dan\n                        kabar terbaru IPTAR melalui kanal digital resmi.\n                    <\/p>\n\n                <\/div>\n\n\n                <div class=\"humas-media-symbol\">\n\n                    <svg\n                        width=\"30\"\n                        height=\"30\"\n                        viewBox=\"0 0 24 24\"\n                        fill=\"none\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"1.8\">\n\n                        <circle\n                            cx=\"12\"\n                            cy=\"12\"\n                            r=\"10\">\n                        <\/circle>\n\n                        <path d=\"M2 12h20\"><\/path>\n\n                        <path d=\"M12 2a15 15 0 0 1 4 10\n                                 15 15 0 0 1-4 10\n                                 15 15 0 0 1-4-10\n                                 15 15 0 0 1 4-10z\">\n                        <\/path>\n\n                    <\/svg>\n\n                <\/div>\n\n            <\/div>\n\n\n            <div\n                class=\"humas-media-grid\"\n                id=\"humasMediaGrid\">\n            <\/div>\n\n\n        <\/section>\n\n\n\n        <!-- =====================================================\n             DOKUMEN HUMAS\n        ====================================================== -->\n\n        <section class=\"humas-documents\">\n\n\n            <div class=\"humas-document-header\">\n\n\n                <div class=\"humas-heading-left\">\n\n                    <div class=\"humas-heading-icon\">\n\n                        <svg\n                            width=\"23\"\n                            height=\"23\"\n                            viewBox=\"0 0 24 24\"\n                            fill=\"none\"\n                            stroke=\"currentColor\"\n                            stroke-width=\"2\">\n\n                            <path d=\"M14 2H6\n                                     a2 2 0 0 0-2 2v16\n                                     a2 2 0 0 0 2 2h12\n                                     a2 2 0 0 0 2-2V8z\">\n                            <\/path>\n\n                            <polyline\n                                points=\"14 2 14 8 20 8\">\n                            <\/polyline>\n\n                            <line\n                                x1=\"16\"\n                                y1=\"13\"\n                                x2=\"8\"\n                                y2=\"13\">\n                            <\/line>\n\n                            <line\n                                x1=\"16\"\n                                y1=\"17\"\n                                x2=\"8\"\n                                y2=\"17\">\n                            <\/line>\n\n                        <\/svg>\n\n                    <\/div>\n\n\n                    <div>\n\n                        <span class=\"humas-small-title\">\n                            PUSAT DOKUMENTASI\n                        <\/span>\n\n                        <h2>\n                            Dokumen Humas\n                        <\/h2>\n\n                        <p>\n                            Pedoman publikasi, program kerja,\n                            branding dan dokumen resmi Humas IPTAR.\n                        <\/p>\n\n                    <\/div>\n\n                <\/div>\n\n\n\n                <div class=\"humas-doc-count\">\n\n                    <strong id=\"humasDocumentCount\">\n                        0\n                    <\/strong>\n\n                    <span>\n                        Dokumen\n                    <\/span>\n\n                <\/div>\n\n            <\/div>\n\n\n\n            <!-- SEARCH -->\n\n            <div class=\"humas-toolbar\">\n\n\n                <div class=\"humas-search\">\n\n                    <svg\n                        width=\"18\"\n                        height=\"18\"\n                        viewBox=\"0 0 24 24\"\n                        fill=\"none\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"2\">\n\n                        <circle\n                            cx=\"11\"\n                            cy=\"11\"\n                            r=\"8\">\n                        <\/circle>\n\n                        <line\n                            x1=\"21\"\n                            y1=\"21\"\n                            x2=\"16.65\"\n                            y2=\"16.65\">\n                        <\/line>\n\n                    <\/svg>\n\n\n                    <input\n                        type=\"text\"\n                        id=\"humasSearch\"\n                        placeholder=\"Cari dokumen Humas...\"\n                        autocomplete=\"off\"\n                    >\n\n                <\/div>\n\n\n                <button\n                    id=\"humasReset\"\n                    type=\"button\"\n                    class=\"humas-reset\">\n\n                    Reset\n\n                <\/button>\n\n            <\/div>\n\n\n\n            <div\n                class=\"humas-document-grid\"\n                id=\"humasDocumentGrid\">\n            <\/div>\n\n\n\n            <div\n                class=\"humas-empty\"\n                id=\"humasEmpty\">\n\n                <div class=\"humas-empty-icon\">\n\n                    <svg\n                        width=\"32\"\n                        height=\"32\"\n                        viewBox=\"0 0 24 24\"\n                        fill=\"none\"\n                        stroke=\"currentColor\"\n                        stroke-width=\"1.8\">\n\n                        <circle\n                            cx=\"11\"\n                            cy=\"11\"\n                            r=\"8\">\n                        <\/circle>\n\n                        <line\n                            x1=\"21\"\n                            y1=\"21\"\n                            x2=\"16.65\"\n                            y2=\"16.65\">\n                        <\/line>\n\n                    <\/svg>\n\n                <\/div>\n\n                <h3>\n                    Dokumen tidak ditemukan\n                <\/h3>\n\n                <p>\n                    Gunakan kata kunci pencarian lainnya.\n                <\/p>\n\n            <\/div>\n\n        <\/section>\n\n    <\/div>\n\n\n\n<style>\n\n\/* =========================================================\n   ROOT \/ FULL WIDTH\n========================================================= *\/\n\n#humas-iptar {\n\n    --green:#079447;\n    --green-dark:#04783c;\n    --green-deep:#064e3b;\n\n    --green-light:#e8f8ee;\n\n    --yellow:#facc15;\n    --yellow-light:#fff8ce;\n\n    --orange:#f59e0b;\n    --orange-light:#fff0dc;\n\n    --text:#173a2c;\n    --muted:#687a70;\n    --border:#e1ece5;\n\n\n    width:100vw;\n    max-width:100vw;\n\n    margin-left:calc(50% - 50vw);\n    margin-right:calc(50% - 50vw);\n\n    position:relative;\n\n    overflow:hidden;\n\n    padding:68px 0 85px;\n\n    color:var(--text);\n\n    font-family:\n        \"Segoe UI\",\n        -apple-system,\n        BlinkMacSystemFont,\n        Roboto,\n        Arial,\n        sans-serif;\n\n    background:\n\n        radial-gradient(\n            circle at 2% 5%,\n            rgba(250,204,21,.16),\n            transparent 22%\n        ),\n\n        radial-gradient(\n            circle at 98% 45%,\n            rgba(245,158,11,.10),\n            transparent 23%\n        ),\n\n        linear-gradient(\n            180deg,\n            #f3fff7 0%,\n            #ffffff 42%,\n            #fafffb 100%\n        );\n\n}\n\n\n#humas-iptar *,\n#humas-iptar *::before,\n#humas-iptar *::after {\n\n    box-sizing:border-box;\n\n}\n\n\n\n\/* =========================================================\n   CONTAINER\n========================================================= *\/\n\n.humas-container {\n\n    width:100%;\n\n    max-width:1500px;\n\n    margin:0 auto;\n\n    padding-left:\n        clamp(20px,5vw,75px);\n\n    padding-right:\n        clamp(20px,5vw,75px);\n\n    position:relative;\n\n    z-index:5;\n\n}\n\n\n\n\/* =========================================================\n   BACKGROUND DECORATION\n========================================================= *\/\n\n.humas-bg-circle {\n\n    position:absolute;\n\n    border-radius:50%;\n\n    pointer-events:none;\n\n}\n\n\n.humas-bg-one {\n\n    width:380px;\n    height:380px;\n\n    right:-180px;\n    top:-190px;\n\n    border:\n        78px solid\n        rgba(7,148,71,.04);\n\n}\n\n\n.humas-bg-two {\n\n    width:290px;\n    height:290px;\n\n    left:-150px;\n    bottom:100px;\n\n    border:\n        60px solid\n        rgba(245,158,11,.05);\n\n}\n\n\n.humas-bg-dots {\n\n    position:absolute;\n\n    width:140px;\n    height:140px;\n\n    left:2.5%;\n    top:320px;\n\n    opacity:.12;\n\n    background-image:\n        radial-gradient(\n            #079447 2px,\n            transparent 2px\n        );\n\n    background-size:\n        16px 16px;\n\n}\n\n\n\n\/* =========================================================\n   PROFILE\n========================================================= *\/\n\n.humas-profile-section {\n\n    position:relative;\n\n    display:grid;\n\n    grid-template-columns:\n        280px minmax(0,1fr);\n\n    align-items:center;\n\n    gap:\n        clamp(38px,5vw,75px);\n\n    padding:\n        45px\n        clamp(35px,5vw,70px);\n\n    margin-bottom:60px;\n\n    overflow:hidden;\n\n    border:\n        1px solid\n        rgba(7,148,71,.11);\n\n    border-radius:30px;\n\n    background:\n\n        linear-gradient(\n            130deg,\n            rgba(255,255,255,.98),\n            rgba(239,252,245,.96)\n        );\n\n    box-shadow:\n        0 20px 60px\n        rgba(25,78,50,.08);\n\n}\n\n\n.humas-profile-section::before {\n\n    content:\"\";\n\n    position:absolute;\n\n    width:290px;\n    height:290px;\n\n    right:-110px;\n    top:-150px;\n\n    border-radius:50%;\n\n    background:\n        rgba(250,204,21,.11);\n\n}\n\n\n.humas-profile-section::after {\n\n    content:\"\";\n\n    position:absolute;\n\n    width:190px;\n    height:190px;\n\n    right:25%;\n    bottom:-135px;\n\n    border-radius:50%;\n\n    border:\n        40px solid\n        rgba(7,148,71,.035);\n\n}\n\n\n\n\/* =========================================================\n   FOTO\n========================================================= *\/\n\n.humas-profile {\n\n    position:relative;\n\n    z-index:3;\n\n    text-align:center;\n\n}\n\n\n.humas-photo-wrap {\n\n    position:relative;\n\n    width:235px;\n\n    margin:0 auto;\n\n}\n\n\n.humas-photo-decoration {\n\n    position:absolute;\n\n    left:-12px;\n    top:28px;\n\n    width:200px;\n    height:205px;\n\n    border-radius:36px;\n\n    transform:rotate(-7deg);\n\n    background:\n\n        linear-gradient(\n            135deg,\n            #facc15,\n            #f59e0b\n        );\n\n}\n\n\n.humas-photo {\n\n    position:relative;\n\n    z-index:2;\n\n    width:215px;\n    height:255px;\n\n    margin-left:10px;\n\n    overflow:hidden;\n\n    border:6px solid #ffffff;\n\n    border-radius:32px;\n\n    background:\n        var(--green-light);\n\n    box-shadow:\n        0 20px 45px\n        rgba(26,74,49,.18);\n\n}\n\n\n.humas-photo img {\n\n    position:relative;\n\n    z-index:2;\n\n    width:100%;\n    height:100%;\n\n    display:block;\n\n    object-fit:cover;\n\n    object-position:center top;\n\n}\n\n\n.humas-photo-fallback {\n\n    position:absolute;\n\n    inset:0;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    color:#ffffff;\n\n    background:\n\n        linear-gradient(\n            135deg,\n            var(--green),\n            var(--green-dark)\n        );\n\n    font-size:22px;\n\n    font-weight:900;\n\n}\n\n\n\n\/* POSITION *\/\n\n.humas-position-badge {\n\n    position:relative;\n\n    z-index:4;\n\n    width:max-content;\n\n    max-width:95%;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    gap:6px;\n\n    margin:-17px auto 0;\n\n    padding:9px 17px;\n\n    border-radius:100px;\n\n    color:#ffffff;\n\n    background:\n\n        linear-gradient(\n            135deg,\n            var(--green),\n            var(--green-dark)\n        );\n\n    box-shadow:\n        0 8px 20px\n        rgba(7,148,71,.24);\n\n    font-size:10px;\n\n    font-weight:750;\n\n}\n\n\n.humas-leader-info {\n\n    margin-top:18px;\n\n}\n\n\n.humas-leader-info > span {\n\n    display:block;\n\n    margin-bottom:3px;\n\n    color:#89968f;\n\n    font-size:8px;\n\n    font-weight:800;\n\n    text-transform:uppercase;\n\n    letter-spacing:1px;\n\n}\n\n\n.humas-leader-info h3 {\n\n    margin:0 0 3px;\n\n    color:#173b2d;\n\n    font-size:16px;\n\n    line-height:1.35;\n\n    font-weight:800;\n\n}\n\n\n.humas-leader-info p {\n\n    margin:0;\n\n    color:var(--green);\n\n    font-size:9.5px;\n\n}\n\n\n\n\/* =========================================================\n   INFO\n========================================================= *\/\n\n.humas-info {\n\n    position:relative;\n\n    z-index:3;\n\n}\n\n\n.humas-label {\n\n    display:inline-flex;\n\n    align-items:center;\n\n    gap:7px;\n\n    padding:7px 13px;\n\n    margin-bottom:12px;\n\n    border-radius:100px;\n\n    color:var(--green);\n\n    background:var(--green-light);\n\n    font-size:9.5px;\n\n    font-weight:850;\n\n    letter-spacing:1.2px;\n\n}\n\n\n.humas-label-icon {\n\n    width:26px;\n    height:26px;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    border-radius:50%;\n\n    background:#ffffff;\n\n}\n\n\n.humas-kicker {\n\n    margin-bottom:5px;\n\n    color:var(--orange);\n\n    font-size:10px;\n\n    font-weight:850;\n\n    text-transform:uppercase;\n\n    letter-spacing:1px;\n\n}\n\n\n.humas-info h1 {\n\n    margin:0 0 7px;\n\n    color:var(--green);\n\n    font-size:\n        clamp(42px,5vw,64px);\n\n    line-height:1;\n\n    letter-spacing:-2px;\n\n    font-weight:900;\n\n}\n\n\n.humas-info h1 small {\n\n    color:var(--orange);\n\n    font-size:.46em;\n\n}\n\n\n.humas-info > h2 {\n\n    margin:0 0 13px;\n\n    max-width:900px;\n\n    color:#183c2e;\n\n    font-size:\n        clamp(21px,2vw,29px);\n\n    line-height:1.3;\n\n    font-weight:800;\n\n}\n\n\n.humas-title-line {\n\n    display:flex;\n\n    align-items:center;\n\n    gap:6px;\n\n    margin-bottom:18px;\n\n}\n\n\n.humas-title-line span {\n\n    width:28px;\n    height:3px;\n\n    display:block;\n\n    border-radius:10px;\n\n    background:var(--green);\n\n}\n\n\n.humas-title-line i {\n\n    width:7px;\n    height:7px;\n\n    display:block;\n\n    border-radius:50%;\n\n    background:var(--yellow);\n\n}\n\n\n.humas-description {\n\n    max-width:900px;\n\n    color:var(--muted);\n\n    font-size:14px;\n\n    line-height:1.8;\n\n}\n\n\n.humas-description strong {\n\n    color:var(--green-dark);\n\n}\n\n\n\n\/* =========================================================\n   VALUES\n========================================================= *\/\n\n.humas-values {\n\n    display:flex;\n\n    flex-wrap:wrap;\n\n    gap:10px;\n\n    margin-top:22px;\n\n}\n\n\n.humas-value {\n\n    min-width:165px;\n\n    display:flex;\n\n    align-items:center;\n\n    gap:9px;\n\n    padding:9px 12px;\n\n    border:\n        1px solid\n        rgba(7,148,71,.08);\n\n    border-radius:13px;\n\n    background:\n        rgba(255,255,255,.82);\n\n}\n\n\n.humas-value-icon {\n\n    width:35px;\n    height:35px;\n\n    flex-shrink:0;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    border-radius:10px;\n\n    color:var(--green);\n\n    background:var(--green-light);\n\n}\n\n\n.humas-value-icon.yellow {\n\n    color:#a87b00;\n\n    background:var(--yellow-light);\n\n}\n\n\n.humas-value-icon.orange {\n\n    color:#c56600;\n\n    background:var(--orange-light);\n\n}\n\n\n.humas-value strong {\n\n    display:block;\n\n    color:#29483b;\n\n    font-size:10px;\n\n    font-weight:800;\n\n}\n\n\n.humas-value div > span {\n\n    display:block;\n\n    color:#89968f;\n\n    font-size:8.5px;\n\n}\n\n\n\n\/* =========================================================\n   SECTION HEADINGS\n========================================================= *\/\n\n.humas-service-section {\n\n    margin-bottom:55px;\n\n}\n\n\n.humas-section-heading,\n.humas-document-header {\n\n    display:flex;\n\n    align-items:center;\n\n    justify-content:space-between;\n\n    gap:25px;\n\n    margin-bottom:25px;\n\n    padding-bottom:17px;\n\n    border-bottom:\n        1px solid\n        var(--border);\n\n}\n\n\n.humas-heading-left {\n\n    display:flex;\n\n    align-items:center;\n\n    gap:13px;\n\n}\n\n\n.humas-heading-icon {\n\n    width:50px;\n    height:50px;\n\n    flex-shrink:0;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    border-radius:15px;\n\n    color:#ffffff;\n\n    background:\n\n        linear-gradient(\n            135deg,\n            var(--green),\n            var(--green-dark)\n        );\n\n    box-shadow:\n        0 8px 20px\n        rgba(7,148,71,.20);\n\n}\n\n\n.humas-small-title {\n\n    display:block;\n\n    margin-bottom:2px;\n\n    color:#89968f;\n\n    font-size:8.5px;\n\n    font-weight:800;\n\n    letter-spacing:1.2px;\n\n}\n\n\n.humas-heading-left h2 {\n\n    margin:0 0 3px;\n\n    color:#173a2c;\n\n    font-size:24px;\n\n    font-weight:820;\n\n}\n\n\n.humas-heading-left p {\n\n    margin:0;\n\n    color:var(--muted);\n\n    font-size:11.5px;\n\n}\n\n\n\n\/* =========================================================\n   SERVICE GRID\n========================================================= *\/\n\n.humas-service-grid {\n\n    display:grid;\n\n    grid-template-columns:\n        repeat(3,minmax(0,1fr));\n\n    gap:17px;\n\n}\n\n\n.humas-service-card {\n\n    position:relative;\n\n    min-height:185px;\n\n    padding:22px;\n\n    overflow:hidden;\n\n    border:\n        1px solid\n        var(--border);\n\n    border-radius:19px;\n\n    background:#ffffff;\n\n    box-shadow:\n        0 9px 28px\n        rgba(26,72,49,.05);\n\n    transition:\n        transform .3s ease,\n        border-color .3s ease,\n        box-shadow .3s ease;\n\n}\n\n\n.humas-service-card::before {\n\n    content:\"\";\n\n    position:absolute;\n\n    top:0;\n    left:0;\n\n    width:100%;\n    height:4px;\n\n    opacity:0;\n\n    background:\n\n        linear-gradient(\n            90deg,\n            #079447,\n            #add33c,\n            #facc15,\n            #f59e0b\n        );\n\n    transition:.3s;\n\n}\n\n\n.humas-service-card:hover {\n\n    transform:translateY(-6px);\n\n    border-color:\n        rgba(7,148,71,.22);\n\n    box-shadow:\n        0 18px 40px\n        rgba(25,75,50,.10);\n\n}\n\n\n.humas-service-card:hover::before {\n\n    opacity:1;\n\n}\n\n\n.humas-service-icon {\n\n    width:48px;\n    height:48px;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    margin-bottom:15px;\n\n    border-radius:14px;\n\n    color:var(--green);\n\n    background:var(--green-light);\n\n}\n\n\n.humas-service-card:nth-child(3n+2)\n.humas-service-icon {\n\n    color:#a77900;\n\n    background:var(--yellow-light);\n\n}\n\n\n.humas-service-card:nth-child(3n)\n.humas-service-icon {\n\n    color:#c56600;\n\n    background:var(--orange-light);\n\n}\n\n\n.humas-service-category {\n\n    display:inline-block;\n\n    margin-bottom:5px;\n\n    color:var(--orange);\n\n    font-size:7.5px;\n\n    font-weight:850;\n\n    text-transform:uppercase;\n\n    letter-spacing:.8px;\n\n}\n\n\n.humas-service-card h3 {\n\n    margin:0 0 7px;\n\n    color:#183b2e;\n\n    font-size:14px;\n\n    font-weight:800;\n\n}\n\n\n.humas-service-card p {\n\n    margin:0;\n\n    color:var(--muted);\n\n    font-size:11px;\n\n    line-height:1.7;\n\n}\n\n\n\n\/* =========================================================\n   MEDIA SECTION\n========================================================= *\/\n\n.humas-media-section {\n\n    position:relative;\n\n    margin-bottom:60px;\n\n    padding:\n        clamp(25px,4vw,35px);\n\n    overflow:hidden;\n\n    border-radius:25px;\n\n    color:#ffffff;\n\n    background:\n\n        linear-gradient(\n            120deg,\n            #04733a 0%,\n            #079447 60%,\n            #20a85c 100%\n        );\n\n    box-shadow:\n        0 18px 45px\n        rgba(7,130,65,.18);\n\n}\n\n\n.humas-media-section::after {\n\n    content:\"\";\n\n    position:absolute;\n\n    width:270px;\n    height:270px;\n\n    right:-90px;\n    top:-160px;\n\n    border-radius:50%;\n\n    background:\n        rgba(250,204,21,.13);\n\n}\n\n\n.humas-media-header {\n\n    position:relative;\n\n    z-index:2;\n\n    display:flex;\n\n    align-items:center;\n\n    justify-content:space-between;\n\n    gap:20px;\n\n    margin-bottom:22px;\n\n}\n\n\n.humas-media-header > div:first-child > span {\n\n    display:block;\n\n    margin-bottom:3px;\n\n    color:#ffe272;\n\n    font-size:8px;\n\n    font-weight:850;\n\n    letter-spacing:1.3px;\n\n}\n\n\n.humas-media-header h2 {\n\n    margin:0 0 5px;\n\n    color:#ffffff;\n\n    font-size:23px;\n\n    font-weight:820;\n\n}\n\n\n.humas-media-header p {\n\n    max-width:700px;\n\n    margin:0;\n\n    color:\n        rgba(255,255,255,.75);\n\n    font-size:11px;\n\n    line-height:1.6;\n\n}\n\n\n.humas-media-symbol {\n\n    width:55px;\n    height:55px;\n\n    flex-shrink:0;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    border-radius:17px;\n\n    background:\n        rgba(255,255,255,.12);\n\n}\n\n\n\n\/* MEDIA GRID *\/\n\n.humas-media-grid {\n\n    position:relative;\n\n    z-index:2;\n\n    display:grid;\n\n    grid-template-columns:\n        repeat(4,minmax(0,1fr));\n\n    gap:10px;\n\n}\n\n\n.humas-media-card {\n\n    display:flex;\n\n    align-items:center;\n\n    gap:10px;\n\n    min-height:74px;\n\n    padding:12px;\n\n    border:\n        1px solid\n        rgba(255,255,255,.13);\n\n    border-radius:15px;\n\n    color:#ffffff !important;\n\n    text-decoration:none !important;\n\n    background:\n        rgba(255,255,255,.09);\n\n    backdrop-filter:blur(8px);\n\n    transition:\n        transform .25s ease,\n        background .25s ease;\n\n}\n\n\n.humas-media-card:hover {\n\n    transform:translateY(-4px);\n\n    background:\n        rgba(255,255,255,.17);\n\n}\n\n\n.humas-media-card-icon {\n\n    width:39px;\n    height:39px;\n\n    flex-shrink:0;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    border-radius:12px;\n\n    color:#3b5800;\n\n    background:\n        var(--yellow);\n\n}\n\n\n.humas-media-card strong {\n\n    display:block;\n\n    color:#ffffff;\n\n    font-size:10px;\n\n}\n\n\n.humas-media-card span {\n\n    display:block;\n\n    margin-top:2px;\n\n    color:\n        rgba(255,255,255,.7);\n\n    font-size:8px;\n\n}\n\n\n\n\/* =========================================================\n   DOCUMENTS\n========================================================= *\/\n\n.humas-documents {\n\n    padding:\n        clamp(24px,4vw,38px);\n\n    border:\n        1px solid\n        rgba(7,148,71,.09);\n\n    border-radius:27px;\n\n    background:\n        rgba(255,255,255,.92);\n\n    box-shadow:\n        0 15px 45px\n        rgba(25,73,49,.06);\n\n}\n\n\n.humas-doc-count {\n\n    display:flex;\n\n    align-items:center;\n\n    gap:7px;\n\n    padding:7px 13px;\n\n    border:\n        1px solid\n        var(--border);\n\n    border-radius:100px;\n\n    background:#ffffff;\n\n    color:#77867e;\n\n    font-size:10px;\n\n    font-weight:700;\n\n}\n\n\n.humas-doc-count strong {\n\n    width:27px;\n    height:27px;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    border-radius:50%;\n\n    color:#715500;\n\n    background:var(--yellow);\n\n}\n\n\n\n\/* =========================================================\n   SEARCH\n========================================================= *\/\n\n.humas-toolbar {\n\n    display:flex;\n\n    align-items:center;\n\n    gap:9px;\n\n    margin-bottom:25px;\n\n}\n\n\n.humas-search {\n\n    width:100%;\n    max-width:500px;\n\n    height:46px;\n\n    display:flex;\n\n    align-items:center;\n\n    gap:9px;\n\n    padding:0 15px;\n\n    border:\n        1px solid\n        var(--border);\n\n    border-radius:13px;\n\n    background:#ffffff;\n\n    color:#89978f;\n\n    transition:.25s;\n\n}\n\n\n.humas-search:focus-within {\n\n    border-color:\n        rgba(7,148,71,.45);\n\n    box-shadow:\n        0 0 0 4px\n        rgba(7,148,71,.07);\n\n}\n\n\n.humas-search input {\n\n    width:100%;\n    height:100%;\n\n    padding:0 !important;\n\n    border:none !important;\n\n    outline:none !important;\n\n    box-shadow:none !important;\n\n    background:transparent !important;\n\n    color:#334b40;\n\n    font-size:12px;\n\n}\n\n\n.humas-reset {\n\n    height:46px;\n\n    padding:0 18px;\n\n    border:\n        1px solid\n        var(--border);\n\n    border-radius:13px;\n\n    background:#ffffff;\n\n    color:#697970;\n\n    cursor:pointer;\n\n    font-size:11px;\n\n    font-weight:750;\n\n    transition:.25s;\n\n}\n\n\n.humas-reset:hover {\n\n    border-color:var(--orange);\n\n    background:var(--orange);\n\n    color:#ffffff;\n\n}\n\n\n\n\/* =========================================================\n   DOCUMENT GRID\n========================================================= *\/\n\n.humas-document-grid {\n\n    display:grid;\n\n    grid-template-columns:\n        repeat(4,minmax(0,1fr));\n\n    gap:19px;\n\n}\n\n\n.humas-doc-card {\n\n    position:relative;\n\n    display:flex;\n\n    flex-direction:column;\n\n    overflow:hidden;\n\n    border:\n        1px solid\n        #e4ede7;\n\n    border-radius:19px;\n\n    background:#ffffff;\n\n    transition:\n        transform .32s ease,\n        box-shadow .32s ease,\n        border-color .32s ease;\n\n}\n\n\n.humas-doc-card::before {\n\n    content:\"\";\n\n    position:absolute;\n\n    z-index:8;\n\n    top:0;\n    left:0;\n\n    width:100%;\n    height:4px;\n\n    opacity:0;\n\n    background:\n\n        linear-gradient(\n            90deg,\n            #079447,\n            #afd43c,\n            #facc15,\n            #f59e0b\n        );\n\n    transition:.3s;\n\n}\n\n\n.humas-doc-card:hover {\n\n    transform:translateY(-7px);\n\n    border-color:\n        rgba(7,148,71,.22);\n\n    box-shadow:\n        0 18px 40px\n        rgba(26,75,50,.10);\n\n}\n\n\n.humas-doc-card:hover::before {\n\n    opacity:1;\n\n}\n\n\n\n\/* DOCUMENT COVER *\/\n\n.humas-doc-cover {\n\n    position:relative;\n\n    aspect-ratio:4 \/ 3;\n\n    overflow:hidden;\n\n    background:\n\n        linear-gradient(\n            135deg,\n            #e7f8ed,\n            #fff8cf\n        );\n\n}\n\n\n.humas-doc-cover img {\n\n    position:relative;\n\n    z-index:2;\n\n    width:100%;\n    height:100%;\n\n    display:block;\n\n    object-fit:cover;\n\n    transition:\n        transform .5s ease;\n\n}\n\n\n.humas-doc-card:hover\n.humas-doc-cover img {\n\n    transform:scale(1.055);\n\n}\n\n\n.humas-cover-fallback {\n\n    position:absolute;\n\n    inset:0;\n\n    display:flex;\n\n    flex-direction:column;\n\n    align-items:center;\n    justify-content:center;\n\n    color:var(--green);\n\n}\n\n\n.humas-cover-fallback strong {\n\n    font-size:22px;\n\n    font-weight:900;\n\n}\n\n\n.humas-cover-fallback span {\n\n    font-size:8px;\n\n    font-weight:800;\n\n    letter-spacing:1px;\n\n}\n\n\n.humas-doc-badge {\n\n    position:absolute;\n\n    z-index:5;\n\n    top:11px;\n    left:11px;\n\n    padding:5px 9px;\n\n    border-radius:100px;\n\n    background:\n        rgba(255,255,255,.93);\n\n    color:var(--green);\n\n    font-size:7.5px;\n\n    font-weight:850;\n\n    text-transform:uppercase;\n\n}\n\n\n\n\/* BODY *\/\n\n.humas-doc-body {\n\n    flex:1;\n\n    display:flex;\n\n    flex-direction:column;\n\n    padding:18px;\n\n}\n\n\n.humas-doc-category {\n\n    align-self:flex-start;\n\n    margin-bottom:8px;\n\n    padding:4px 8px;\n\n    border-radius:100px;\n\n    color:#057842;\n\n    background:var(--green-light);\n\n    font-size:7px;\n\n    font-weight:850;\n\n    text-transform:uppercase;\n\n    letter-spacing:.7px;\n\n}\n\n\n.humas-doc-body h3 {\n\n    min-height:43px;\n\n    margin:0 0 9px;\n\n    color:#183b2e;\n\n    font-size:13.5px;\n\n    line-height:1.45;\n\n    font-weight:780;\n\n    display:-webkit-box;\n\n    -webkit-line-clamp:2;\n\n    -webkit-box-orient:vertical;\n\n    overflow:hidden;\n\n}\n\n\n.humas-doc-meta {\n\n    display:flex;\n\n    align-items:center;\n\n    gap:7px;\n\n    margin-bottom:15px;\n\n    color:#89968f;\n\n    font-size:8.5px;\n\n}\n\n\n.humas-doc-meta i {\n\n    width:4px;\n    height:4px;\n\n    display:block;\n\n    border-radius:50%;\n\n    background:#cad5ce;\n\n}\n\n\n\n\/* BUTTONS *\/\n\n.humas-actions {\n\n    display:grid;\n\n    grid-template-columns:\n        1fr 1fr;\n\n    gap:7px;\n\n    margin-top:auto;\n\n}\n\n\n.humas-btn {\n\n    min-height:37px;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    gap:5px;\n\n    border-radius:10px;\n\n    text-decoration:none !important;\n\n    font-size:9px;\n\n    font-weight:750;\n\n    transition:.25s;\n\n}\n\n\n.humas-view {\n\n    border:\n        1px solid\n        #dcebe2;\n\n    color:var(--green) !important;\n\n    background:#effaf3;\n\n}\n\n\n.humas-view:hover {\n\n    border-color:var(--green);\n\n    color:#ffffff !important;\n\n    background:var(--green);\n\n}\n\n\n.humas-download {\n\n    color:#ffffff !important;\n\n    background:\n\n        linear-gradient(\n            135deg,\n            var(--green),\n            var(--green-dark)\n        );\n\n}\n\n\n.humas-download:hover {\n\n    color:#ffffff !important;\n\n    background:\n\n        linear-gradient(\n            135deg,\n            #f5a00b,\n            #ed7e0d\n        );\n\n}\n\n\n\n\/* =========================================================\n   EMPTY\n========================================================= *\/\n\n.humas-empty {\n\n    display:none;\n\n    padding:60px 20px;\n\n    text-align:center;\n\n}\n\n\n.humas-empty-icon {\n\n    width:62px;\n    height:62px;\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    margin:0 auto 12px;\n\n    border-radius:50%;\n\n    color:var(--green);\n\n    background:var(--green-light);\n\n}\n\n\n.humas-empty h3 {\n\n    margin:0 0 5px;\n\n    color:#29483b;\n\n    font-size:16px;\n\n}\n\n\n.humas-empty p {\n\n    margin:0;\n\n    color:var(--muted);\n\n    font-size:11px;\n\n}\n\n\n\n\/* =========================================================\n   RESPONSIVE\n========================================================= *\/\n\n@media(max-width:1150px) {\n\n    .humas-document-grid {\n\n        grid-template-columns:\n            repeat(3,minmax(0,1fr));\n\n    }\n\n\n    .humas-media-grid {\n\n        grid-template-columns:\n            repeat(2,minmax(0,1fr));\n\n    }\n\n}\n\n\n@media(max-width:900px) {\n\n    .humas-profile-section {\n\n        grid-template-columns:\n            220px minmax(0,1fr);\n\n        gap:30px;\n\n        padding:35px 28px;\n\n    }\n\n\n    .humas-photo-wrap {\n\n        width:195px;\n\n    }\n\n\n    .humas-photo {\n\n        width:180px;\n        height:220px;\n\n    }\n\n\n    .humas-photo-decoration {\n\n        width:168px;\n        height:180px;\n\n    }\n\n\n    .humas-service-grid {\n\n        grid-template-columns:\n            repeat(2,minmax(0,1fr));\n\n    }\n\n}\n\n\n@media(max-width:650px) {\n\n    #humas-iptar {\n\n        padding:42px 0 60px;\n\n    }\n\n\n    .humas-container {\n\n        padding-left:15px;\n        padding-right:15px;\n\n    }\n\n\n    .humas-profile-section {\n\n        grid-template-columns:1fr;\n\n        gap:30px;\n\n        padding:30px 19px;\n\n        margin-bottom:48px;\n\n        border-radius:23px;\n\n        text-align:center;\n\n    }\n\n\n    .humas-photo-wrap {\n\n        width:205px;\n\n    }\n\n\n    .humas-photo {\n\n        width:185px;\n        height:225px;\n\n    }\n\n\n    .humas-photo-decoration {\n\n        width:175px;\n        height:180px;\n\n    }\n\n\n    .humas-label {\n\n        margin-left:auto;\n        margin-right:auto;\n\n    }\n\n\n    .humas-title-line {\n\n        justify-content:center;\n\n    }\n\n\n    .humas-description {\n\n        font-size:13px;\n\n        line-height:1.75;\n\n    }\n\n\n    .humas-values {\n\n        display:grid;\n\n        grid-template-columns:\n            1fr 1fr;\n\n        text-align:left;\n\n    }\n\n\n    .humas-service-grid {\n\n        grid-template-columns:\n            repeat(2,minmax(0,1fr));\n\n        gap:10px;\n\n    }\n\n\n    .humas-service-card {\n\n        min-height:180px;\n\n        padding:16px;\n\n        border-radius:15px;\n\n    }\n\n\n    .humas-service-card h3 {\n\n        font-size:12px;\n\n    }\n\n\n    .humas-service-card p {\n\n        font-size:9.5px;\n\n    }\n\n\n    .humas-media-section {\n\n        padding:24px 19px;\n\n    }\n\n\n    .humas-media-grid {\n\n        grid-template-columns:\n            repeat(2,minmax(0,1fr));\n\n    }\n\n\n    .humas-document-header {\n\n        align-items:flex-start;\n\n    }\n\n\n    .humas-doc-count {\n\n        display:none;\n\n    }\n\n\n    .humas-search {\n\n        max-width:none;\n\n    }\n\n\n    .humas-document-grid {\n\n        grid-template-columns:\n            repeat(2,minmax(0,1fr));\n\n        gap:10px;\n\n    }\n\n\n    .humas-doc-card {\n\n        border-radius:15px;\n\n    }\n\n\n    .humas-doc-body {\n\n        padding:12px;\n\n    }\n\n\n    .humas-doc-body h3 {\n\n        min-height:38px;\n\n        font-size:11px;\n\n    }\n\n\n    .humas-btn {\n\n        min-height:34px;\n\n        font-size:8px;\n\n    }\n\n}\n\n\n@media(max-width:390px) {\n\n    .humas-service-grid,\n    .humas-document-grid,\n    .humas-media-grid,\n    .humas-values {\n\n        grid-template-columns:1fr;\n\n    }\n\n\n    .humas-doc-body h3 {\n\n        min-height:auto;\n\n        font-size:13.5px;\n\n    }\n\n\n    .humas-btn {\n\n        font-size:10px;\n\n    }\n\n}\n\n\n\n\/* ELEMENTOR OVERRIDE *\/\n\n#humas-iptar a {\n\n    box-shadow:none;\n\n}\n\n\n#humas-iptar button,\n#humas-iptar input {\n\n    font-family:inherit;\n\n}\n\n<\/style>\n\n\n\n<script>\n\n(function () {\n\n\"use strict\";\n\n\n\/* =========================================================\n   ROOT\n========================================================= *\/\n\nconst root =\n    document.getElementById(\n        \"humas-iptar\"\n    );\n\n\nif (!root) return;\n\n\nconst data =\n    DATA_HUMAS;\n\n\n\n\/* =========================================================\n   ELEMENT\n========================================================= *\/\n\nconst foto =\n    root.querySelector(\"#humasFoto\");\n\nconst fallback =\n    root.querySelector(\".humas-photo-fallback\");\n\nconst kepala =\n    root.querySelector(\"#humasKepala\");\n\nconst jabatan =\n    root.querySelector(\"#humasJabatan\");\n\nconst singkatan =\n    root.querySelector(\"#humasSingkatan\");\n\nconst nama =\n    root.querySelector(\"#humasNama\");\n\nconst tagline =\n    root.querySelector(\"#humasTagline\");\n\nconst description =\n    root.querySelector(\"#humasDescription\");\n\nconst serviceGrid =\n    root.querySelector(\"#humasServiceGrid\");\n\nconst mediaGrid =\n    root.querySelector(\"#humasMediaGrid\");\n\nconst documentGrid =\n    root.querySelector(\"#humasDocumentGrid\");\n\nconst documentCount =\n    root.querySelector(\"#humasDocumentCount\");\n\nconst search =\n    root.querySelector(\"#humasSearch\");\n\nconst reset =\n    root.querySelector(\"#humasReset\");\n\nconst empty =\n    root.querySelector(\"#humasEmpty\");\n\n\n\n\/* =========================================================\n   PROFILE DATA\n========================================================= *\/\n\nfoto.src =\n    data.foto;\n\n\nkepala.textContent =\n    data.kepala;\n\n\njabatan.textContent =\n    data.jabatan;\n\n\nsingkatan.textContent =\n    data.singkatan;\n\n\nnama.textContent =\n    data.nama;\n\n\ntagline.textContent =\n    data.tagline;\n\n\ndescription.innerHTML =\n    data.deskripsi;\n\n\n\nfoto.addEventListener(\n\n    \"load\",\n\n    function () {\n\n        fallback.style.display =\n            \"none\";\n\n    }\n\n);\n\n\nfoto.addEventListener(\n\n    \"error\",\n\n    function () {\n\n        foto.style.display =\n            \"none\";\n\n        fallback.style.display =\n            \"flex\";\n\n    }\n\n);\n\n\n\n\/* =========================================================\n   ESCAPE HTML\n========================================================= *\/\n\nfunction escapeHTML(value) {\n\n    return String(value || \"\")\n\n        .replace(\/&\/g,\"&amp;\")\n        .replace(\/<\/g,\"&lt;\")\n        .replace(\/>\/g,\"&gt;\")\n        .replace(\/\"\/g,\"&quot;\")\n        .replace(\/'\/g,\"&#039;\");\n\n}\n\n\n\n\/* =========================================================\n   SERVICE ICONS\n========================================================= *\/\n\nfunction serviceIcon(type) {\n\n    const icons = {\n\n\n        publication: `\n\n            <svg width=\"24\" height=\"24\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\">\n\n                <path d=\"M3 11l18-5v12L3 13z\"><\/path>\n\n                <path d=\"M11.6 16.8L13 21H8l-1.5-6\"><\/path>\n\n            <\/svg>\n\n        `,\n\n\n        social: `\n\n            <svg width=\"24\" height=\"24\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\">\n\n                <circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle>\n\n                <path d=\"M2 12h20\"><\/path>\n\n                <path d=\"M12 2a15 15 0 0 1 4 10\n                         15 15 0 0 1-4 10\n                         15 15 0 0 1-4-10\n                         15 15 0 0 1 4-10z\">\n                <\/path>\n\n            <\/svg>\n\n        `,\n\n\n        camera: `\n\n            <svg width=\"24\" height=\"24\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\">\n\n                <path d=\"M23 19a2 2 0 0 1-2 2H3\n                         a2 2 0 0 1-2-2V8\n                         a2 2 0 0 1 2-2h4l2-3h6l2 3h4\n                         a2 2 0 0 1 2 2z\">\n                <\/path>\n\n                <circle cx=\"12\" cy=\"13\" r=\"4\"><\/circle>\n\n            <\/svg>\n\n        `,\n\n\n        news: `\n\n            <svg width=\"24\" height=\"24\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\">\n\n                <path d=\"M19 20H5\n                         a2 2 0 0 1-2-2V6\n                         a2 2 0 0 1 2-2h11v14\n                         a2 2 0 0 0 2 2z\">\n                <\/path>\n\n                <path d=\"M16 8h4v10\n                         a2 2 0 0 1-2 2\">\n                <\/path>\n\n                <line x1=\"7\" y1=\"8\" x2=\"12\" y2=\"8\"><\/line>\n                <line x1=\"7\" y1=\"12\" x2=\"12\" y2=\"12\"><\/line>\n\n            <\/svg>\n\n        `,\n\n\n        branding: `\n\n            <svg width=\"24\" height=\"24\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\">\n\n                <circle cx=\"12\" cy=\"8\" r=\"7\"><\/circle>\n\n                <polyline\n                    points=\"8.21 13.89 7 23 12 20 17 23 15.79 13.88\">\n                <\/polyline>\n\n            <\/svg>\n\n        `,\n\n\n        communication: `\n\n            <svg width=\"24\" height=\"24\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\">\n\n                <path d=\"M21 15\n                         a4 4 0 0 1-4 4H8\n                         l-5 3V7\n                         a4 4 0 0 1 4-4h10\n                         a4 4 0 0 1 4 4z\">\n                <\/path>\n\n            <\/svg>\n\n        `\n\n    };\n\n\n    return (\n        icons[type] ||\n        icons.publication\n    );\n\n}\n\n\n\n\/* =========================================================\n   RENDER SERVICES\n========================================================= *\/\n\ndata.layanan.forEach(\n\n    function (item) {\n\n\n        const card =\n            document.createElement(\n                \"article\"\n            );\n\n\n        card.className =\n            \"humas-service-card\";\n\n\n        card.innerHTML = `\n\n            <div class=\"humas-service-icon\">\n\n                ${serviceIcon(\n                    item.icon\n                )}\n\n            <\/div>\n\n\n            <span class=\"humas-service-category\">\n\n                ${escapeHTML(\n                    item.kategori\n                )}\n\n            <\/span>\n\n\n            <h3>\n\n                ${escapeHTML(\n                    item.nama\n                )}\n\n            <\/h3>\n\n\n            <p>\n\n                ${escapeHTML(\n                    item.deskripsi\n                )}\n\n            <\/p>\n\n        `;\n\n\n        serviceGrid.appendChild(\n            card\n        );\n\n    }\n\n);\n\n\n\n\/* =========================================================\n   MEDIA ICON\n========================================================= *\/\n\nfunction mediaIcon(type) {\n\n    const icons = {\n\n\n        instagram: `\n\n            <svg width=\"20\" height=\"20\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\">\n\n                <rect\n                    x=\"2\"\n                    y=\"2\"\n                    width=\"20\"\n                    height=\"20\"\n                    rx=\"5\">\n                <\/rect>\n\n                <circle\n                    cx=\"12\"\n                    cy=\"12\"\n                    r=\"4\">\n                <\/circle>\n\n                <circle\n                    cx=\"17.5\"\n                    cy=\"6.5\"\n                    r=\"1\">\n                <\/circle>\n\n            <\/svg>\n\n        `,\n\n\n        tiktok: `\n\n            <svg width=\"20\" height=\"20\"\n                viewBox=\"0 0 24 24\"\n                fill=\"currentColor\">\n\n                <path d=\"M12.525.02c1.31-.02 2.61-.01\n                3.91-.02.08 1.53.63 3.09 1.75\n                4.17 1.12 1.11 2.7 1.62\n                4.24 1.79v4.03c-1.44-.05-2.89-.35-4.2-.97\n                -.57-.26-1.1-.59-1.62-.93-.01 2.92\n                .01 5.84-.02 8.75-.08 1.4-.54\n                2.79-1.35 3.94-1.31 1.92-3.58\n                3.17-5.91 3.21-1.43.08-2.86-.31\n                -4.08-1.03-2.02-1.19-3.44-3.37\n                -3.65-5.72-.02-.5-.03-1-.01-1.49\n                .18-1.9 1.12-3.72 2.58-4.96\n                1.66-1.45 3.98-2.14 6.15-1.74\n                .02 1.48-.04 2.96-.04 4.44\n                -.99-.32-2.15-.23-3.02.37\n                -.63.41-1.11 1.04-1.36 1.75\n                -.21.51-.15 1.07-.14 1.61\n                .24 1.64 1.82 3.02 3.48\n                2.87 1.1-.01 2.15-.65\n                2.72-1.59.19-.33.4-.67\n                .41-1.06.1-1.79.06-3.57\n                .07-5.36.01-4.03-.01-8.05\n                .02-12.07z\"\/>\n\n            <\/svg>\n\n        `,\n\n\n        youtube: `\n\n            <svg width=\"21\" height=\"21\"\n                viewBox=\"0 0 24 24\"\n                fill=\"currentColor\">\n\n                <path d=\"M23.5 6.2a3 3 0 0 0-2.1-2.1\n                C19.5 3.6 12 3.6 12 3.6s-7.5 0-9.4.5\n                A3 3 0 0 0 .5 6.2 31.5 31.5 0 0 0\n                0 12a31.5 31.5 0 0 0 .5 5.8\n                3 3 0 0 0 2.1 2.1c1.9.5\n                9.4.5 9.4.5s7.5 0 9.4-.5\n                a3 3 0 0 0 2.1-2.1A31.5\n                31.5 0 0 0 24 12a31.5 31.5\n                0 0 0-.5-5.8zM9.6 15.6V8.4\n                l6.3 3.6-6.3 3.6z\"\/>\n\n            <\/svg>\n\n        `,\n\n\n        website: `\n\n            <svg width=\"20\" height=\"20\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\">\n\n                <circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle>\n\n                <path d=\"M2 12h20\"><\/path>\n\n                <path d=\"M12 2a15 15 0 0 1 4 10\n                         15 15 0 0 1-4 10\n                         15 15 0 0 1-4-10\n                         15 15 0 0 1 4-10z\">\n                <\/path>\n\n            <\/svg>\n\n        `\n\n    };\n\n\n    return (\n        icons[type] ||\n        icons.website\n    );\n\n}\n\n\n\n\/* =========================================================\n   RENDER MEDIA\n========================================================= *\/\n\ndata.media.forEach(\n\n    function (item) {\n\n\n        const link =\n            document.createElement(\n                \"a\"\n            );\n\n\n        link.className =\n            \"humas-media-card\";\n\n\n        link.href =\n            item.url;\n\n\n        link.target =\n            \"_blank\";\n\n\n        link.rel =\n            \"noopener noreferrer\";\n\n\n        link.innerHTML = `\n\n            <div class=\"humas-media-card-icon\">\n\n                ${mediaIcon(\n                    item.icon\n                )}\n\n            <\/div>\n\n\n            <div>\n\n                <strong>\n\n                    ${escapeHTML(\n                        item.nama\n                    )}\n\n                <\/strong>\n\n                <span>\n\n                    ${escapeHTML(\n                        item.akun\n                    )}\n\n                <\/span>\n\n            <\/div>\n\n        `;\n\n\n        mediaGrid.appendChild(\n            link\n        );\n\n    }\n\n);\n\n\n\n\/* =========================================================\n   GOOGLE DRIVE\n========================================================= *\/\n\nfunction drivePreview(fileId) {\n\n    return (\n        \"https:\/\/drive.google.com\/file\/d\/\" +\n        fileId +\n        \"\/view\"\n    );\n\n}\n\n\nfunction driveDownload(fileId) {\n\n    return (\n        \"https:\/\/drive.google.com\/uc?export=download&id=\" +\n        fileId\n    );\n\n}\n\n\n\n\/* =========================================================\n   DOCUMENTS\n========================================================= *\/\n\nfunction renderDocuments(list) {\n\n\n    documentGrid.innerHTML =\n        \"\";\n\n\n    documentCount.textContent =\n        list.length;\n\n\n    if (\n        list.length === 0\n    ) {\n\n        empty.style.display =\n            \"block\";\n\n        return;\n\n    }\n\n\n    empty.style.display =\n        \"none\";\n\n\n    list.forEach(\n\n        function (doc) {\n\n\n            const card =\n                document.createElement(\n                    \"article\"\n                );\n\n\n            card.className =\n                \"humas-doc-card\";\n\n\n            card.innerHTML = `\n\n                <div class=\"humas-doc-cover\">\n\n\n                    <div class=\"humas-cover-fallback\">\n\n                        <strong>\n                            HUMAS\n                        <\/strong>\n\n                        <span>\n                            DOKUMEN IPTAR\n                        <\/span>\n\n                    <\/div>\n\n\n                    <img\n                        src=\"${escapeHTML(\n                            doc.cover\n                        )}\"\n                        alt=\"${escapeHTML(\n                            doc.nama\n                        )}\"\n                        loading=\"lazy\"\n                        decoding=\"async\"\n                    >\n\n\n                    <span class=\"humas-doc-badge\">\n                        HUMAS IPTAR\n                    <\/span>\n\n                <\/div>\n\n\n                <div class=\"humas-doc-body\">\n\n\n                    <span class=\"humas-doc-category\">\n\n                        ${escapeHTML(\n                            doc.kategori\n                        )}\n\n                    <\/span>\n\n\n                    <h3>\n\n                        ${escapeHTML(\n                            doc.nama\n                        )}\n\n                    <\/h3>\n\n\n                    <div class=\"humas-doc-meta\">\n\n                        <span>\n\n                            ${escapeHTML(\n                                doc.tahun\n                            )}\n\n                        <\/span>\n\n                        <i><\/i>\n\n                        <span>\n                            Dokumen\n                        <\/span>\n\n                    <\/div>\n\n\n                    <div class=\"humas-actions\">\n\n\n                        <a\n                            href=\"${drivePreview(\n                                doc.fileId\n                            )}\"\n                            target=\"_blank\"\n                            rel=\"noopener noreferrer\"\n                            class=\"humas-btn humas-view\">\n\n                            <svg\n                                width=\"14\"\n                                height=\"14\"\n                                viewBox=\"0 0 24 24\"\n                                fill=\"none\"\n                                stroke=\"currentColor\"\n                                stroke-width=\"2\">\n\n                                <path d=\"M1 12s4-8 11-8\n                                         11 8 11 8\n                                         -4 8-11 8\n                                         S1 12 1 12z\">\n                                <\/path>\n\n                                <circle\n                                    cx=\"12\"\n                                    cy=\"12\"\n                                    r=\"3\">\n                                <\/circle>\n\n                            <\/svg>\n\n                            Lihat\n\n                        <\/a>\n\n\n                        <a\n                            href=\"${driveDownload(\n                                doc.fileId\n                            )}\"\n                            target=\"_blank\"\n                            rel=\"noopener noreferrer\"\n                            class=\"humas-btn humas-download\">\n\n                            <svg\n                                width=\"14\"\n                                height=\"14\"\n                                viewBox=\"0 0 24 24\"\n                                fill=\"none\"\n                                stroke=\"currentColor\"\n                                stroke-width=\"2\">\n\n                                <path d=\"M21 15v4\n                                         a2 2 0 0 1-2 2H5\n                                         a2 2 0 0 1-2-2v-4\">\n                                <\/path>\n\n                                <polyline\n                                    points=\"7 10 12 15 17 10\">\n                                <\/polyline>\n\n                                <line\n                                    x1=\"12\"\n                                    y1=\"15\"\n                                    x2=\"12\"\n                                    y2=\"3\">\n                                <\/line>\n\n                            <\/svg>\n\n                            Download\n\n                        <\/a>\n\n\n                    <\/div>\n\n                <\/div>\n\n            `;\n\n\n            const img =\n                card.querySelector(\n                    \".humas-doc-cover img\"\n                );\n\n\n            img.addEventListener(\n\n                \"error\",\n\n                function () {\n\n                    img.style.display =\n                        \"none\";\n\n                }\n\n            );\n\n\n            documentGrid.appendChild(\n                card\n            );\n\n        }\n\n    );\n\n}\n\n\n\n\/* =========================================================\n   SEARCH\n========================================================= *\/\n\nsearch.addEventListener(\n\n    \"input\",\n\n    function () {\n\n\n        const keyword =\n            this.value\n                .toLowerCase()\n                .trim();\n\n\n        const filtered =\n            data.dokumen.filter(\n\n                function (doc) {\n\n\n                    const text =\n                        (\n                            doc.nama +\n                            \" \" +\n                            doc.kategori +\n                            \" \" +\n                            doc.tahun\n                        )\n                        .toLowerCase();\n\n\n                    return text.includes(\n                        keyword\n                    );\n\n                }\n\n            );\n\n\n        renderDocuments(\n            filtered\n        );\n\n    }\n\n);\n\n\n\n\/* =========================================================\n   RESET\n========================================================= *\/\n\nreset.addEventListener(\n\n    \"click\",\n\n    function () {\n\n        search.value =\n            \"\";\n\n\n        renderDocuments(\n            data.dokumen\n        );\n\n\n        search.focus();\n\n    }\n\n);\n\n\n\n\/* =========================================================\n   START\n========================================================= *\/\n\nrenderDocuments(\n    data.dokumen\n);\n\n\n})();\n\n<\/script>\n\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>HUMAS Kepala Humas Kepala Unit INFORMASI &#038; KOMUNIKASI IPTAR HUMAS IPTAR Publikasi Informasi institusi Digital Website &#038; media sosial Branding [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1132","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.4 (Yoast SEO v28.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>HUMAS - Institut Pendidikan dan Teknologi &#039;Aisyiyah riau<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/iptar.ac.id\/index.php\/humas\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"HUMAS\" \/>\n<meta property=\"og:description\" content=\"HUMAS Kepala Humas Kepala Unit INFORMASI &#038; KOMUNIKASI IPTAR HUMAS IPTAR Publikasi Informasi institusi Digital Website &#038; media sosial Branding [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/iptar.ac.id\/index.php\/humas\/\" \/>\n<meta property=\"og:site_name\" content=\"Institut Pendidikan dan Teknologi &#039;Aisyiyah riau\" \/>\n<meta property=\"article:modified_time\" content=\"2026-08-25T05:32:13+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/iptar.ac.id\\\/index.php\\\/humas\\\/\",\"url\":\"https:\\\/\\\/iptar.ac.id\\\/index.php\\\/humas\\\/\",\"name\":\"HUMAS - Institut Pendidikan dan Teknologi &#039;Aisyiyah riau\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/iptar.ac.id\\\/#website\"},\"datePublished\":\"2026-08-25T04:47:59+00:00\",\"dateModified\":\"2026-08-25T05:32:13+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/iptar.ac.id\\\/index.php\\\/humas\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/iptar.ac.id\\\/index.php\\\/humas\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/iptar.ac.id\\\/index.php\\\/humas\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/iptar.ac.id\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"HUMAS\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/iptar.ac.id\\\/#website\",\"url\":\"https:\\\/\\\/iptar.ac.id\\\/\",\"name\":\"Institut Pendidikan dan Teknologi 'Aisyiyah riau\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/iptar.ac.id\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/iptar.ac.id\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/iptar.ac.id\\\/#organization\",\"name\":\"Institut Pendidikan dan Teknologi 'Aisyiyah riau\",\"url\":\"https:\\\/\\\/iptar.ac.id\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/iptar.ac.id\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/iptar.ac.id\\\/wp-content\\\/uploads\\\/2025\\\/11\\\/cropped-iptar-bandage-1-scaled-1.png\",\"contentUrl\":\"https:\\\/\\\/iptar.ac.id\\\/wp-content\\\/uploads\\\/2025\\\/11\\\/cropped-iptar-bandage-1-scaled-1.png\",\"width\":2560,\"height\":890,\"caption\":\"Institut Pendidikan dan Teknologi 'Aisyiyah riau\"},\"image\":{\"@id\":\"https:\\\/\\\/iptar.ac.id\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"HUMAS - Institut Pendidikan dan Teknologi &#039;Aisyiyah riau","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/iptar.ac.id\/index.php\/humas\/","og_locale":"en_US","og_type":"article","og_title":"HUMAS","og_description":"HUMAS Kepala Humas Kepala Unit INFORMASI &#038; KOMUNIKASI IPTAR HUMAS IPTAR Publikasi Informasi institusi Digital Website &#038; media sosial Branding [&hellip;]","og_url":"https:\/\/iptar.ac.id\/index.php\/humas\/","og_site_name":"Institut Pendidikan dan Teknologi &#039;Aisyiyah riau","article_modified_time":"2026-08-25T05:32:13+00:00","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/iptar.ac.id\/index.php\/humas\/","url":"https:\/\/iptar.ac.id\/index.php\/humas\/","name":"HUMAS - Institut Pendidikan dan Teknologi &#039;Aisyiyah riau","isPartOf":{"@id":"https:\/\/iptar.ac.id\/#website"},"datePublished":"2026-08-25T04:47:59+00:00","dateModified":"2026-08-25T05:32:13+00:00","breadcrumb":{"@id":"https:\/\/iptar.ac.id\/index.php\/humas\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/iptar.ac.id\/index.php\/humas\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/iptar.ac.id\/index.php\/humas\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/iptar.ac.id\/"},{"@type":"ListItem","position":2,"name":"HUMAS"}]},{"@type":"WebSite","@id":"https:\/\/iptar.ac.id\/#website","url":"https:\/\/iptar.ac.id\/","name":"Institut Pendidikan dan Teknologi 'Aisyiyah riau","description":"","publisher":{"@id":"https:\/\/iptar.ac.id\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/iptar.ac.id\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/iptar.ac.id\/#organization","name":"Institut Pendidikan dan Teknologi 'Aisyiyah riau","url":"https:\/\/iptar.ac.id\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/iptar.ac.id\/#\/schema\/logo\/image\/","url":"https:\/\/iptar.ac.id\/wp-content\/uploads\/2025\/11\/cropped-iptar-bandage-1-scaled-1.png","contentUrl":"https:\/\/iptar.ac.id\/wp-content\/uploads\/2025\/11\/cropped-iptar-bandage-1-scaled-1.png","width":2560,"height":890,"caption":"Institut Pendidikan dan Teknologi 'Aisyiyah riau"},"image":{"@id":"https:\/\/iptar.ac.id\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/iptar.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/1132","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/iptar.ac.id\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/iptar.ac.id\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/iptar.ac.id\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/iptar.ac.id\/index.php\/wp-json\/wp\/v2\/comments?post=1132"}],"version-history":[{"count":7,"href":"https:\/\/iptar.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/1132\/revisions"}],"predecessor-version":[{"id":1155,"href":"https:\/\/iptar.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/1132\/revisions\/1155"}],"wp:attachment":[{"href":"https:\/\/iptar.ac.id\/index.php\/wp-json\/wp\/v2\/media?parent=1132"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}