{"id":345,"date":"2026-06-15T19:11:51","date_gmt":"2026-06-15T19:11:51","guid":{"rendered":"https:\/\/angkutku.com\/?page_id=345"},"modified":"2026-06-15T19:15:59","modified_gmt":"2026-06-15T19:15:59","slug":"homepage","status":"publish","type":"page","link":"https:\/\/angkutku.com\/en\/","title":{"rendered":""},"content":{"rendered":"\n\n<style data-wp-block-html=\"css\">\n\/* =========================================\nANGKUTKU V18 FINAL\nCSS B.1\nDESKTOP + HERO\n========================================= *\/\n\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');\n\n\/* =========================================\nRESET\n========================================= *\/\n\n*{\nmargin:0;\npadding:0;\nbox-sizing:border-box;\n}\n\nhtml{\nscroll-behavior:smooth;\n}\n\nbody{\n\nfont-family:'Poppins',sans-serif;\n\nbackground:#fff;\n\noverflow-x:hidden;\n\n-webkit-font-smoothing:antialiased;\n-moz-osx-font-smoothing:grayscale;\n\n}\n\n\/* =========================================\nROOT\n========================================= *\/\n\n:root{\n\n--ak-blue:#237EE9;\n--ak-blue-dark:#1565D8;\n\n--ak-dark:#0F172A;\n--ak-text:#475569;\n\n--ak-white:#FFFFFF;\n\n}\n\n\/* =========================================\nWRAPPER\n========================================= *\/\n\n.ak-section-hero{\n\nposition:relative;\n\nwidth:100%;\n\noverflow:hidden;\n\n}\n\n\/* =========================================\nNAVBAR\n========================================= *\/\n\n.ak-navbar{\n\nposition:fixed;\n\ntop:-140px;\n\nleft:0;\nright:0;\n\nwidth:100%;\n\nheight:100px;\n\nbackground:#fff;\n\nz-index:9999;\n\nborder-bottom:\n1px solid rgba(15,23,42,.05);\n\ntransition:\ntop .45s cubic-bezier(.4,0,.2,1),\nbackground .35s ease,\nbox-shadow .35s ease;\n\n}\n\n\/* =========================================\nSCROLL STATE\n========================================= *\/\n\n.ak-navbar.scrolled{\n\nbackground:\nrgba(255,255,255,.96);\n\nbackdrop-filter:\nblur(18px);\n\n-webkit-backdrop-filter:\nblur(18px);\n\nbox-shadow:\n0 12px 35px rgba(15,23,42,.08);\n\n}\n\n\/* =========================================\nCONTAINER\n========================================= *\/\n\n.ak-navbar-container{\n\nwidth:min(1600px,100%);\n\nheight:100px;\n\nmargin:auto;\n\npadding:0 70px;\n\ndisplay:grid;\n\ngrid-template-columns:\n280px\n1fr\n280px;\n\nalign-items:center;\n\n}\n\n\/* =========================================\nLOGO\n========================================= *\/\n\n.ak-logo{\n\ndisplay:flex;\n\nalign-items:center;\n\ntext-decoration:none;\n\n}\n\n.ak-logo img{\n\nheight:72px;\n\nwidth:auto;\n\ndisplay:block;\n\ntransition:\ntransform .3s ease;\n\n}\n\n.ak-logo:hover img{\n\ntransform:\nscale(1.02);\n\n}\n\n\/* =========================================\nDESKTOP MENU\n========================================= *\/\n\n.ak-nav-menu{\n\ndisplay:flex;\n\njustify-content:center;\n\nalign-items:center;\n\ngap:64px;\n\n}\n\n\/* =========================================\nMENU ITEM\n========================================= *\/\n\n.ak-nav-menu a{\n\nposition:relative;\n\nfont-size:16px;\n\nfont-weight:500;\n\nletter-spacing:-.2px;\n\ncolor:#111827;\n\ntext-decoration:none;\n\ntransition:\nall .25s ease;\n\n}\n\n\/* =========================================\nMENU HOVER\n========================================= *\/\n\n.ak-nav-menu a:hover{\n\ncolor:var(--ak-blue);\n\ntransform:\ntranslateY(-1px);\n\n}\n\n\/* =========================================\nUNDERLINE\n========================================= *\/\n\n.ak-nav-menu a::after{\n\ncontent:\"\";\n\nposition:absolute;\n\nleft:50%;\n\nbottom:-14px;\n\nwidth:0;\n\nheight:2px;\n\nbackground:var(--ak-blue);\n\nborder-radius:999px;\n\ntransform:\ntranslateX(-50%);\n\ntransition:\nwidth .3s ease;\n\n}\n\n.ak-nav-menu a:hover::after{\n\nwidth:100%;\n\n}\n\n\/* =========================================\nLANGUAGE\n========================================= *\/\n\n.ak-language{\n\ndisplay:flex;\n\njustify-content:flex-end;\n\nalign-items:center;\n\nfont-size:15px;\n\nfont-weight:500;\n\n}\n\n\/* =========================================\nTRANSLATEPRESS\n========================================= *\/\n\n.ak-language\n.trp-language-switcher{\n\nwidth:auto!important;\n\n}\n\n.ak-language\n.trp-language-switcher > div{\n\nbackground:transparent!important;\n\nborder:none!important;\n\n}\n\n.ak-language\n.trp-language-switcher a{\n\nfont-size:15px!important;\n\nfont-weight:500!important;\n\ncolor:#111827!important;\n\ntransition:.25s ease;\n\n}\n\n.ak-language\n.trp-language-switcher a:hover{\n\ncolor:#237EE9!important;\n\n}\n\n\/* =========================================\nMOBILE HIDDEN\n========================================= *\/\n\n.ak-menu-toggle,\n.ak-mobile-dropdown{\n\ndisplay:none;\n\n}\n\n\/* =========================================\nHERO\n========================================= *\/\n\n.ak-hero{\n\nposition:relative;\n\nwidth:100%;\n\nheight:100svh;\n\nmin-height:100svh;\n\noverflow:hidden;\n\n}\n\n\/* =========================================\nVIDEO\n========================================= *\/\n\n.ak-hero-video{\n\nposition:absolute;\n\ntop:0;\nleft:0;\n\nwidth:100%;\nheight:100%;\n\nobject-fit:cover;\n\nobject-position:center center;\n\n}\n\n\/* =========================================\nOVERLAY\n========================================= *\/\n\n.ak-hero-overlay{\n\nposition:absolute;\n\ninset:0;\n\nbackground:\nlinear-gradient(\n135deg,\nrgba(0,24,70,.38),\nrgba(0,0,0,.24)\n);\n\n}\n\n\/* =========================================\nCONTENT\n========================================= *\/\n\n.ak-hero-content{\n\nposition:relative;\n\nz-index:2;\n\nwidth:100%;\nheight:100%;\n\ndisplay:flex;\n\nflex-direction:column;\n\njustify-content:center;\n\nalign-items:center;\n\ntext-align:center;\n\npadding:\n40px 24px;\n\n}\n\n\/* =========================================\nHERO LOGO\n========================================= *\/\n\n.ak-hero-logo{\n\nmargin-bottom:42px;\n\n}\n\n.ak-hero-logo img{\n\nheight:130px;\n\nwidth:auto;\n\ndisplay:block;\n\n}\n\n\/* =========================================\nHEADLINE\n========================================= *\/\n\n.ak-hero-content h1{\n\nfont-size:\nclamp(58px,6vw,82px);\n\nfont-weight:600;\n\nline-height:1.12;\n\nletter-spacing:-1.6px;\n\nmax-width:980px;\n\ncolor:#fff;\n\n}\n\n.ak-hero-content h1 span{\n\ndisplay:block;\n\n}\n\n\/* =========================================\nDESCRIPTION\n========================================= *\/\n\n.ak-hero-content p{\n\nmargin-top:32px;\n\nmax-width:720px;\n\nfont-size:18px;\n\nfont-weight:400;\n\nline-height:1.9;\n\nletter-spacing:.1px;\n\ncolor:\nrgba(255,255,255,.92);\n\n}\n\n\/* =========================================\nCTA\n========================================= *\/\n\n.ak-hero-actions{\n\nmargin-top:44px;\n\n}\n\n.ak-hero-button{\n\ndisplay:inline-flex;\n\nalign-items:center;\n\njustify-content:center;\n\npadding:\n20px 46px;\n\nborder-radius:999px;\n\nbackground:\nlinear-gradient(\n135deg,\n#237EE9,\n#1565D8\n);\n\ncolor:#fff;\n\nfont-size:15px;\n\nfont-weight:600;\n\ntext-decoration:none;\n\ntransition:\ntransform .3s ease,\nbox-shadow .3s ease;\n\n}\n\n.ak-hero-button:hover{\n\ntransform:\ntranslateY(-2px);\n\nbox-shadow:\n0 20px 40px\nrgba(35,126,233,.25);\n\n}\n\n\/* =========================================\nELEMENTOR FIX\n========================================= *\/\n\n.elementor-widget-container,\n.elementor-html{\n\nmargin:0!important;\npadding:0!important;\n\n}\n\n.ak-section-hero{\n\nmargin:0!important;\npadding:0!important;\n\n}\n\n\/* =========================================\nULTRA WIDE\n========================================= *\/\n\n@media(min-width:1600px){\n\n.ak-navbar-container{\n\npadding:0 110px;\n\n}\n\n}\n\n\/* =========================================\nANGKUTKU V18 FINAL\nCSS B.2\nTABLET\n========================================= *\/\n\n@media (max-width:1199px){\n\n\/* =========================================\nNAVBAR\n========================================= *\/\n\n.ak-navbar{\n\nheight:92px;\n\n}\n\n.ak-navbar-container{\n\nheight:92px;\n\npadding:0 36px;\n\ndisplay:flex;\n\nalign-items:center;\n\njustify-content:space-between;\n\n}\n\n\/* =========================================\nDESKTOP HIDDEN\n========================================= *\/\n\n.ak-nav-menu,\n.ak-language{\n\ndisplay:none;\n\n}\n\n\/* =========================================\nLOGO\n========================================= *\/\n\n.ak-logo img{\n\nheight:64px;\n\n}\n\n\/* =========================================\nHAMBURGER\n========================================= *\/\n\n.ak-menu-toggle{\n\ndisplay:flex;\n\nalign-items:center;\n\njustify-content:center;\n\nposition:relative;\n\nwidth:56px;\nheight:56px;\n\nbackground:#fff;\n\nborder:none;\n\nborder-radius:14px;\n\ncursor:pointer;\n\nbox-shadow:\n0 10px 25px rgba(15,23,42,.08);\n\ntransition:\nall .35s cubic-bezier(.4,0,.2,1);\n\n}\n\n\/* =========================================\nHAMBURGER LINES\n========================================= *\/\n\n.ak-menu-toggle span{\n\nposition:absolute;\n\nleft:50%;\n\nwidth:24px;\nheight:2px;\n\nbackground:#0F172A;\n\nborder-radius:999px;\n\ntransition:\nall .35s cubic-bezier(.4,0,.2,1);\n\n}\n\n.ak-menu-toggle span:nth-child(1){\n\ntransform:\ntranslate(-50%,-8px);\n\n}\n\n.ak-menu-toggle span:nth-child(2){\n\ntransform:\ntranslate(-50%,0);\n\n}\n\n.ak-menu-toggle span:nth-child(3){\n\ntransform:\ntranslate(-50%,8px);\n\n}\n\n\/* =========================================\nACTIVE\n========================================= *\/\n\n.ak-menu-toggle.active{\n\nbackground:#237EE9;\n\n}\n\n.ak-menu-toggle.active span{\n\nbackground:#fff;\n\n}\n\n.ak-menu-toggle.active span:nth-child(1){\n\ntransform:\ntranslate(-50%,0)\nrotate(225deg);\n\n}\n\n.ak-menu-toggle.active span:nth-child(2){\n\nopacity:0;\n\n}\n\n.ak-menu-toggle.active span:nth-child(3){\n\ntransform:\ntranslate(-50%,0)\nrotate(-225deg);\n\n}\n\n\/* =========================================\nDROPDOWN MENU\nJNE STYLE\n========================================= *\/\n\n.ak-mobile-dropdown{\n\ndisplay:block;\n\nposition:fixed;\n\ntop:92px;\n\nleft:0;\nright:0;\n\nwidth:100%;\n\nbackground:#fff;\n\nz-index:9998;\n\nopacity:0;\n\nvisibility:hidden;\n\ntransform:\ntranslateY(-25px);\n\ntransition:\nall .35s cubic-bezier(.4,0,.2,1);\n\nborder-top:\n1px solid rgba(15,23,42,.05);\n\nbox-shadow:\n0 20px 50px rgba(15,23,42,.08);\n\nmax-height:\ncalc(100vh - 92px);\n\noverflow-y:auto;\n\n}\n\n\/* =========================================\nACTIVE\n========================================= *\/\n\n.ak-mobile-dropdown.active{\n\nopacity:1;\n\nvisibility:visible;\n\ntransform:\ntranslateY(0);\n\n}\n\n\/* =========================================\nINNER\n========================================= *\/\n\n.ak-mobile-dropdown-inner{\n\npadding:12px 0;\n\n}\n\n\/* =========================================\nMENU\n========================================= *\/\n\n.ak-mobile-menu{\n\npadding:0 36px;\n\n}\n\n\/* =========================================\nMENU ITEM\n========================================= *\/\n\n.ak-mobile-menu a{\n\ndisplay:flex;\n\nalign-items:center;\n\nmin-height:58px;\n\npadding:14px 0;\n\nfont-size:18px;\n\nfont-weight:500;\n\ntext-decoration:none;\n\ncolor:#111827;\n\nborder-bottom:\n1px solid rgba(15,23,42,.05);\n\nborder-left:\n3px solid transparent;\n\ntransition:\nall .25s ease;\n\n}\n\n\/* =========================================\nACTIVE + HOVER\n========================================= *\/\n\n.ak-mobile-menu a:hover,\n.ak-mobile-menu a:focus,\n.ak-mobile-menu a.ak-active{\n\ncolor:#237EE9;\n\nborder-left:\n3px solid #237EE9;\n\npadding-left:16px;\n\n}\n\n\/* =========================================\nLANGUAGE\n========================================= *\/\n\n.ak-mobile-language{\n\npadding:24px 36px;\n\nmargin-top:8px;\n\nbackground:#FAFBFC;\n\nborder-top:\n1px solid rgba(15,23,42,.05);\n\n}\n\n\/* =========================================\nLANGUAGE TITLE\n========================================= *\/\n\n.ak-mobile-language-title{\n\nfont-size:12px;\n\nfont-weight:600;\n\nletter-spacing:1px;\n\ntext-transform:uppercase;\n\ncolor:#64748B;\n\nmargin-bottom:16px;\n\n}\n\n\/* =========================================\nTRANSLATEPRESS\n========================================= *\/\n\n.ak-mobile-language\n.trp-language-switcher{\n\nwidth:100%!important;\n\n}\n\n.ak-mobile-language\n.trp-language-switcher > div{\n\nborder-radius:12px!important;\n\n}\n\n\/* =========================================\nHERO\n========================================= *\/\n\n.ak-hero-content{\n\npadding:\n60px 36px;\n\n}\n\n\/* =========================================\nLOGO HERO\n========================================= *\/\n\n.ak-hero-logo{\n\nmargin-bottom:30px;\n\n}\n\n.ak-hero-logo img{\n\nheight:100px;\n\n}\n\n\/* =========================================\nHEADLINE\n========================================= *\/\n\n.ak-hero-content h1{\n\nfont-size:\nclamp(46px,7vw,62px);\n\nline-height:1.15;\n\nletter-spacing:-1.1px;\n\n}\n\n\/* =========================================\nDESCRIPTION\n========================================= *\/\n\n.ak-hero-content p{\n\nfont-size:17px;\n\nline-height:1.85;\n\nmax-width:620px;\n\n}\n\n\/* =========================================\nCTA\n========================================= *\/\n\n.ak-hero-actions{\n\nmargin-top:38px;\n\n}\n\n.ak-hero-button{\n\npadding:\n18px 38px;\n\n}\n\n}\n\n\/* =========================================\nANGKUTKU V18 FINAL\nCSS B.3\nMOBILE\n========================================= *\/\n\n@media (max-width:767px){\n\n\/* =========================================\nNAVBAR\n========================================= *\/\n\n.ak-navbar{\n\nheight:86px;\n\n}\n\n.ak-navbar-container{\n\nheight:86px;\n\npadding:0 22px;\n\n}\n\n\/* =========================================\nLOGO\n========================================= *\/\n\n.ak-logo img{\n\nheight:58px;\n\n}\n\n\/* =========================================\nHAMBURGER\n========================================= *\/\n\n.ak-menu-toggle{\n\nwidth:52px;\nheight:52px;\n\nborder-radius:12px;\n\n}\n\n.ak-menu-toggle span{\n\nwidth:22px;\n\n}\n\n\/* =========================================\nMOBILE DROPDOWN\n========================================= *\/\n\n.ak-mobile-dropdown{\n\ntop:86px;\n\nmax-height:\ncalc(100vh - 86px);\n\n}\n\n\/* =========================================\nMENU\n========================================= *\/\n\n.ak-mobile-menu{\n\npadding:0 22px;\n\n}\n\n\/* =========================================\nMENU ITEM\n========================================= *\/\n\n.ak-mobile-menu a{\n\ndisplay:flex;\n\nalign-items:center;\n\nmin-height:56px;\n\nfont-size:17px;\n\nfont-weight:500;\n\npadding:14px 0;\n\ncolor:#111827;\n\nborder-left:\n3px solid transparent;\n\ntransition:\nall .25s ease;\n\n}\n\n\/* =========================================\nACTIVE STATE\n========================================= *\/\n\n.ak-mobile-menu a:hover,\n.ak-mobile-menu a:focus,\n.ak-mobile-menu a:active,\n.ak-mobile-menu a.ak-active{\n\ncolor:#237EE9;\n\nborder-left:\n3px solid #237EE9;\n\npadding-left:14px;\n\nbackground:\nrgba(35,126,233,.03);\n\n}\n\n\/* =========================================\nLANGUAGE\n========================================= *\/\n\n.ak-mobile-language{\n\npadding:22px;\n\n}\n\n.ak-mobile-language-title{\n\nfont-size:11px;\n\nmargin-bottom:14px;\n\n}\n\n\/* =========================================\nHERO\n========================================= *\/\n\n.ak-hero{\n\nheight:100svh;\n\nmin-height:100svh;\n\n}\n\n\/* =========================================\nCONTENT\n========================================= *\/\n\n.ak-hero-content{\n\npadding:\n40px 24px;\n\njustify-content:center;\n\n}\n\n\/* =========================================\nHERO LOGO\n========================================= *\/\n\n.ak-hero-logo{\n\nmargin-bottom:26px;\n\n}\n\n.ak-hero-logo img{\n\nheight:84px;\n\n}\n\n\/* =========================================\nHEADLINE\n========================================= *\/\n\n.ak-hero-content h1{\n\nfont-size:44px;\n\nfont-weight:600;\n\nline-height:1.15;\n\nletter-spacing:-1px;\n\nmax-width:100%;\n\n}\n\n\/* =========================================\nDESCRIPTION\n========================================= *\/\n\n.ak-hero-content p{\n\nmargin-top:24px;\n\nfont-size:16px;\n\nline-height:1.8;\n\nmax-width:100%;\n\n}\n\n\/* =========================================\nCTA\n========================================= *\/\n\n.ak-hero-actions{\n\nmargin-top:34px;\n\nwidth:100%;\n\ndisplay:flex;\n\njustify-content:center;\n\n}\n\n.ak-hero-button{\n\nwidth:100%;\n\nmax-width:360px;\n\nheight:58px;\n\npadding:0 24px;\n\nfont-size:15px;\n\n}\n\n\/* =========================================\nTOUCH AREA\n========================================= *\/\n\n.ak-mobile-menu a{\n\n-webkit-tap-highlight-color:\ntransparent;\n\n}\n\n}\n\n\/* =========================================\nSMALL MOBILE\niPhone SE\nAndroid Kecil\n========================================= *\/\n\n@media (max-width:480px){\n\n.ak-navbar-container{\n\npadding:0 18px;\n\n}\n\n\/* =========================================\nLOGO\n========================================= *\/\n\n.ak-logo img{\n\nheight:52px;\n\n}\n\n\/* =========================================\nBUTTON\n========================================= *\/\n\n.ak-menu-toggle{\n\nwidth:48px;\nheight:48px;\n\n}\n\n\/* =========================================\nHERO\n========================================= *\/\n\n.ak-hero-content{\n\npadding:\n30px 20px;\n\n}\n\n\/* =========================================\nLOGO HERO\n========================================= *\/\n\n.ak-hero-logo img{\n\nheight:72px;\n\n}\n\n\/* =========================================\nHEADLINE\n========================================= *\/\n\n.ak-hero-content h1{\n\nfont-size:38px;\n\nline-height:1.15;\n\n}\n\n\/* =========================================\nDESCRIPTION\n========================================= *\/\n\n.ak-hero-content p{\n\nfont-size:15px;\n\nline-height:1.75;\n\n}\n\n\/* =========================================\nCTA\n========================================= *\/\n\n.ak-hero-button{\n\nmax-width:100%;\n\nheight:56px;\n\n}\n\n}\n\n\/* =========================================\nLANDSCAPE MOBILE\n========================================= *\/\n\n@media (max-height:500px)\nand (orientation:landscape){\n\n.ak-hero{\n\nheight:auto;\n\nmin-height:650px;\n\n}\n\n.ak-hero-content{\n\npadding:\n120px 24px 60px;\n\n}\n\n.ak-hero-logo img{\n\nheight:60px;\n\n}\n\n.ak-hero-content h1{\n\nfont-size:34px;\n\n}\n\n.ak-hero-content p{\n\nfont-size:14px;\n\nmargin-top:16px;\n\n}\n\n.ak-hero-actions{\n\nmargin-top:24px;\n\n}\n\n}\n<\/style>\n\n<script data-wp-block-html=\"js\">\n\/* =========================================\nANGKUTKU V18 FINAL\nJS\n========================================= *\/\n\ndocument.addEventListener('DOMContentLoaded', () => {\n\n    \/* =========================================\n    ELEMENTS\n    ========================================= *\/\n\n    const navbar =\n        document.getElementById('navbar');\n\n    const menuToggle =\n        document.getElementById('menuToggle');\n\n    const mobileDropdown =\n        document.getElementById('mobileDropdown');\n\n    const mobileLinks =\n        document.querySelectorAll(\n            '.ak-mobile-menu a'\n        );\n\n    \/* =========================================\n    NAVBAR SCROLL\n    ========================================= *\/\n\n    const handleNavbar = () => {\n\n        const scrollY =\n            window.scrollY;\n\n        if (scrollY > 40) {\n\n            navbar.style.top = '0';\n\n            navbar.classList.add(\n                'scrolled'\n            );\n\n        } else {\n\n            navbar.style.top = '-140px';\n\n            navbar.classList.remove(\n                'scrolled'\n            );\n\n            closeMenu();\n\n        }\n\n    };\n\n    \/* =========================================\n    OPEN MENU\n    ========================================= *\/\n\n    function openMenu() {\n\n        if (\n            !menuToggle ||\n            !mobileDropdown\n        ) return;\n\n        menuToggle.classList.add(\n            'active'\n        );\n\n        mobileDropdown.classList.add(\n            'active'\n        );\n\n    }\n\n    \/* =========================================\n    CLOSE MENU\n    ========================================= *\/\n\n    function closeMenu() {\n\n        if (\n            !menuToggle ||\n            !mobileDropdown\n        ) return;\n\n        menuToggle.classList.remove(\n            'active'\n        );\n\n        mobileDropdown.classList.remove(\n            'active'\n        );\n\n    }\n\n    \/* =========================================\n    TOGGLE MENU\n    ========================================= *\/\n\n    function toggleMenu() {\n\n        if (\n            mobileDropdown.classList.contains(\n                'active'\n            )\n        ) {\n\n            closeMenu();\n\n        } else {\n\n            openMenu();\n\n        }\n\n    }\n\n    \/* =========================================\n    MENU BUTTON\n    ========================================= *\/\n\n    if (menuToggle) {\n\n        menuToggle.addEventListener(\n            'click',\n            toggleMenu\n        );\n\n    }\n\n    \/* =========================================\n    ACTIVE MENU STATE\n    ========================================= *\/\n\n    mobileLinks.forEach(link => {\n\n        link.addEventListener(\n            'click',\n            function(){\n\n                mobileLinks.forEach(item => {\n\n                    item.classList.remove(\n                        'ak-active'\n                    );\n\n                });\n\n                this.classList.add(\n                    'ak-active'\n                );\n\n                closeMenu();\n\n            }\n        );\n\n    });\n\n    \/* =========================================\n    ESC KEY\n    ========================================= *\/\n\n    document.addEventListener(\n        'keydown',\n        (e) => {\n\n            if (\n                e.key === 'Escape'\n            ) {\n\n                closeMenu();\n\n            }\n\n        }\n    );\n\n    \/* =========================================\n    CLICK OUTSIDE\n    ========================================= *\/\n\n    document.addEventListener(\n        'click',\n        (e) => {\n\n            if (\n                !mobileDropdown ||\n                !menuToggle\n            ) return;\n\n            const insideMenu =\n                mobileDropdown.contains(\n                    e.target\n                );\n\n            const insideButton =\n                menuToggle.contains(\n                    e.target\n                );\n\n            if (\n                !insideMenu &&\n                !insideButton\n            ) {\n\n                closeMenu();\n\n            }\n\n        }\n    );\n\n    \/* =========================================\n    RESET DESKTOP\n    ========================================= *\/\n\n    window.addEventListener(\n        'resize',\n        () => {\n\n            if (\n                window.innerWidth > 1199\n            ) {\n\n                closeMenu();\n\n            }\n\n        }\n    );\n\n    \/* =========================================\n    HERO BUTTON EFFECT\n    ========================================= *\/\n\n    const heroButton =\n        document.querySelector(\n            '.ak-hero-button'\n        );\n\n    if (heroButton) {\n\n        heroButton.addEventListener(\n            'mouseenter',\n            () => {\n\n                heroButton.style.transform =\n                    'translateY(-2px)';\n\n            }\n        );\n\n        heroButton.addEventListener(\n            'mouseleave',\n            () => {\n\n                heroButton.style.transform =\n                    '';\n\n            }\n        );\n\n    }\n\n    \/* =========================================\n    INITIAL LOAD\n    ========================================= *\/\n\n    handleNavbar();\n\n    window.addEventListener(\n        'scroll',\n        handleNavbar,\n        { passive:true }\n    );\n\n});\n<\/script>\n\n<!-- ========================================= -->\n<!-- ANGKUTKU V18 FINAL -->\n<!-- HTML -->\n<!-- ========================================= -->\n\n<section class=\"ak-section-hero\">\n\n    <!-- ========================================= -->\n    <!-- NAVBAR -->\n    <!-- ========================================= -->\n\n    <header class=\"ak-navbar\" id=\"navbar\">\n\n        <div class=\"ak-navbar-container\">\n\n            <!-- LOGO -->\n\n            <a href=\"\/\" class=\"ak-logo\">\n\n                <img decoding=\"async\"\n                src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/Desain-tanpa-judul-23.png\"\n                alt=\"ANGKUTKU\">\n\n            <\/a>\n\n            <!-- DESKTOP MENU -->\n\n            <nav class=\"ak-nav-menu\">\n\n                <a href=\"#tentang-kami\">\n                    Tentang Kami\n                <\/a>\n\n                <a href=\"#layanan\">\n                    Layanan\n                <\/a>\n\n                <a href=\"#area-layanan\">\n                    Area Layanan\n                <\/a>\n\n                <a href=\"#testimoni\">\n                    Testimoni\n                <\/a>\n\n                <a href=\"#faq\">\n                    FAQ\n                <\/a>\n\n            <\/nav>\n\n            <!-- LANGUAGE -->\n\n            <div class=\"ak-language\">\n\n                <div class=\"trp-shortcode-switcher__wrapper\"\r\n     style=\"--bg:#FFFFFFB2;--bg-hover:#FFFFFFB2;--text:#000000;--text-hover:#000000;--border:1px solid transparent;--border-width:1px;--border-color:transparent;--border-radius:5px;--flag-radius:2px;--flag-size:18px;--aspect-ratio:4\/3;--font-size:14px;--transition-duration:0.2s\"\r\n     role=\"group\"\r\n     data-open-mode=\"hover\">\r\n\r\n    \r\n        <!-- ANCHOR (in-flow only; sizing\/borders; inert) -->\r\n        <div class=\"trp-language-switcher trp-ls-dropdown trp-shortcode-switcher trp-shortcode-anchor trp-open-on-hover\"\r\n             aria-hidden=\"true\"\r\n             inert\r\n             data-no-translation>\r\n                <div class=\"trp-current-language-item__wrapper\">\r\n        <a class=\"trp-language-item trp-language-item__default trp-language-item__current\" data-no-translation href=\"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/pages\/345#TRPLINKPROCESSED\" title=\"English\"><img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/plugins\/translatepress-multilingual\/assets\/flags\/4x3\/en_US.svg\" class=\"trp-flag-image\" alt=\"\" role=\"presentation\" loading=\"lazy\" \/><span class=\"trp-language-item-name\">English<\/span><\/a>                    <svg class=\"trp-shortcode-arrow\" width=\"20\" height=\"20\" viewBox=\"0 0 20 21\" fill=\"none\" aria-hidden=\"true\" focusable=\"false\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n                <path d=\"M5 8L10 13L15 8\" stroke=\"var(--text)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n            <\/svg>\r\n            <\/div>\r\n            <\/div>\r\n\r\n        <!-- OVERLAY (positioned; interactive surface) -->\r\n        <div class=\"trp-language-switcher trp-ls-dropdown trp-shortcode-switcher trp-shortcode-overlay trp-open-on-hover\"\r\n             role=\"navigation\"\r\n             aria-label=\"Website language selector\"\r\n             data-no-translation\r\n        >\r\n                <div class=\"trp-current-language-item__wrapper\">\r\n        <div class=\"trp-language-item trp-language-item__default trp-language-item__current\" data-no-translation role=\"button\" aria-expanded=\"false\" tabindex=\"0\" aria-label=\"Change language\" aria-controls=\"trp-shortcode-dropdown-6a6701333c95c\"><img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/plugins\/translatepress-multilingual\/assets\/flags\/4x3\/en_US.svg\" class=\"trp-flag-image\" alt=\"\" role=\"presentation\" loading=\"lazy\" \/><span class=\"trp-language-item-name\">English<\/span><\/div>                    <svg class=\"trp-shortcode-arrow\" width=\"20\" height=\"20\" viewBox=\"0 0 20 21\" fill=\"none\" aria-hidden=\"true\" focusable=\"false\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n                <path d=\"M5 8L10 13L15 8\" stroke=\"var(--text)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n            <\/svg>\r\n            <\/div>\r\n    \r\n            <div class=\"trp-switcher-dropdown-list\"\r\n                 id=\"trp-shortcode-dropdown-6a6701333c95c\"\r\n                 role=\"group\"\r\n                 aria-label=\"Available languages\"\r\n                 hidden\r\n                 inert\r\n            >\r\n                                                            <a class=\"trp-language-item\" href=\"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/pages\/345#TRPLINKPROCESSED\" title=\"Bahasa Indonesia\">\r\n                            <img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/plugins\/translatepress-multilingual\/assets\/flags\/4x3\/id_ID.svg\" class=\"trp-flag-image\" alt=\"\" role=\"presentation\" loading=\"lazy\" \/>                                                            <span class=\"trp-language-item-name\" data-no-translation>Bahasa Indonesia<\/span>\r\n                                                                                <\/a>\r\n                                                <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n\n\n            <\/div>\n\n            <!-- MOBILE TOGGLE -->\n\n            <button\n            class=\"ak-menu-toggle\"\n            id=\"menuToggle\"\n            aria-label=\"Menu\">\n\n                <span><\/span>\n                <span><\/span>\n                <span><\/span>\n\n            <\/button>\n\n        <\/div>\n\n    <\/header>\n\n    <!-- ========================================= -->\n    <!-- MOBILE DROPDOWN -->\n    <!-- ========================================= -->\n\n    <div\n    class=\"ak-mobile-dropdown\"\n    id=\"mobileDropdown\">\n\n        <div class=\"ak-mobile-dropdown-inner\">\n\n            <!-- MOBILE MENU -->\n\n            <nav class=\"ak-mobile-menu\">\n\n                <a href=\"#tentang-kami\">\n                    Tentang Kami\n                <\/a>\n\n                <a href=\"#layanan\">\n                    Layanan\n                <\/a>\n\n                <a href=\"#area-layanan\">\n                    Area Layanan\n                <\/a>\n\n                <a href=\"#testimoni\">\n                    Testimoni\n                <\/a>\n\n                <a href=\"#faq\">\n                    FAQ\n                <\/a>\n\n            <\/nav>\n\n            <!-- MOBILE LANGUAGE -->\n\n            <div class=\"ak-mobile-language\">\n\n                <div class=\"ak-mobile-language-title\">\n\n                    Pilih Bahasa\n\n                <\/div>\n\n                <div class=\"trp-shortcode-switcher__wrapper\"\r\n     style=\"--bg:#FFFFFFB2;--bg-hover:#FFFFFFB2;--text:#000000;--text-hover:#000000;--border:1px solid transparent;--border-width:1px;--border-color:transparent;--border-radius:5px;--flag-radius:2px;--flag-size:18px;--aspect-ratio:4\/3;--font-size:14px;--transition-duration:0.2s\"\r\n     role=\"group\"\r\n     data-open-mode=\"hover\">\r\n\r\n    \r\n        <!-- ANCHOR (in-flow only; sizing\/borders; inert) -->\r\n        <div class=\"trp-language-switcher trp-ls-dropdown trp-shortcode-switcher trp-shortcode-anchor trp-open-on-hover\"\r\n             aria-hidden=\"true\"\r\n             inert\r\n             data-no-translation>\r\n                <div class=\"trp-current-language-item__wrapper\">\r\n        <a class=\"trp-language-item trp-language-item__default trp-language-item__current\" data-no-translation href=\"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/pages\/345#TRPLINKPROCESSED\" title=\"English\"><img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/plugins\/translatepress-multilingual\/assets\/flags\/4x3\/en_US.svg\" class=\"trp-flag-image\" alt=\"\" role=\"presentation\" loading=\"lazy\" \/><span class=\"trp-language-item-name\">English<\/span><\/a>                    <svg class=\"trp-shortcode-arrow\" width=\"20\" height=\"20\" viewBox=\"0 0 20 21\" fill=\"none\" aria-hidden=\"true\" focusable=\"false\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n                <path d=\"M5 8L10 13L15 8\" stroke=\"var(--text)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n            <\/svg>\r\n            <\/div>\r\n            <\/div>\r\n\r\n        <!-- OVERLAY (positioned; interactive surface) -->\r\n        <div class=\"trp-language-switcher trp-ls-dropdown trp-shortcode-switcher trp-shortcode-overlay trp-open-on-hover\"\r\n             role=\"navigation\"\r\n             aria-label=\"Website language selector\"\r\n             data-no-translation\r\n        >\r\n                <div class=\"trp-current-language-item__wrapper\">\r\n        <div class=\"trp-language-item trp-language-item__default trp-language-item__current\" data-no-translation role=\"button\" aria-expanded=\"false\" tabindex=\"0\" aria-label=\"Change language\" aria-controls=\"trp-shortcode-dropdown-6a6701333cbb3\"><img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/plugins\/translatepress-multilingual\/assets\/flags\/4x3\/en_US.svg\" class=\"trp-flag-image\" alt=\"\" role=\"presentation\" loading=\"lazy\" \/><span class=\"trp-language-item-name\">English<\/span><\/div>                    <svg class=\"trp-shortcode-arrow\" width=\"20\" height=\"20\" viewBox=\"0 0 20 21\" fill=\"none\" aria-hidden=\"true\" focusable=\"false\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n                <path d=\"M5 8L10 13L15 8\" stroke=\"var(--text)\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n            <\/svg>\r\n            <\/div>\r\n    \r\n            <div class=\"trp-switcher-dropdown-list\"\r\n                 id=\"trp-shortcode-dropdown-6a6701333cbb3\"\r\n                 role=\"group\"\r\n                 aria-label=\"Available languages\"\r\n                 hidden\r\n                 inert\r\n            >\r\n                                                            <a class=\"trp-language-item\" href=\"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/pages\/345#TRPLINKPROCESSED\" title=\"Bahasa Indonesia\">\r\n                            <img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/plugins\/translatepress-multilingual\/assets\/flags\/4x3\/id_ID.svg\" class=\"trp-flag-image\" alt=\"\" role=\"presentation\" loading=\"lazy\" \/>                                                            <span class=\"trp-language-item-name\" data-no-translation>Bahasa Indonesia<\/span>\r\n                                                                                <\/a>\r\n                                                <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n    <!-- ========================================= -->\n    <!-- HERO -->\n    <!-- ========================================= -->\n\n    <section class=\"ak-hero\">\n\n        <!-- VIDEO -->\n\n        <video\n        class=\"ak-hero-video\"\n        autoplay\n        muted\n        loop\n        playsinline\n        preload=\"metadata\">\n\n            <source\n            src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/download-1.mp4\"\n            type=\"video\/mp4\">\n\n        <\/video>\n\n        <!-- OVERLAY -->\n\n        <div class=\"ak-hero-overlay\"><\/div>\n\n        <!-- CONTENT -->\n\n        <div class=\"ak-hero-content\">\n\n            <!-- HERO LOGO -->\n\n            <div class=\"ak-hero-logo\">\n\n                <img decoding=\"async\"\n                src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/cropped-Desain-tanpa-judul-22-1.png\"\n                alt=\"ANGKUTKU\">\n\n            <\/div>\n\n            <!-- HEADLINE -->\n\n            <h1>\n\n                Jadikan Setiap Langkahmu\n\n                <span>\n                    Lebih Mudah.\n                <\/span>\n\n            <\/h1>\n\n            <!-- DESCRIPTION -->\n\n            <p>\n\n                Solusi untuk angkut,\n                pindahan,\n                packing,\n                cleaning,\n                dan berbagai kebutuhan operasional\n                dalam satu layanan yang lebih mudah.\n\n            <\/p>\n\n            <!-- CTA -->\n\n            <div class=\"ak-hero-actions\">\n\n                <a\n                href=\"https:\/\/wa.me\/6283189900099\"\n                target=\"_blank\"\n                rel=\"noopener\"\n                class=\"ak-hero-button\">\n\n                    Konsultasikan Kebutuhan Anda\n\n                <\/a>\n\n            <\/div>\n\n        <\/div>\n\n    <\/section>\n\n<\/section>\n\n\n\n<!-- =========================================\nPART 2 - TRUST SECTION FINAL\nANGKUTKU\n========================================= -->\n\n<section class=\"ak-trust\" id=\"trust\">\n\n    <div class=\"trust-container\">\n\n        <!-- HEADER -->\n\n        <div class=\"trust-header\">\n\n            <h2>\n                Dipercaya Oleh Ribuan Pelanggan\n            <\/h2>\n\n            <p>\n                Telah membantu ribuan kebutuhan angkut,\n                pindahan, dan operasional bisnis di berbagai\n                kota di Indonesia.\n            <\/p>\n\n        <\/div>\n\n        <!-- STATS -->\n\n        <div class=\"trust-stats\">\n\n            <div class=\"stat-card\">\n\n                <div class=\"stat-icon\">\n                    <i data-lucide=\"users-round\"><\/i>\n                <\/div>\n\n                <div class=\"stat-number\" id=\"customerCount\">\n                    0\n                <\/div>\n\n                <div class=\"stat-label\">\n                    Pelanggan Dilayani\n                <\/div>\n\n            <\/div>\n\n            <div class=\"stat-card\">\n\n                <div class=\"stat-icon\">\n                    <i data-lucide=\"package-check\"><\/i>\n                <\/div>\n\n                <div class=\"stat-number\" id=\"requestCount\">\n                    0\n                <\/div>\n\n                <div class=\"stat-label\">\n                    Kebutuhan Terlayani\n                <\/div>\n\n            <\/div>\n\n            <div class=\"stat-card\">\n\n                <div class=\"stat-icon\">\n                    <i data-lucide=\"building-2\"><\/i>\n                <\/div>\n\n                <div class=\"stat-number\" id=\"companyCount\">\n                    0\n                <\/div>\n\n                <div class=\"stat-label\">\n                    UMKM &amp; Perusahaan\n                <\/div>\n\n            <\/div>\n\n            <div class=\"stat-card\">\n\n                <div class=\"stat-icon\">\n                    <i data-lucide=\"headset\"><\/i>\n                <\/div>\n\n                <div class=\"stat-number\">\n                    24\/7\n                <\/div>\n\n                <div class=\"stat-label\">\n                    Customer Support\n                <\/div>\n\n            <\/div>\n\n        <\/div>\n\n        <!-- GOOGLE REVIEW -->\n\n        <div class=\"google-review\">\n\n            <div class=\"google-rating\">\n\n                <span class=\"rating-score\">\n                    4.9\n                <\/span>\n\n                <span class=\"stars\">\n    &#9733;&#9733;&#9733;&#9733;&#9733;\n<\/span>\n\n            <\/div>\n\n            <h3>\n                Rating Google Terpercaya\n            <\/h3>\n\n            <p>\n                Berdasarkan 112+ ulasan pelanggan\n            <\/p>\n\n            <a href=\"https:\/\/maps.app.goo.gl\/eCi1s5JSbMqBnN886\" target=\"_blank\" class=\"google-btn\">\n\n                Lihat di Google Maps &rarr;\n\n            <\/a>\n\n        <\/div>\n\n        <!-- TRUSTINDEX -->\n\n        <div class=\"trustindex-wrapper\">\n\n            <div data-src=\"https:\/\/cdn.trustindex.io\/loader.js?7db8093735a389256346a9e1336\"><\/div>\n\n        <\/div>\n\n        <!-- CLIENT LOGO -->\n\n        <!-- =========================================\nCLIENT LOGO PREMIUM\n========================================= -->\n\n<div class=\"client-area\">\n\n    <h4>\n        Dipercaya oleh UMKM, Komunitas, dan Berbagai Perusahaan\n    <\/h4>\n\n    <!-- ROW 1 -->\n\n    <div class=\"logo-marquee\">\n\n        <div class=\"logo-track\">\n\n            <img decoding=\"async\" class=\"logo-large\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/Desain-tanpa-judul-27.png\">\n\n            <img decoding=\"async\" class=\"logo-large\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/Desain-tanpa-judul-24.png\">\n\n            <img decoding=\"async\" class=\"logo-large\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/Desain-tanpa-judul-25.png\">\n\n            <img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/Satutim-Color-PNG-1-scaled.png\">\n\n            <!-- DUPLIKAT -->\n\n            <img decoding=\"async\" class=\"logo-large\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/Desain-tanpa-judul-27.png\">\n\n            <img decoding=\"async\" class=\"logo-large\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/Desain-tanpa-judul-24.png\">\n\n            <img decoding=\"async\" class=\"logo-large\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/Desain-tanpa-judul-25.png\">\n\n            <img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/Satutim-Color-PNG-1-scaled.png\">\n\n        <\/div>\n\n    <\/div>\n\n    <!-- ROW 2 -->\n\n    <div class=\"logo-marquee reverse\">\n\n        <div class=\"logo-track\">\n\n            <img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/WhatsApp-Image-2026-06-10-at-11.24.41-e1781187063652.jpeg\">\n\n            <img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/WhatsApp-Image-2026-06-10-at-11.47.33-e1781187087290.jpeg\">\n\n            <img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/WhatsApp-Image-2026-06-10-at-11.54.34.jpeg\">\n\n            <!-- DUPLIKAT -->\n\n            <img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/WhatsApp-Image-2026-06-10-at-11.24.41-e1781187063652.jpeg\">\n\n            <img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/WhatsApp-Image-2026-06-10-at-11.47.33-e1781187087290.jpeg\">\n\n            <img decoding=\"async\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/WhatsApp-Image-2026-06-10-at-11.54.34.jpeg\">\n\n        <\/div>\n\n    <\/div>\n\n<\/div>\n\n<\/div><\/section>\n\n<style>\n\/* =========================================\nCLIENT LOGO PREMIUM V4\n========================================= *\/\n\n.client-area{\n\n    margin-top:120px;\n\n    padding-top:60px;\n\n    border-top:\n    1px solid rgba(15,23,42,.06);\n\n    position:relative;\n}\n\n.client-area h4{\n\n    text-align:center;\n\n    font-size:16px;\n\n    color:#64748B;\n\n    margin-bottom:50px;\n}\n\n\/* MARQUEE *\/\n\n.logo-marquee{\n\n    position:relative;\n\n    overflow:hidden;\n\n    width:100%;\n\n    margin-bottom:28px;\n\n    mask-image:\n    linear-gradient(\n    to right,\n    transparent,\n    black 10%,\n    black 90%,\n    transparent\n    );\n\n    -webkit-mask-image:\n    linear-gradient(\n    to right,\n    transparent,\n    black 10%,\n    black 90%,\n    transparent\n    );\n}\n\n.logo-track{\n\n    display:flex;\n\n    align-items:center;\n\n    gap:90px;\n\n    width:max-content;\n\n    animation:\n    logoScroll 28s linear infinite;\n}\n\n\/* REVERSE *\/\n\n.logo-marquee.reverse .logo-track{\n\n    animation:\n    logoScrollReverse 30s linear infinite;\n}\n\n\/* PAUSE *\/\n\n.logo-marquee:hover .logo-track{\n\n    animation-play-state:paused;\n}\n\n\/* LOGO *\/\n\n.logo-track img{\n\n    height:95px;\n\n    width:auto;\n\n    max-width:280px;\n\n    object-fit:contain;\n\n    transition:\n    all .35s ease;\n\n    filter:\n    grayscale(10%)\n    opacity(.95);\n}\n\n\/* PRIMARY LOGO *\/\n\n.logo-large{\n\n    height:120px !important;\n}\n\n\/* HOVER *\/\n\n.logo-track img:hover{\n\n    transform:\n    translateY(-6px)\n    scale(1.04);\n\n    filter:\n    grayscale(0%)\n    opacity(1);\n\n    filter:\n    drop-shadow(\n    0 12px 30px\n    rgba(35,126,233,.15)\n    );\n}\n\n\/* BLUE GLOW *\/\n\n.logo-marquee::before{\n\n    content:'';\n\n    position:absolute;\n\n    top:50%;\n    left:50%;\n\n    transform:\n    translate(-50%,-50%);\n\n    width:900px;\n    height:180px;\n\n    background:\n    radial-gradient(\n    ellipse,\n    rgba(35,126,233,.05),\n    transparent 70%\n    );\n\n    pointer-events:none;\n}\n\n\/* ANIMATION *\/\n\n@keyframes logoScroll{\n\n    from{\n\n        transform:translateX(0);\n    }\n\n    to{\n\n        transform:translateX(-50%);\n    }\n}\n\n@keyframes logoScrollReverse{\n\n    from{\n\n        transform:translateX(-50%);\n    }\n\n    to{\n\n        transform:translateX(0);\n    }\n}\n\n\/* MOBILE *\/\n\n@media(max-width:768px){\n\n.logo-track{\n\n    gap:60px;\n}\n\n.logo-track img{\n\n    height:70px;\n\n    max-width:180px;\n}\n\n.logo-large{\n\n    height:90px !important;\n}\n\n}\n\/* =========================================\nTRUST SECTION\n========================================= *\/\n\n.ak-trust{\n\n    position:relative;\n\n    overflow:hidden;\n\n    padding:120px 0;\n\n    background:\n    linear-gradient(\n    180deg,\n    #FFFFFF 0%,\n    #F8FAFC 100%\n    );\n}\n\n.ak-trust::before{\n\n    content:'';\n\n    position:absolute;\n\n    top:-250px;\n    right:-250px;\n\n    width:700px;\n    height:700px;\n\n    border-radius:50%;\n\n    background:\n    radial-gradient(\n    circle,\n    rgba(35,126,233,.08),\n    transparent 70%\n    );\n}\n\n.trust-container{\n\n    max-width:1200px;\n\n    margin:auto;\n\n    padding:0 24px;\n\n    position:relative;\n\n    z-index:2;\n}\n\n\/* HEADER *\/\n\n.trust-header{\n\n    max-width:760px;\n\n    margin:auto;\n\n    text-align:center;\n}\n\n.trust-header h2{\n\n    font-size:48px;\n\n    font-weight:800;\n\n    line-height:1.1;\n\n    color:#0F172A;\n}\n\n.trust-header p{\n\n    margin-top:20px;\n\n    font-size:20px;\n\n    line-height:1.8;\n\n    color:#64748B;\n}\n\n\/* STATS *\/\n\n.trust-stats{\n\n    max-width:900px;\n\n    margin:80px auto 0;\n\n    display:grid;\n\n    grid-template-columns:\n    repeat(2,1fr);\n\n    gap:30px;\n}\n\n.stat-card{\n\n    position:relative;\n\n    overflow:hidden;\n\n    background:#FFFFFF;\n\n    padding:42px;\n\n    text-align:center;\n\n    border-radius:30px;\n\n    border:\n    1px solid rgba(35,126,233,.08);\n\n    box-shadow:\n    0 20px 50px rgba(15,23,42,.05);\n\n    transition:.35s ease;\n}\n\n.stat-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    background:\n    linear-gradient(\n    90deg,\n    #237EE9,\n    #005BFF\n    );\n\n    opacity:0;\n\n    transition:.35s;\n}\n\n.stat-card:hover{\n\n    transform:\n    translateY(-10px);\n\n    box-shadow:\n    0 30px 80px rgba(35,126,233,.12);\n}\n\n.stat-card:hover::before{\n\n    opacity:1;\n}\n\n\/* ICON *\/\n\n.stat-icon{\n\n    width:92px;\n    height:92px;\n\n    margin:0 auto 24px;\n\n    display:flex;\n    align-items:center;\n    justify-content:center;\n\n    border-radius:28px;\n\n    position:relative;\n\n    overflow:hidden;\n\n    background:\n    linear-gradient(\n    135deg,\n    #237EE9 0%,\n    #005BFF 100%\n    );\n\n    box-shadow:\n    0 20px 40px rgba(35,126,233,.25);\n}\n\n.stat-icon::before{\n\n    content:'';\n\n    position:absolute;\n\n    top:-30%;\n    left:-30%;\n\n    width:120%;\n    height:120%;\n\n    background:\n    linear-gradient(\n    135deg,\n    rgba(255,255,255,.45),\n    transparent 60%\n    );\n\n    transform:\n    rotate(25deg);\n}\n\n.stat-icon svg{\n\n    width:40px;\n    height:40px;\n\n    stroke:#FFFFFF;\n\n    stroke-width:2.3;\n}\n\n\/* NUMBER *\/\n\n.stat-number{\n\n    font-size:54px;\n\n    font-weight:800;\n\n    line-height:1;\n\n    background:\n    linear-gradient(\n    135deg,\n    #237EE9,\n    #005BFF\n    );\n\n    -webkit-background-clip:text;\n    -webkit-text-fill-color:transparent;\n}\n\n.stat-label{\n\n    margin-top:14px;\n\n    font-size:16px;\n\n    color:#64748B;\n}\n\n\/* GOOGLE *\/\n\n.google-review{\n\n    margin-top:120px;\n\n    text-align:center;\n}\n\n.rating-score{\n\n    font-size:32px;\n\n    font-weight:800;\n\n    color:#237EE9;\n}\n\n.stars{\n\n    color:#FBBF24;\n\n    font-size:24px;\n}\n\n.google-review h3{\n\n    margin-top:18px;\n\n    font-size:32px;\n\n    color:#0F172A;\n}\n\n.google-review p{\n\n    margin-top:12px;\n\n    color:#64748B;\n}\n\n.google-btn{\n\n    display:inline-flex;\n\n    margin-top:24px;\n\n    padding:16px 26px;\n\n    border-radius:16px;\n\n    text-decoration:none;\n\n    font-weight:700;\n\n    color:#237EE9;\n\n    background:\n    rgba(35,126,233,.08);\n}\n\n\/* TRUSTINDEX *\/\n\n.trustindex-wrapper{\n\n    margin-top:60px;\n}\n\n\/* CLIENT *\/\n\n.client-area{\n\n    margin-top:120px;\n\n    padding-top:60px;\n\n    border-top:\n    1px solid rgba(15,23,42,.06);\n}\n\n.client-area h4{\n\n    text-align:center;\n\n    color:#64748B;\n\n    margin-bottom:50px;\n}\n\n\/* MOBILE *\/\n\n@media(max-width:768px){\n\n    .trust-header h2{\n\n        font-size:36px;\n    }\n\n    .trust-header p{\n\n        font-size:18px;\n    }\n\n    .trust-stats{\n\n        grid-template-columns:1fr;\n    }\n\n    .stat-number{\n\n        font-size:42px;\n    }\n\n}\n\n<\/style>\n\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n\n<script>\n\ndocument.addEventListener('DOMContentLoaded',()=>{\n\n    lucide.createIcons();\n\n    const startDate =\n    new Date(\"2026-06-01\");\n\n    const today =\n    new Date();\n\n    const weeks =\n    Math.floor(\n    (today-startDate)\n    \/\n    (1000*60*60*24*7)\n    );\n\n    const customerTarget =\n    859 + (weeks*10);\n\n    const requestTarget =\n    4853 + (weeks*50);\n\n    const companyTarget =\n    78 + weeks;\n\n    function animateCounter(id,target){\n\n        let current=0;\n\n        const element =\n        document.getElementById(id);\n\n        const increment =\n        target\/120;\n\n        const timer =\n        setInterval(()=>{\n\n            current += increment;\n\n            if(current >= target){\n\n                current = target;\n\n                clearInterval(timer);\n            }\n\n            element.innerHTML =\n            Math.floor(current)\n            .toLocaleString('id-ID')\n            + '+';\n\n        },16);\n\n    }\n\n    const observer =\n    new IntersectionObserver(entries=>{\n\n        entries.forEach(entry=>{\n\n            if(entry.isIntersecting){\n\n                animateCounter(\n                'customerCount',\n                customerTarget\n                );\n\n                animateCounter(\n                'requestCount',\n                requestTarget\n                );\n\n                animateCounter(\n                'companyCount',\n                companyTarget\n                );\n\n                observer.disconnect();\n            }\n\n        });\n\n    },{\n        threshold:.4\n    });\n\n    const stats =\n    document.querySelector(\n    '.trust-stats'\n    );\n\n    if(stats){\n\n        observer.observe(stats);\n    }\n\n});\n\n<\/script>\n\n\n<!-- =========================================\nPART 3 - PROBLEM SECTION\nANGKUTKU FINAL\n========================================= -->\n\n<section class=\"ak-problem\">\n\n    <div class=\"ak-problem-container\">\n\n        <!-- HEADER -->\n\n        <div class=\"ak-problem-header\">\n\n            <h2>\n                Masih Menghadapi\n                Kendala Seperti Ini?\n            <\/h2>\n\n            <p>\n                Berbagai tantangan saat pindahan, pengiriman,\n                maupun kebutuhan operasional sering membuat\n                pekerjaan menjadi lebih rumit dari yang seharusnya.\n            <\/p>\n\n        <\/div>\n\n        <!-- SLIDER -->\n\n        <div class=\"ak-problem-slider\">\n\n            <!-- LEFT -->\n\n            <div class=\"ak-problem-content\">\n\n                <div class=\"ak-problem-number\" id=\"problemNumber\">\n\n                    01\n\n                <\/div>\n\n                <div class=\"ak-problem-text\">\n\n                    <h3 id=\"problemTitle\">\n\n                        Barang Terlalu Banyak\n\n                    <\/h3>\n\n                    <p id=\"problemDesc\">\n\n                        Kesulitan memindahkan barang\n                        dalam jumlah besar dan tidak tahu\n                        harus mulai dari mana.\n\n                    <\/p>\n\n                <\/div>\n\n                <!-- PROGRESS -->\n\n                <div class=\"ak-progress\">\n\n                    <div class=\"ak-progress-bar\">\n\n                    <\/div>\n\n                <\/div>\n\n                <!-- DOTS -->\n\n                <div class=\"ak-dots\">\n\n                    <button class=\"active\" data-index=\"0\" aria-label=\"Slide 1\"><\/button>\n\n                    <button data-index=\"1\" aria-label=\"Slide 2\"><\/button>\n\n                    <button data-index=\"2\" aria-label=\"Slide 3\"><\/button>\n\n                    <button data-index=\"3\" aria-label=\"Slide 4\"><\/button>\n\n                    <button data-index=\"4\" aria-label=\"Slide 5\"><\/button>\n\n                    <button data-index=\"5\" aria-label=\"Slide 6\"><\/button>\n\n                <\/div>\n\n            <\/div>\n\n            <!-- RIGHT -->\n\n            <div class=\"ak-problem-image\">\n\n                <img decoding=\"async\" id=\"problemImage\" src=\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-10-2026-11_37_04-PM.png\" alt=\"Barang Terlalu Banyak\" loading=\"lazy\">\n\n            <\/div>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n<style>\n\n\/* =========================================\nPART 3 FINAL - ANGKUTKU\n========================================= *\/\n\n.ak-problem{\n\n    position:relative;\n\n    overflow:hidden;\n\n    padding:140px 0;\n\n    background:\n    radial-gradient(\n    circle at top,\n    rgba(35,126,233,.05),\n    transparent 60%\n    ),\n    #fff;\n}\n\n.ak-problem-container{\n\n    max-width:1480px;\n\n    margin:auto;\n\n    padding:0 40px;\n}\n\n\/* HEADER *\/\n\n.ak-problem-header{\n\n    text-align:center;\n\n    max-width:760px;\n\n    margin:auto auto 100px;\n}\n\n.ak-problem-header h2{\n\n    font-size:56px;\n\n    font-weight:800;\n\n    line-height:1.1;\n\n    color:#0F172A;\n}\n\n.ak-problem-header p{\n\n    margin-top:24px;\n\n    font-size:20px;\n\n    line-height:1.8;\n\n    color:#64748B;\n}\n\n\/* SLIDER *\/\n\n.ak-problem-slider{\n\n    display:grid;\n\n    grid-template-columns:\n    580px\n    1fr;\n\n    gap:90px;\n\n    align-items:center;\n}\n\n\/* NUMBER *\/\n\n.ak-problem-number{\n\n    font-size:200px;\n\n    font-weight:900;\n\n    line-height:1;\n\n    background:\n    linear-gradient(\n    135deg,\n    rgba(35,126,233,.18),\n    rgba(0,91,255,.05)\n    );\n\n    -webkit-background-clip:text;\n    -webkit-text-fill-color:transparent;\n}\n\n\/* TEXT *\/\n\n.ak-problem-text{\n\n    min-height:180px;\n}\n\n.ak-problem-text h3{\n\n    margin-top:-40px;\n\n    font-size:48px;\n\n    font-weight:800;\n\n    line-height:1.15;\n\n    color:#0F172A;\n}\n\n.ak-problem-text p{\n\n    margin-top:24px;\n\n    font-size:20px;\n\n    line-height:1.9;\n\n    color:#64748B;\n\n    max-width:520px;\n}\n\n\/* IMAGE *\/\n\n.ak-problem-image{\n\n    position:relative;\n\n    border-radius:36px;\n\n    overflow:hidden;\n\n    background:#fff;\n\n    box-shadow:\n    0 30px 80px rgba(15,23,42,.10);\n\n    transition:.4s ease;\n}\n\n.ak-problem-image:hover{\n\n    transform:\n    translateY(-4px);\n}\n\n.ak-problem-image img{\n\n    width:100%;\n\n    height:auto;\n\n    display:block;\n\n    object-fit:contain;\n\n    transition:\n    opacity .4s ease;\n}\n\n\/* PROGRESS *\/\n\n.ak-progress{\n\n    width:100%;\n\n    max-width:360px;\n\n    height:5px;\n\n    margin-top:40px;\n\n    background:#E2E8F0;\n\n    border-radius:999px;\n\n    overflow:hidden;\n}\n\n.ak-progress-bar{\n\n    width:0;\n\n    height:100%;\n\n    background:\n    linear-gradient(\n    90deg,\n    #237EE9,\n    #005BFF\n    );\n}\n\n\/* DOTS *\/\n\n.ak-dots{\n\n    display:flex;\n\n    gap:10px;\n\n    margin-top:30px;\n}\n\n.ak-dots button{\n\n    width:10px;\n    height:10px;\n\n    border:none;\n\n    cursor:pointer;\n\n    border-radius:999px;\n\n    background:#CBD5E1;\n\n    transition:.35s ease;\n}\n\n.ak-dots button.active{\n\n    width:40px;\n\n    background:\n    linear-gradient(\n    90deg,\n    #237EE9,\n    #005BFF\n    );\n}\n\n\/* TABLET *\/\n\n@media(min-width:768px) and (max-width:1024px){\n\n    .ak-problem-slider{\n\n        grid-template-columns:\n        55%\n        45%;\n\n        gap:40px;\n    }\n\n    .ak-problem-number{\n\n        font-size:140px;\n    }\n\n    .ak-problem-text h3{\n\n        font-size:34px;\n\n        margin-top:-20px;\n    }\n\n    .ak-problem-text p{\n\n        font-size:17px;\n    }\n\n}\n\n\/* MOBILE *\/\n\n@media(max-width:767px){\n\n    .ak-problem{\n\n        padding:100px 0;\n    }\n\n    .ak-problem-container{\n\n        padding:0 20px;\n    }\n\n    .ak-problem-header{\n\n        margin-bottom:60px;\n    }\n\n    .ak-problem-header h2{\n\n        font-size:38px;\n    }\n\n    .ak-problem-header p{\n\n        font-size:18px;\n    }\n\n    .ak-problem-slider{\n\n        grid-template-columns:1fr;\n\n        gap:40px;\n    }\n\n    .ak-problem-image{\n\n        order:1;\n    }\n\n    .ak-problem-content{\n\n        order:2;\n    }\n\n    .ak-problem-number{\n\n        font-size:90px;\n    }\n\n    .ak-problem-text h3{\n\n        font-size:30px;\n\n        margin-top:-10px;\n    }\n\n    .ak-problem-text p{\n\n        font-size:17px;\n    }\n\n}\n\n<\/style>\n\n<script>\n\ndocument.addEventListener('DOMContentLoaded',()=>{\n\nconst problems=[\n\n{\nnumber:\"01\",\ntitle:\"Barang Terlalu Banyak\",\ndesc:\"Kesulitan memindahkan barang dalam jumlah besar dan tidak tahu harus mulai dari mana.\",\nimage:\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-10-2026-11_37_04-PM.png\"\n},\n\n{\nnumber:\"02\",\ntitle:\"Kendaraan Tidak Cukup\",\ndesc:\"Barang banyak, tetapi kendaraan yang tersedia tidak mampu menampung semuanya.\",\nimage:\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-10-2026-11_38_59-PM.png\"\n},\n\n{\nnumber:\"03\",\ntitle:\"Tidak Ada Tenaga Angkut\",\ndesc:\"Mengangkat barang besar dan berat sendirian tentu bukan pekerjaan yang mudah.\",\nimage:\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-10-2026-11_46_29-PM.png\"\n},\n\n{\nnumber:\"04\",\ntitle:\"Waktu Sangat Terbatas\",\ndesc:\"Di tengah kesibukan, proses pindahan sering kali menjadi pekerjaan yang melelahkan.\",\nimage:\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-10-2026-11_48_01-PM.png\"\n},\n\n{\nnumber:\"05\",\ntitle:\"Lokasi Sulit Dijangkau\",\ndesc:\"Gang sempit, apartemen, atau akses yang terbatas sering menjadi kendala saat angkut barang.\",\nimage:\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-10-2026-11_49_14-PM.png\"\n},\n\n{\nnumber:\"06\",\ntitle:\"Khawatir Barang Rusak\",\ndesc:\"Barang elektronik dan furnitur membutuhkan penanganan yang tepat selama proses pemindahan.\",\nimage:\"https:\/\/angkutku.com\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-10-2026-11_50_09-PM.png\"\n}\n\n];\n\nlet current=0;\nlet interval;\n\nconst number=document.getElementById('problemNumber');\nconst title=document.getElementById('problemTitle');\nconst desc=document.getElementById('problemDesc');\nconst image=document.getElementById('problemImage');\nconst dots=document.querySelectorAll('.ak-dots button');\nconst progress=document.querySelector('.ak-progress-bar');\n\nfunction startProgress(){\n\n    progress.style.transition='none';\n    progress.style.width='0%';\n\n    setTimeout(()=>{\n\n        progress.style.transition='5s linear';\n        progress.style.width='100%';\n\n    },50);\n\n}\n\nfunction showSlide(index){\n\n    current=index;\n\n    const item=problems[index];\n\n    number.textContent=item.number;\n    title.textContent=item.title;\n    desc.textContent=item.desc;\n\n    image.style.opacity='0';\n\n    setTimeout(()=>{\n\n        image.src=item.image;\n        image.alt=item.title;\n\n        image.style.opacity='1';\n\n    },200);\n\n    dots.forEach(dot=>dot.classList.remove('active'));\n    dots[index].classList.add('active');\n\n    startProgress();\n}\n\nfunction nextSlide(){\n\n    current++;\n\n    if(current>=problems.length){\n\n        current=0;\n    }\n\n    showSlide(current);\n}\n\nfunction startSlider(){\n\n    clearInterval(interval);\n\n    interval=setInterval(\n        nextSlide,\n        5000\n    );\n}\n\ndots.forEach((dot,index)=>{\n\n    dot.addEventListener('click',()=>{\n\n        showSlide(index);\n\n        startSlider();\n    });\n\n});\n\nconst slider=\ndocument.querySelector('.ak-problem-slider');\n\nslider.addEventListener('mouseenter',()=>{\n\n    clearInterval(interval);\n\n});\n\nslider.addEventListener('mouseleave',()=>{\n\n    startSlider();\n\n});\n\n\/* Swipe Mobile *\/\n\nlet startX=0;\n\nslider.addEventListener('touchstart',(e)=>{\n\n    startX=e.touches[0].clientX;\n\n});\n\nslider.addEventListener('touchend',(e)=>{\n\n    let endX=\n    e.changedTouches[0].clientX;\n\n    let diff=\n    startX-endX;\n\n    if(diff>50){\n\n        nextSlide();\n\n    }\n\n    if(diff<-50){\n\n        current--;\n\n        if(current<0){\n\n            current=\n            problems.length-1;\n        }\n\n        showSlide(current);\n    }\n\n});\n\nshowSlide(0);\nstartSlider();\n\n});\n\n<\/script>\n\n\n<link rel=\"stylesheet\" href=\"https:\/\/unpkg.com\/lucide-static@latest\/font\/lucide.css\">\n\n<section class=\"ak-solution\">\n\n    <div class=\"ak-solution-container\">\n\n        <!-- HEADER -->\n\n        <div class=\"ak-solution-header\">\n\n            <h2>\n                ANGKUTKU Hadir Untuk Membuat Semuanya Lebih Mudah.\n            <\/h2>\n\n            <p>\n                Dari angkut barang, pindahan, hingga kebutuhan operasional,\n                kami membantu setiap proses berjalan lebih praktis,\n                terorganisir, dan tanpa ribet.\n            <\/p>\n\n        <\/div>\n\n        <!-- CAROUSEL -->\n\n        <div class=\"ak-solution-carousel\">\n\n            <!-- PREV -->\n\n            <button class=\"ak-nav-side ak-nav-left\" id=\"solutionPrev\">\n\n                <svg viewBox=\"0 0 24 24\" fill=\"none\">\n\n                    <path d=\"M15 18L9 12L15 6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><\/path>\n\n                <\/svg>\n\n            <\/button>\n\n            <!-- SLIDER -->\n\n            <div class=\"ak-solution-slider\" id=\"solutionSlider\">\n\n                <div class=\"ak-solution-track\">\n\n                    <!-- CARD 1 -->\n\n                    <div class=\"ak-solution-card\">\n\n                        <div class=\"ak-icon\">\n\n                            <i data-lucide=\"shield-check\"><\/i>\n\n                        <\/div>\n\n                        <h3>\n                            Barang Lebih Aman\n                        <\/h3>\n\n                        <p>\n                            Penanganan lebih rapi untuk membantu\n                            mengurangi risiko kerusakan barang.\n                        <\/p>\n\n                    <\/div>\n\n                    <!-- CARD 2 -->\n\n                    <div class=\"ak-solution-card\">\n\n                        <div class=\"ak-icon\">\n\n                            <i data-lucide=\"truck\"><\/i>\n\n                        <\/div>\n\n                        <h3>\n                            Armada Sesuai Kebutuhan\n                        <\/h3>\n\n                        <p>\n                            Tossa, Pickup, Truck Bak,\n                            CDD Box, Fuso hingga Tronton.\n                        <\/p>\n\n                    <\/div>\n\n                    <!-- CARD 3 -->\n\n                    <div class=\"ak-solution-card\">\n\n                        <div class=\"ak-icon\">\n\n                            <i data-lucide=\"users-round\"><\/i>\n\n                        <\/div>\n\n                        <h3>\n                            Tim Berpengalaman\n                        <\/h3>\n\n                        <p>\n                            Ditangani oleh kru yang terbiasa\n                            menangani berbagai kebutuhan angkut.\n                        <\/p>\n\n                    <\/div>\n\n                    <!-- CARD 4 -->\n\n                    <div class=\"ak-solution-card\">\n\n                        <div class=\"ak-icon\">\n\n                            <i data-lucide=\"map-pinned\"><\/i>\n\n                        <\/div>\n\n                        <h3>\n                            Jangkauan Area Luas\n                        <\/h3>\n\n                        <p>\n                            Surabaya, Malang, Solo,\n                            Jogja, Jabodetabek dan lainnya.\n                        <\/p>\n\n                    <\/div>\n\n                    <!-- CARD 5 -->\n\n                    <div class=\"ak-solution-card\">\n\n                        <div class=\"ak-icon\">\n\n                            <i data-lucide=\"badge-dollar-sign\"><\/i>\n\n                        <\/div>\n\n                        <h3>\n                            Harga Transparan\n                        <\/h3>\n\n                        <p>\n                            Estimasi biaya jelas sejak awal\n                            tanpa biaya tersembunyi.\n                        <\/p>\n\n                    <\/div>\n\n                    <!-- CARD 6 -->\n\n                    <div class=\"ak-solution-card\">\n\n                        <div class=\"ak-icon\">\n\n                            <i data-lucide=\"timer-reset\"><\/i>\n\n                        <\/div>\n\n                        <h3>\n                            Respon Cepat\n                        <\/h3>\n\n                        <p>\n                            Konsultasi dan penjadwalan lebih cepat\n                            sesuai kebutuhan pelanggan.\n                        <\/p>\n\n                    <\/div>\n\n                    <!-- CARD 7 -->\n\n                    <div class=\"ak-solution-card\">\n\n                        <div class=\"ak-icon\">\n\n                            <i data-lucide=\"package-check\"><\/i>\n\n                        <\/div>\n\n                        <h3>\n                            Packing Profesional\n                        <\/h3>\n\n                        <p>\n                            Tim packing berpengalaman membantu\n                            melindungi barang pecah belah,\n                            elektronik, furnitur, dan berbagai\n                            kebutuhan pindahan agar lebih aman\n                            selama proses pengangkutan.\n                        <\/p>\n\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n\n            <!-- NEXT -->\n\n            <button class=\"ak-nav-side ak-nav-right\" id=\"solutionNext\">\n\n                <svg viewBox=\"0 0 24 24\" fill=\"none\">\n\n                    <path d=\"M9 18L15 12L9 6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><\/path>\n\n                <\/svg>\n\n            <\/button>\n\n        <\/div>\n\n    <\/div>\n\n<\/section>\n\n\n<style>\n\n\/* =========================================\nPART 4 FINAL\nANGKUTKU\n========================================= *\/\n\n.ak-solution{\n\n    padding:140px 0;\n\n    background:\n    linear-gradient(\n    180deg,\n    #FFFFFF 0%,\n    #F8FAFC 100%\n    );\n}\n\n.ak-solution-container{\n\n    max-width:1280px;\n\n    margin:auto;\n\n    padding:0 32px;\n}\n\n\/* HEADER *\/\n\n.ak-solution-header{\n\n    text-align:center;\n\n    max-width:760px;\n\n    margin:auto auto 70px;\n}\n\n.ak-solution-header h2{\n\n    font-size:56px;\n\n    font-weight:800;\n\n    line-height:1.1;\n\n    color:#0F172A;\n}\n\n.ak-solution-header p{\n\n    margin-top:24px;\n\n    font-size:20px;\n\n    line-height:1.8;\n\n    color:#64748B;\n}\n\n\/* =========================================\nCAROUSEL\n========================================= *\/\n\n.ak-solution-carousel{\n\n    position:relative;\n}\n\n.ak-solution-slider{\n\n    overflow-x:auto;\n\n    overflow-y:hidden;\n\n    scroll-behavior:smooth;\n\n    scrollbar-width:none;\n\n    -ms-overflow-style:none;\n}\n\n.ak-solution-slider::-webkit-scrollbar{\n\n    display:none;\n}\n\n.ak-solution-track{\n\n    display:flex;\n\n    gap:24px;\n}\n\n\/* =========================================\nNAVIGATION\n========================================= *\/\n\n.ak-nav-side{\n\n    position:absolute;\n\n    top:50%;\n\n    transform:\n    translateY(-50%);\n\n    width:72px;\n    height:72px;\n\n    border:none;\n\n    cursor:pointer;\n\n    z-index:20;\n\n    border-radius:24px;\n\n    background:#FFFFFF;\n\n    border:\n    1px solid rgba(35,126,233,.08);\n\n    display:flex;\n\n    align-items:center;\n    justify-content:center;\n\n    box-shadow:\n    0 15px 40px rgba(15,23,42,.08);\n\n    transition:.35s ease;\n}\n\n.ak-nav-side svg{\n\n    width:26px;\n    height:26px;\n\n    color:#237EE9;\n}\n\n.ak-nav-side:hover{\n\n    transform:\n    translateY(-50%)\n    scale(1.05);\n\n    box-shadow:\n    0 20px 50px rgba(35,126,233,.15);\n\n    background:\n    linear-gradient(\n    135deg,\n    rgba(35,126,233,.06),\n    rgba(0,91,255,.08)\n    );\n}\n\n.ak-nav-left{\n\n    left:-36px;\n}\n\n.ak-nav-right{\n\n    right:-36px;\n}\n\n\/* =========================================\nCARD\n========================================= *\/\n\n.ak-solution-card{\n\n    flex:0 0 calc((100% - 48px) \/ 3);\n\n    min-width:340px;\n\n    position:relative;\n\n    overflow:hidden;\n\n    background:#FFFFFF;\n\n    border-radius:30px;\n\n    padding:42px 34px;\n\n    text-align:center;\n\n    border:\n    1px solid rgba(35,126,233,.08);\n\n    box-shadow:\n    0 20px 50px rgba(15,23,42,.05);\n\n    transition:\n    all .35s ease;\n\n    opacity:0;\n\n    transform:\n    translateY(30px);\n}\n\n.ak-solution-card.show{\n\n    opacity:1;\n\n    transform:\n    translateY(0);\n}\n\n.ak-solution-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    background:\n    linear-gradient(\n    90deg,\n    #237EE9,\n    #005BFF\n    );\n\n    opacity:0;\n\n    transition:.35s;\n}\n\n.ak-solution-card:hover{\n\n    transform:\n    translateY(-10px);\n\n    box-shadow:\n    0 30px 80px rgba(35,126,233,.12);\n}\n\n.ak-solution-card:hover::before{\n\n    opacity:1;\n}\n\n\/* =========================================\nICON\nPART 2 STYLE\n========================================= *\/\n\n.ak-icon{\n\n    width:92px;\n    height:92px;\n\n    margin:0 auto 24px;\n\n    display:flex;\n    align-items:center;\n    justify-content:center;\n\n    position:relative;\n\n    overflow:hidden;\n\n    border-radius:28px;\n\n    background:\n    linear-gradient(\n    135deg,\n    #237EE9 0%,\n    #005BFF 100%\n    );\n\n    box-shadow:\n    0 20px 40px rgba(35,126,233,.25),\n    0 10px 20px rgba(0,91,255,.15);\n}\n\n.ak-icon::before{\n\n    content:'';\n\n    position:absolute;\n\n    top:-30%;\n    left:-30%;\n\n    width:120%;\n    height:120%;\n\n    background:\n    linear-gradient(\n    135deg,\n    rgba(255,255,255,.45),\n    transparent 60%\n    );\n\n    transform:\n    rotate(25deg);\n}\n\n.ak-icon svg{\n\n    width:40px;\n    height:40px;\n\n    stroke:#FFFFFF;\n\n    stroke-width:2.3;\n}\n\n\/* =========================================\nTEXT\n========================================= *\/\n\n.ak-solution-card h3{\n\n    min-height:62px;\n\n    font-size:24px;\n\n    font-weight:700;\n\n    line-height:1.3;\n\n    color:#0F172A;\n}\n\n.ak-solution-card p{\n\n    margin-top:14px;\n\n    max-width:270px;\n\n    margin-left:auto;\n    margin-right:auto;\n\n    font-size:16px;\n\n    line-height:1.9;\n\n    color:#64748B;\n}\n\n\/* =========================================\nTABLET\n========================================= *\/\n\n@media(max-width:1024px){\n\n    .ak-solution-header h2{\n\n        font-size:48px;\n    }\n\n    .ak-nav-left{\n\n        left:-15px;\n    }\n\n    .ak-nav-right{\n\n        right:-15px;\n    }\n\n}\n\n\/* =========================================\nMOBILE\n========================================= *\/\n\n@media(max-width:991px){\n\n    .ak-solution{\n\n        padding:100px 0;\n    }\n\n    .ak-solution-container{\n\n        padding:0 20px;\n    }\n\n    .ak-solution-header{\n\n        margin-bottom:50px;\n    }\n\n    .ak-solution-header h2{\n\n        font-size:38px;\n    }\n\n    .ak-solution-header p{\n\n        font-size:18px;\n    }\n\n    .ak-nav-side{\n\n        display:none;\n    }\n\n    .ak-solution-card{\n\n        flex:0 0 280px;\n\n        min-width:280px;\n    }\n\n    .ak-solution-card h3{\n\n        font-size:20px;\n\n        min-height:auto;\n    }\n\n}\n\n\/* =========================================\nREVEAL ANIMATION\n========================================= *\/\n\n@keyframes solutionFade{\n\n    from{\n\n        opacity:0;\n\n        transform:\n        translateY(30px);\n    }\n\n    to{\n\n        opacity:1;\n\n        transform:\n        translateY(0);\n    }\n\n}\n\n<\/style>\n\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n\n<script>\n\ndocument.addEventListener(\"DOMContentLoaded\",()=>{\n\n    lucide.createIcons();\n\n    const slider=\n    document.getElementById(\n    \"solutionSlider\"\n    );\n\n    const nextBtn=\n    document.getElementById(\n    \"solutionNext\"\n    );\n\n    const prevBtn=\n    document.getElementById(\n    \"solutionPrev\"\n    );\n\n    if(nextBtn){\n\n        nextBtn.addEventListener(\n        \"click\",\n        ()=>{\n\n            slider.scrollBy({\n\n                left:380,\n\n                behavior:\"smooth\"\n\n            });\n\n        });\n    }\n\n    if(prevBtn){\n\n        prevBtn.addEventListener(\n        \"click\",\n        ()=>{\n\n            slider.scrollBy({\n\n                left:-380,\n\n                behavior:\"smooth\"\n\n            });\n\n        });\n    }\n\n    \/* =====================================\n    REVEAL\n    ===================================== *\/\n\n    const cards=\n    document.querySelectorAll(\n    \".ak-solution-card\"\n    );\n\n    const observer=\n    new IntersectionObserver(\n\n        entries=>{\n\n            entries.forEach(entry=>{\n\n                if(entry.isIntersecting){\n\n                    entry.target.classList.add(\n                    \"show\"\n                    );\n                }\n\n            });\n\n        },\n\n        {\n            threshold:.15\n        }\n\n    );\n\n    cards.forEach(card=>{\n\n        observer.observe(card);\n\n    });\n\n});\n\n<\/script>\n\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n<!-- \/wp:post-content -->","protected":false},"excerpt":{"rendered":"<p>Tentang Kami Layanan Area Layanan Testimoni FAQ Tentang Kami Layanan Area Layanan Testimoni FAQ Pilih Bahasa Jadikan Setiap Langkahmu Lebih Mudah. Solusi untuk angkut, pindahan, packing, cleaning, dan berbagai kebutuhan operasional dalam satu layanan yang lebih mudah. Konsultasikan Kebutuhan Anda Dipercaya Oleh Ribuan Pelanggan Telah membantu ribuan kebutuhan angkut, pindahan, dan operasional bisnis di berbagai [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-345","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/pages\/345","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/comments?post=345"}],"version-history":[{"count":3,"href":"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/pages\/345\/revisions"}],"predecessor-version":[{"id":348,"href":"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/pages\/345\/revisions\/348"}],"wp:attachment":[{"href":"https:\/\/angkutku.com\/en\/wp-json\/wp\/v2\/media?parent=345"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}