{"id":9847,"date":"2026-10-30T08:59:45","date_gmt":"2026-10-30T08:59:45","guid":{"rendered":"https:\/\/www.vccp.com\/singapore\/?page_id=9847"},"modified":"2026-10-30T08:59:45","modified_gmt":"2026-10-30T08:59:45","slug":"working-at-govt-vccp","status":"publish","type":"page","link":"https:\/\/www.vccp.com\/singapore\/working-at-govt-vccp","title":{"rendered":"Careers"},"content":{"rendered":"<div class=\"lazyblock-custom-php-1zi0Ql wp-block-lazyblock-custom-php\">  \r\n            <div class=\"fullwidth fullwidth--bottom-lg fullwidth--overflow\">\n    <div class=\"container\">\n    <h2 class=\"title\">Our Principles<\/h2>\n        <p class=\"text-center\">VCCP was founded on 24th January 2002 by Charles (V), Rooney (C), Adrian (C) and Ian (P). They were united by their desire to challenge the bad habits of the big global agencies they had previously worked at. So, on our very first day of business we created ten founding principles. They are our code of conduct, our contract to one another and our contract with our clients.<\/p>\n        <div class=\"embed-responsive embed-responsive-5by2 principles\">\n            <div class=\"embed-responsive-item\">\n                <div class=\"principle-item principle-item--6 principle-item--ontime\">\n                    <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beOnTime.svg\" alt=\"Be on time\" class=\"img-fluid principle-item--image\">\n                    <span class=\"principle-text\">Be on time<\/span>\n                <\/div>\n                <div class=\"principle-item principle-item--14 principle-item--honest principle-item--reverse\">\n                    <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beHonest.svg\" alt=\"Be honest\" class=\"img-fluid principle-item--image\">\n                    <span class=\"principle-text\">Be honest<\/span>\n                <\/div>\n                <div class=\"principle-item principle-item principle-item--14 principle-item--approachable\">\n                    <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beApproachable.svg\" alt=\"Be approachable\" class=\"img-fluid principle-item--image\">\n                    <span class=\"principle-text\">Be approachable<\/span>\n                <\/div>\n                <div class=\"principle-item principle-item--18 principle-item--happy\">\n                    <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beHappy.svg\" alt=\"Be happy\" class=\"img-fluid principle-item--image\">\n                    <span class=\"principle-text\">Be happy<\/span>\n                <\/div>\n                <div class=\"principle-item principle-item--18 principle-item--clear\">\n                    <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beClear.svg\" alt=\"Be clear\" class=\"img-fluid principle-item--image\">\n                    <span class=\"principle-text\">Be clear<\/span>\n                <\/div>\n                <div class=\"principle-item principle-item--14 principle-item--agile principle-item--reverse principle-item--top\">\n                    <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beAgile.svg\" alt=\"Be agile\" class=\"img-fluid principle-item--image\">\n                    <span class=\"principle-text\">Be agile<\/span>\n                <\/div>\n                <div class=\"principle-item principle-item--6 principle-item--lean\">\n                    <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beLean.svg\" alt=\"Be lean\" class=\"img-fluid principle-item--image\">\n                    <span class=\"principle-text\">Be lean<\/span>\n                <\/div>\n                <div class=\"principle-item principle-item--7 principle-item--proud\">\n                    <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beProud.svg\" alt=\"Be proud\" class=\"img-fluid principle-item--image\">\n                    <span class=\"principle-text\">Be proud<\/span>\n                <\/div>\n                <div class=\"principle-item principle-item--7 principle-item--responsible principle-item--reverse\">\n                    <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beResponsible.svg\" alt=\"Be responsible\" class=\"img-fluid principle-item--image\">\n                    <span class=\"principle-text\">Be responsible<\/span>\n                <\/div>\n                <div class=\"principle-item principle-item--7 principle-item--unprecious\">\n                    <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beUnprecious.svg\" alt=\"Be unprecious\" class=\"img-fluid principle-item--image\">\n                    <span class=\"principle-text\">Be unprecious<\/span>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <div class=\"row justify-content-center principles--carousel\">\n            <div class=\"col-sm-10 col-md-8\">\n                <div id=\"imageCarousel\" class=\"carousel slide\" data-ride=\"carousel\" data-interval=\"false\">\n                    <div class=\"carousel-inner\" style=\"min-height: 0px\">\n                        <div class=\"carousel-item active\">\n                            <div class=\"principle-item principle-item--6 principle-item--ontime\">\n                                <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beOnTime.svg\" alt=\"Be on time\" class=\"img-fluid principle-item--image\">\n                                <span class=\"principle-text\">Be on time<\/span>\n                            <\/div>\n                        <\/div>\n                        <div class=\"carousel-item\">\n                            <div class=\"principle-item\">\n                                <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beHonest.svg\" alt=\"Be honest\" class=\"img-fluid principle-item--image\">\n                                <span class=\"principle-text\">Be honest<\/span>\n                            <\/div>\n                        <\/div>\n                        <div class=\"carousel-item\">\n                            <div class=\"principle-item principle-item principle-item--14 principle-item--approachable\">\n                                <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beApproachable.svg\" alt=\"Be approachable\" class=\"img-fluid principle-item--image\">\n                                <span class=\"principle-text\">Be approachable<\/span>\n                            <\/div>\n                        <\/div>\n                        <div class=\"carousel-item\">\n                            <div class=\"principle-item principle-item--20 principle-item--happy\">\n                                <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beHappy.svg\" alt=\"Be happy\" class=\"img-fluid principle-item--image\">\n                                <span class=\"principle-text\">Be happy<\/span>\n                            <\/div>\n                        <\/div>\n                        <div class=\"carousel-item\">\n                            <div class=\"principle-item principle-item--20 principle-item--clear\">\n                                <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beClear.svg\" alt=\"Be clear\" class=\"img-fluid principle-item--image\">\n                                <span class=\"principle-text\">Be clear<\/span>\n                            <\/div>\n                        <\/div>\n                        <div class=\"carousel-item\">\n                            <div class=\"principle-item principle-item--15 principle-item--agile principle-item--reverse principle-item--top\">\n                                <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beAgile.svg\" alt=\"Be agile\" class=\"img-fluid principle-item--image\">\n                                <span class=\"principle-text\">Be agile<\/span>\n                            <\/div>\n                        <\/div>\n                        <div class=\"carousel-item\">\n                            <div class=\"principle-item principle-item--6 principle-item--lean\">\n                                <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beLean.svg\" alt=\"Be lean\" class=\"img-fluid principle-item--image\">\n                                <span class=\"principle-text\">Be lean<\/span>\n                            <\/div>\n                        <\/div>\n                        <div class=\"carousel-item\">\n                            <div class=\"principle-item principle-item--7 principle-item--proud\">\n                                <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beProud.svg\" alt=\"Be proud\" class=\"img-fluid principle-item--image\">\n                                <span class=\"principle-text\">Be proud<\/span>\n                            <\/div>\n                        <\/div>\n                        <div class=\"carousel-item\">\n                            <div class=\"principle-item principle-item--7 principle-item--responsible principle-item--reverse\">\n                                <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beResponsible.svg\" alt=\"Be responsible\" class=\"img-fluid principle-item--image\">\n                                <span class=\"principle-text\">Be responsible<\/span>\n                            <\/div>\n                        <\/div>\n                        <div class=\"carousel-item\">\n                            <div class=\"principle-item principle-item--7 principle-item--unprecious\">\n                                <img decoding=\"async\" src=\"\/wp-content\/themes\/vccp-theme\/static\/assets\/image\/principles\/beUnprecious.svg\" alt=\"Be unprecious\" class=\"img-fluid principle-item--image\">\n                                <span class=\"principle-text\">Be unprecious<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                    <a class=\"carousel-control-prev btn btn-sm btn-icon-only h5\" href=\"#imageCarousel\" role=\"button\" data-slide=\"prev\">\n                        \n                        <span class=\"sr-only\">Previous<\/span>\n                    <\/a>\n                    <a class=\"carousel-control-next btn btn-sm btn-icon-only h5\" href=\"#imageCarousel\" role=\"button\" data-slide=\"next\">\n                        \n                        <span class=\"sr-only\">Next<\/span>\n                    <\/a>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>        \r\n<\/div>\n\n<div class=\"lazyblock-custom-php-Z2qLukl wp-block-lazyblock-custom-php\">  \r\n            <div id=\"vacancies\"><\/div>\n<style>\n    .job-section {\n        max-width: 1100px;\n        margin: auto;\n        padding: 50px 20px;\n    }\n\n    .job-section h1 {\n        text-align: center;\n        margin-bottom: 2rem;\n    }\n\n    .jobs-status {\n        font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;\n        font-size: 13px;\n        color: #666;\n        margin: 0 0 14px;\n    }\n\n    .filter-bar {\n        display: flex;\n        gap: 1rem;\n        flex-wrap: wrap;\n        margin-bottom: 1.5rem;\n    }\n\n    .filter {\n        position: relative;\n        font-size: 18px;\n    }\n\n    .filter button {\n        padding: 0.6rem 1rem;\n        border-bottom: 2px solid #000 !important;\n        border-top: 0 !important;\n        border-left: 0 !important;\n        border-right: 0 !important;\n        border-radius: 0 !important;\n        background: transparent !important;\n        cursor: pointer;\n        min-width: 180px;\n        text-align: left;\n        line-height: 18px;\n        color: #000;\n    }\n\n    .filter button::after {\n        content: \"\u25be\";\n        float: right;\n    }\n\n    .dropdown {\n        position: absolute;\n        top: 110%;\n        left: 0;\n        background: #fff;\n        border: 1px solid #ddd;\n        border-radius: 6px;\n        padding: 0.25rem 0;\n        width: 320px;\n        max-height: 320px;\n        overflow-y: auto;\n        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n        display: none;\n        z-index: 10;\n    }\n\n    .filter.open .dropdown {\n        display: block;\n    }\n\n    .dropdown .option {\n        display: flex;\n        align-items: center;\n        gap: 10px;\n        padding: 0.6rem 1rem;\n        cursor: pointer;\n        font-size: 0.9rem;\n        user-select: none;\n    }\n\n    .dropdown .option:hover {\n        background: #f0f0f0;\n    }\n\n    .actions-bar {\n        display: flex;\n        gap: 10px;\n        justify-content: flex-end;\n        flex-wrap: wrap;\n        margin-bottom: 20px;\n    }\n\n    .clear-filters {\n        border: 1px solid #000;\n        background: #000 !important;\n        color: #fff;\n        padding: 0.6rem 1.8rem;\n        border-radius: 35px;\n        cursor: pointer;\n        text-decoration: none;\n        font-size: 18px;\n    }\n\n    .clear-filters.secondary {\n        background: #fff !important;\n        color: #000;\n        font-size: 18px;\n    }\n\n    .clear-filters:hover {\n        background: #000 !important;\n        color: #fff;\n    }\n\n    \/* Job alerts bar *\/\n    .job-alerts {\n        display: flex;\n        justify-content: space-between;\n        gap: 12px;\n        flex-wrap: wrap;\n        align-items: center;\n        padding: 12px 14px;\n        border: 1px solid #000;\n        border-radius: 10px;\n        margin: 0 0 18px;\n        font-family: inherit;\n    }\n\n    .job-alerts-text {\n        font-size: 13px;\n        color: #000;\n        opacity: .9;\n    }\n\n    .job-alerts-controls {\n        display: flex;\n        gap: 10px;\n        flex-wrap: wrap;\n        align-items: center;\n    }\n\n    .job-alerts .filter button {\n        border: 1px solid #ddd !important;\n        border-radius: 10px !important;\n        border-bottom: 1px solid #ddd !important;\n        background: #fff !important;\n        min-width: 260px;\n    }\n\n    .job-alerts-btn {\n        display: inline-block;\n        padding: 10px 14px;\n        border: 1px solid #000;\n        border-radius: 999px;\n        text-decoration: none;\n        font-size: 13px;\n        color: #000;\n        background: #fff;\n        cursor: pointer;\n        white-space: nowrap;\n        transition: color .25s, background-color .25s, border-color .25s;\n    }\n\n    .job-alerts-btn:hover {\n        color: #fff;\n        background: #000;\n    }\n\n    .job-alerts-btn[aria-disabled=\"true\"] {\n        opacity: .45;\n        pointer-events: none;\n    }\n\n    .job-list {\n        display: flex;\n        flex-direction: column;\n    }\n\n    .job-item {\n        padding: 1rem;\n        border-bottom: 1px solid #000;\n        display: flex;\n        flex-wrap: wrap;\n        justify-content: space-between;\n        align-items: flex-start;\n        gap: 0.75rem;\n        transition: background 0.2s, box-shadow 0.2s;\n    }\n\n    .job-item:hover {\n        background: #f5f5f5;\n        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);\n    }\n\n    .job-info {\n        display: flex;\n        flex-direction: column;\n        gap: 0.25rem;\n        flex: 1;\n        min-width: 280px;\n        color: #000;\n    }\n\n    .job-info h4 {\n        margin: 0;\n        font-size: 1rem;\n        color: #000;\n    }\n\n    .job-company-btn {\n        display: none;\n    }\n\n    .job-meta {\n        font-size: 0.85rem;\n        opacity: 0.7;\n    }\n\n    .view-job {\n        display: inline-block;\n        padding: 0.5rem 1rem;\n        border: 1px solid #000;\n        background-color: #000;\n        border-radius: 999px;\n        text-decoration: none;\n        font-size: 0.85rem;\n        color: #fff;\n        transition: color .25s, background-color .25s, border-color .25s;\n        white-space: nowrap;\n        align-self: flex-start;\n    }\n\n    .view-job:hover, \n    #viewGlobalRoles:hover {\n        color: #000;\n        background: #fff !important;\n        border: 1px solid #000;\n    }\n\n    @media only screen and (max-width: 600px) {\n        .filter {\n            width: 100%;\n        }\n\n        .filter button {\n            width: 100%;\n        }\n\n        .job-alerts .filter button {\n            width: 100%;\n            min-width: 0;\n        }\n    }\n\n    \/* ===========================\n     MODAL (with white bar)\n  ============================ *\/\n    .gh-modal-backdrop {\n        position: fixed;\n        inset: 0;\n        background: rgba(0, 0, 0, .55);\n        z-index: 999999;\n        display: none;\n        align-items: center;\n        justify-content: center;\n        padding: 18px;\n    }\n\n    .gh-modal-backdrop[aria-hidden=\"false\"] {\n        display: flex;\n        touch-action: none;\n    }\n\n    .gh-modal {\n        width: min(1100px, 100%);\n        height: min(92vh, 920px);\n        background: #fff;\n        border-radius: 14px;\n        overflow: hidden;\n        box-shadow: 0 10px 40px rgba(0, 0, 0, .25);\n        display: flex;\n        flex-direction: column;\n    }\n\n    .gh-modal-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        gap: 12px;\n        padding: 12px 14px;\n        border-bottom: 1px solid #e5e5e5;\n    }\n\n    .gh-modal-title {\n        font-size: 14px;\n        font-weight: 600;\n        margin: 0;\n        line-height: 1.2;\n        display: none;\n    }\n\n    .gh-modal-sub {\n        font-size: 12px;\n        color: #666;\n        margin: 2px 0 0;\n        display: none;\n    }\n\n    .gh-modal-actions {\n        display: flex;\n        gap: 10px;\n        align-items: center;\n    }\n\n    .gh-modal-close {\n        border: 1px solid #000;\n        background: #000;\n        color: #fff;\n        padding: 8px 12px;\n        border-radius: 999px;\n        cursor: pointer;\n        font-size: 13px;\n    }\n\n    .gh-modal-close.secondary {\n        background: #fff;\n        color: #000;\n    }\n\n    .gh-modal-body {\n        position: relative;\n        flex: 1;\n        overflow: hidden;\n        background: #fff;\n    }\n\n    #gh-embed-wrap {\n        position: absolute;\n        inset: 0;\n    }\n\n    #ghJobFrame {\n        position: absolute;\n        inset: 0;\n        width: 100%;\n        height: 100%;\n        border: 0;\n        display: block;\n    }\n<\/style>\n\n<div class=\"job-section\" id=\"ghJobsApp\">\n    <div class=\"jobs-status\" id=\"jobsStatus\">Loading jobs\u2026<\/div>\n\n    <div class=\"job-alerts\" id=\"jobAlertsBar\" aria-live=\"polite\">\n        <div class=\"job-alerts-text\" id=\"jobAlertsText\">Get new roles sent to your inbox.<\/div>\n\n        <div class=\"job-alerts-controls\">\n            <button id=\"jobAlertBtn\" class=\"job-alerts-btn\" type=\"button\">\n                Create job alert\n            <\/button>\n        <\/div>\n    <\/div>\n\n    <div class=\"filter-bar\" id=\"filters\"><\/div>\n\n    <div class=\"actions-bar\">\n        <button class=\"clear-filters secondary\" id=\"clearTitleLocation\" type=\"button\">\n            Clear Location &amp; Role Type\n        <\/button>\n\n        <a class=\"clear-filters\" id=\"viewGlobalRoles\" href=\"https:\/\/www.vccp.com\/careers\/\" target=\"_blank\"\n            rel=\"noopener\">\n            View Global Roles\n        <\/a>\n    <\/div>\n\n    <div class=\"job-list\" id=\"job-list\"><\/div>\n<\/div>\n\n<!-- Modal -->\n<div class=\"gh-modal-backdrop\" id=\"ghModalBackdrop\" aria-hidden=\"true\" role=\"dialog\" aria-modal=\"true\"\n    aria-label=\"Job application\">\n    <div class=\"gh-modal\" role=\"document\">\n        <div class=\"gh-modal-header\">\n            <div>\n                <p class=\"gh-modal-title\" id=\"ghModalTitle\">Job application<\/p>\n                <p class=\"gh-modal-sub\" id=\"ghModalSub\">Loading\u2026<\/p>\n            <\/div>\n            <div class=\"gh-modal-actions\">\n                <button class=\"gh-modal-close\" type=\"button\" id=\"ghModalClose\">Close<\/button>\n            <\/div>\n        <\/div>\n\n        <div class=\"gh-modal-body\">\n            <div id=\"gh-embed-wrap\">\n                <div id=\"gh-hide-back\" aria-hidden=\"true\"><\/div>\n                <iframe id=\"ghJobFrame\" title=\"Greenhouse job application\" src=\"about:blank\" loading=\"eager\"\n                    scrolling=\"yes\"><\/iframe>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<script>\n    (function () {\n        \/\/ Examples: \"slingandstone\", \"vccpgroupllp\", \"girlandbear\", \"bernadette\"\n        const BOARD_API_NAME = \"govtvccp\";\n\n        \/\/ Optional: label for display purposes (doesn't affect fetching)\n        const BOARD_LABEL = \"GOVT VCCP\";\n\n        \/\/ Internals now use a single-board list derived from BOARD_API_NAME\n        const BOARDS = [{ apiName: BOARD_API_NAME, label: BOARD_LABEL }];\n\n        const ROLE_TYPE_FIELD_ALIASES = [\"ROLE_TYPE\", \"role_type\", \"Role Type\", \"Role (Function)\"].map(s => s.toLowerCase());\n        const FILTER_LABELS = {\n            location: \"Location\",\n            roleType: \"Role (Function)\"\n        };\n\n        const FETCH_CONCURRENCY = 2;   \/\/ single board = can be low\n        const RENDER_CHUNK_SIZE = 60;\n\n        const statusEl = document.getElementById(\"jobsStatus\");\n        const filtersEl = document.getElementById(\"filters\");\n        const listEl = document.getElementById(\"job-list\");\n        const clearBtn = document.getElementById(\"clearTitleLocation\");\n\n        \/\/ Modal elements\n        const modalBackdrop = document.getElementById(\"ghModalBackdrop\");\n        const modalTitle = document.getElementById(\"ghModalTitle\");\n        const modalSub = document.getElementById(\"ghModalSub\");\n        const modalCloseBtn = document.getElementById(\"ghModalClose\");\n        const modalOpenNewBtn = document.getElementById(\"ghModalOpenNew\");\n        const jobFrame = document.getElementById(\"ghJobFrame\");\n\n        \/\/ Alerts button\n        const jobAlertBtn = document.getElementById(\"jobAlertBtn\");\n\n        if (!statusEl || !filtersEl || !listEl || !clearBtn || !modalBackdrop || !jobFrame) return;\n\n        let allJobs = [];\n        let activeFilters = {\n            location: null,\n            roleType: null\n        };\n\n        const ui = { filterBtnByKey: new Map() };\n        let renderVersion = 0;\n\n        \/\/ ===== Modal controller =====\n        let lastFocusedEl = null;\n        let currentJobUrl = null;\n\n        function hostedJobUrl(board, jid) {\n            return `https:\/\/job-boards.eu.greenhouse.io\/${encodeURIComponent(board)}\/jobs\/${encodeURIComponent(jid)}`;\n        }\n\n        function openJobModal(job) {\n            lastFocusedEl = document.activeElement;\n\n            modalTitle.textContent = job.title || \"Job application\";\n            modalSub.textContent = (job.location?.name || \"\");\n\n            currentJobUrl = hostedJobUrl(job._boardApiName, job.id);\n            jobFrame.src = currentJobUrl;\n\n            modalBackdrop.setAttribute(\"aria-hidden\", \"false\");\n            document.body.style.overflow = \"hidden\";\n            setTimeout(() => { modalCloseBtn && modalCloseBtn.focus(); }, 0);\n        }\n\n        function closeJobModal() {\n            modalBackdrop.setAttribute(\"aria-hidden\", \"true\");\n            document.body.style.overflow = \"\";\n            jobFrame.src = \"about:blank\";\n            currentJobUrl = null;\n            if (lastFocusedEl && typeof lastFocusedEl.focus === \"function\") lastFocusedEl.focus();\n        }\n\n        modalCloseBtn && modalCloseBtn.addEventListener(\"click\", closeJobModal);\n        modalBackdrop.addEventListener(\"click\", (e) => { if (e.target === modalBackdrop) closeJobModal(); });\n        document.addEventListener(\"keydown\", (e) => {\n            if (e.key === \"Escape\" && modalBackdrop.getAttribute(\"aria-hidden\") === \"false\") closeJobModal();\n        });\n\n        modalOpenNewBtn && modalOpenNewBtn.addEventListener(\"click\", () => {\n            if (!currentJobUrl) return;\n            window.open(currentJobUrl, \"_blank\", \"noopener\");\n        });\n\n        \/\/ ===== Status =====\n        function setStatusJobsCount(n) {\n            statusEl.textContent = `${n} job${n === 1 ? \"\" : \"s\"} listed`;\n        }\n        function setStatusLoading() {\n            statusEl.textContent = \"Loading jobs\u2026\";\n        }\n\n        \/\/ ===== Role type extractor =====\n        function getRoleTypeValues(job) {\n            const norm = (v) =>\n                (Array.isArray(v) ? v : [v])\n                    .flatMap(x => (typeof x === \"string\" ? x.split(\/[,|\\n\\r]+\/g) : [x]))\n                    .map(x => String(x).trim())\n                    .filter(Boolean);\n\n            if (Array.isArray(job?.metadata)) {\n                const hit = job.metadata.find(m => ROLE_TYPE_FIELD_ALIASES.includes(String(m?.name || \"\").toLowerCase()));\n                if (hit && hit.value != null) return norm(hit.value);\n            }\n            if (job?.metadata && typeof job.metadata === \"object\" && !Array.isArray(job.metadata)) {\n                for (const k of Object.keys(job.metadata)) {\n                    if (ROLE_TYPE_FIELD_ALIASES.includes(String(k).toLowerCase())) return norm(job.metadata[k]);\n                }\n            }\n            if (job?.keyed_custom_fields && typeof job.keyed_custom_fields === \"object\") {\n                for (const k of Object.keys(job.keyed_custom_fields)) {\n                    if (ROLE_TYPE_FIELD_ALIASES.includes(String(k).toLowerCase())) return norm(job.keyed_custom_fields[k]);\n                }\n            }\n            if (Array.isArray(job?.custom_fields)) {\n                const hit = job.custom_fields.find(m => ROLE_TYPE_FIELD_ALIASES.includes(String(m?.name || \"\").toLowerCase()));\n                if (hit && hit.value != null) return norm(hit.value);\n            }\n            if (job && typeof job === \"object\") {\n                for (const k of Object.keys(job)) {\n                    if (ROLE_TYPE_FIELD_ALIASES.includes(String(k).toLowerCase())) return norm(job[k]);\n                }\n            }\n            return [];\n        }\n\n        \/\/ ===== Filters (Location + Role Type only) =====\n        const FILTER_CONFIG = [\n            {\n                key: \"location\",\n                label: FILTER_LABELS.location,\n                type: \"single\",\n                getValue: j => j.location?.name,\n                getButtonLabel: () => activeFilters.location ? activeFilters.location : FILTER_LABELS.location\n            },\n            {\n                key: \"roleType\",\n                label: FILTER_LABELS.roleType,\n                type: \"single\",\n                getValue: j => getRoleTypeValues(j),\n                getButtonLabel: () => activeFilters.roleType ? activeFilters.roleType : FILTER_LABELS.roleType\n            }\n        ];\n\n        function jobPassesFilters(job, { excludeKey = null } = {}) {\n            const loc = job.location?.name || \"\";\n            if (excludeKey !== \"location\" && activeFilters.location && loc !== activeFilters.location) return false;\n\n            if (excludeKey !== \"roleType\" && activeFilters.roleType) {\n                const roles = getRoleTypeValues(job);\n                if (!roles.includes(activeFilters.roleType)) return false;\n            }\n            return true;\n        }\n\n        function jobsForOptions(excludeKey) {\n            return allJobs.filter(j => jobPassesFilters(j, { excludeKey }));\n        }\n\n        function refreshFilterButtons() {\n            FILTER_CONFIG.forEach(f => {\n                const btn = ui.filterBtnByKey.get(f.key);\n                if (!btn) return;\n                btn.textContent = f.getButtonLabel ? f.getButtonLabel() : f.label;\n            });\n        }\n\n        function buildFilters() {\n            filtersEl.innerHTML = \"\";\n            ui.filterBtnByKey.clear();\n\n            FILTER_CONFIG.forEach(filter => {\n                const wrapper = document.createElement(\"div\");\n                wrapper.className = \"filter\";\n\n                const btn = document.createElement(\"button\");\n                btn.type = \"button\";\n                btn.textContent = filter.getButtonLabel ? filter.getButtonLabel() : filter.label;\n\n                const dropdown = document.createElement(\"div\");\n                dropdown.className = \"dropdown\";\n\n                const sourceJobs = jobsForOptions(filter.key);\n                const values = new Set();\n\n                sourceJobs.forEach(job => {\n                    const v = filter.getValue(job);\n                    if (filter.key === \"roleType\") {\n                        (Array.isArray(v) ? v : []).forEach(x => x && values.add(x));\n                    } else {\n                        if (v) values.add(v);\n                    }\n                });\n\n                if (filter.key === \"roleType\") values.add(\"All\");\n\n                [...values]\n                    .filter(Boolean)\n                    .sort((a, b) => {\n                        if (filter.key === \"roleType\") {\n                            if (a === \"All\" && b !== \"All\") return -1;\n                            if (b === \"All\" && a !== \"All\") return 1;\n                        }\n                        return String(a).localeCompare(String(b));\n                    })\n                    .forEach(val => {\n                        const opt = document.createElement(\"div\");\n                        opt.className = \"option\";\n                        opt.textContent = val;\n\n                        opt.onclick = (e) => {\n                            e.stopPropagation();\n                            if (filter.key === \"roleType\") {\n                                activeFilters[filter.key] = (val === \"All\") ? null : val;\n                            } else {\n                                activeFilters[filter.key] = val;\n                            }\n                            buildFilters();\n                            filterJobs();\n                            wrapper.classList.remove(\"open\");\n                        };\n\n                        dropdown.appendChild(opt);\n                    });\n\n                btn.onclick = (e) => {\n                    e.stopPropagation();\n                    document.querySelectorAll(\".filter\").forEach(f => { if (f !== wrapper) f.classList.remove(\"open\"); });\n                    wrapper.classList.toggle(\"open\");\n                };\n                dropdown.addEventListener(\"click\", e => e.stopPropagation());\n\n                wrapper.appendChild(btn);\n                wrapper.appendChild(dropdown);\n                filtersEl.appendChild(wrapper);\n\n                ui.filterBtnByKey.set(filter.key, btn);\n            });\n\n            refreshFilterButtons();\n        }\n\n        document.addEventListener(\"click\", () => {\n            document.querySelectorAll(\".filter\").forEach(f => f.classList.remove(\"open\"));\n        });\n\n        function filterJobs() {\n            const filtered = allJobs.filter(j => jobPassesFilters(j));\n            setStatusJobsCount(filtered.length);\n            renderJobsChunked(filtered);\n        }\n\n        clearBtn.onclick = () => {\n            activeFilters.location = null;\n            activeFilters.roleType = null;\n            buildFilters();\n            filterJobs();\n        };\n\n        \/\/ ===== Job alert (simple) =====\n        function myGreenhouseJobAlertUrl(boardToken) {\n            return `https:\/\/my.greenhouse.io\/users\/sign_in?job_board=${encodeURIComponent(boardToken || \"\")}`;\n        }\n        jobAlertBtn && jobAlertBtn.addEventListener(\"click\", () => {\n            window.open(myGreenhouseJobAlertUrl(BOARD_API_NAME), \"_blank\", \"noopener\");\n        });\n\n        \/\/ ===== Render list =====\n        function renderJobsChunked(jobs) {\n            renderVersion++;\n            const myVersion = renderVersion;\n\n            listEl.innerHTML = \"\";\n            if (!jobs.length) return;\n\n            let i = 0;\n            const renderChunk = () => {\n                if (myVersion !== renderVersion) return;\n\n                const frag = document.createDocumentFragment();\n                const end = Math.min(i + RENDER_CHUNK_SIZE, jobs.length);\n                for (; i < end; i++) frag.appendChild(renderJobItem(jobs[i]));\n                listEl.appendChild(frag);\n\n                if (i < jobs.length) requestAnimationFrame(renderChunk);\n            };\n            requestAnimationFrame(renderChunk);\n        }\n\n        function renderJobItem(job) {\n            const item = document.createElement(\"div\");\n            item.className = \"job-item\";\n\n            const info = document.createElement(\"div\");\n            info.className = \"job-info\";\n\n            const h4 = document.createElement(\"h4\");\n            h4.textContent = job.title;\n\n            const meta = document.createElement(\"div\");\n            meta.className = \"job-meta\";\n            meta.textContent = job.location?.name || \"\";\n\n            info.appendChild(h4);\n            info.appendChild(meta);\n\n            const link = document.createElement(\"a\");\n            link.className = \"view-job\";\n            link.href = \"#\";\n            link.textContent = \"View Job\";\n\n            link.addEventListener(\"click\", (e) => {\n                e.preventDefault();\n                e.stopPropagation();\n                openJobModal(job);\n            });\n\n            item.appendChild(info);\n            item.appendChild(link);\n            return item;\n        }\n\n        \/\/ ===== Fetch boards =====\n        async function fetchBoardJobs(board) {\n            const url = `https:\/\/boards-api.greenhouse.io\/v1\/boards\/${board.apiName}\/jobs?content=true`;\n            const res = await fetch(url);\n            if (!res.ok) throw new Error(`HTTP ${res.status}`);\n            const data = await res.json();\n            return (data.jobs || []).map(job => ({ ...job, _boardApiName: board.apiName }));\n        }\n\n        async function progressiveFetchAllBoards() {\n            setStatusLoading();\n            buildFilters();\n\n            const queue = BOARDS.slice();\n\n            const workers = Array.from({ length: Math.min(FETCH_CONCURRENCY, queue.length) }, async () => {\n                while (queue.length) {\n                    const b = queue.shift();\n                    try {\n                        const jobs = await fetchBoardJobs(b);\n                        allJobs = allJobs.concat(jobs);\n                        buildFilters();\n                        filterJobs();\n                    } catch (e) {\n                        filterJobs();\n                    }\n                }\n            });\n\n            await Promise.all(workers);\n            buildFilters();\n            filterJobs();\n        }\n\n        (async () => {\n            try {\n                await progressiveFetchAllBoards();\n            } catch (e) {\n                console.error(e);\n                statusEl.textContent = \"Couldn\u2019t load jobs.\";\n            }\n        })();\n    })(); \n<\/script>        \r\n<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":77,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"class_list":["post-9847","page","type-page","status-publish","hentry"],"acf":{"hero_video":"","hero_image":{"ID":9849,"id":9849,"title":"govt-vccp-banner","filename":"govt-vccp-banner.jpg","filesize":577576,"url":"https:\/\/www.vccp.com\/singapore\/wp-content\/uploads\/sites\/7\/2026\/09\/govt-vccp-banner.jpg","link":"https:\/\/www.vccp.com\/singapore\/working-at-govt-vccp\/attachment\/govt-vccp-banner","alt":"group photo of the GOVT VCCP team in Singapore","author":"77","description":"","caption":"","name":"govt-vccp-banner","status":"inherit","uploaded_to":9847,"date":"2026-09-29 15:13:47","modified":"2026-09-29 15:14:25","menu_order":0,"mime_type":"image\/jpeg","type":"image","subtype":"jpeg","icon":"https:\/\/www.vccp.com\/singapore\/wp-includes\/images\/media\/default.png","width":1920,"height":720,"sizes":{"thumbnail":"https:\/\/www.vccp.com\/singapore\/wp-content\/uploads\/sites\/7\/2026\/09\/govt-vccp-banner-150x150.jpg","thumbnail-width":150,"thumbnail-height":150,"medium":"https:\/\/www.vccp.com\/singapore\/wp-content\/uploads\/sites\/7\/2026\/09\/govt-vccp-banner-300x113.jpg","medium-width":300,"medium-height":113,"medium_large":"https:\/\/www.vccp.com\/singapore\/wp-content\/uploads\/sites\/7\/2026\/09\/govt-vccp-banner-768x288.jpg","medium_large-width":640,"medium_large-height":240,"large":"https:\/\/www.vccp.com\/singapore\/wp-content\/uploads\/sites\/7\/2026\/09\/govt-vccp-banner-1024x384.jpg","large-width":640,"large-height":240,"1536x1536":"https:\/\/www.vccp.com\/singapore\/wp-content\/uploads\/sites\/7\/2026\/09\/govt-vccp-banner-1536x576.jpg","1536x1536-width":1536,"1536x1536-height":576,"2048x2048":"https:\/\/www.vccp.com\/singapore\/wp-content\/uploads\/sites\/7\/2026\/09\/govt-vccp-banner.jpg","2048x2048-width":1920,"2048x2048-height":720,"Header":"https:\/\/www.vccp.com\/singapore\/wp-content\/uploads\/sites\/7\/2026\/09\/govt-vccp-banner.jpg","Header-width":1920,"Header-height":720,"Square":"https:\/\/www.vccp.com\/singapore\/wp-content\/uploads\/sites\/7\/2026\/09\/govt-vccp-banner-720x720.jpg","Square-width":720,"Square-height":720}},"meta-title":"Careers | GOVT VCCP","meta-description":"","social-media-image":"https:\/\/www.vccp.com\/singapore\/wp-content\/uploads\/sites\/7\/2026\/09\/govt-vccp-banner.jpg","related_content_title":"You may also like","relateditems":false,"hide_related_items":[]},"lang":"en","translations":{"en":9847},"pll_sync_post":[],"_links":{"self":[{"href":"https:\/\/www.vccp.com\/singapore\/wp-json\/wp\/v2\/pages\/9847","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vccp.com\/singapore\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.vccp.com\/singapore\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.vccp.com\/singapore\/wp-json\/wp\/v2\/users\/77"}],"replies":[{"embeddable":true,"href":"https:\/\/www.vccp.com\/singapore\/wp-json\/wp\/v2\/comments?post=9847"}],"version-history":[{"count":3,"href":"https:\/\/www.vccp.com\/singapore\/wp-json\/wp\/v2\/pages\/9847\/revisions"}],"predecessor-version":[{"id":9851,"href":"https:\/\/www.vccp.com\/singapore\/wp-json\/wp\/v2\/pages\/9847\/revisions\/9851"}],"wp:attachment":[{"href":"https:\/\/www.vccp.com\/singapore\/wp-json\/wp\/v2\/media?parent=9847"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}