{"id":25,"date":"2026-06-28T15:17:44","date_gmt":"2026-06-28T15:17:44","guid":{"rendered":"https:\/\/lab.rwb.my.id\/neo\/?page_id=25"},"modified":"2026-06-29T19:20:25","modified_gmt":"2026-06-29T19:20:25","slug":"contact","status":"publish","type":"page","link":"https:\/\/lab.rwb.my.id\/neo\/contact\/","title":{"rendered":"Contact"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"25\" class=\"elementor elementor-25\">\n\t\t\t\t<div class=\"elementor-element elementor-element-14c47c8 e-con-full e-flex e-con e-parent\" data-id=\"14c47c8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d182a6e elementor-widget elementor-widget-html\" data-id=\"d182a6e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- Google Fonts for Neo-Brutalism Vibe -->\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Archivo+Black&family=Space+Grotesk:wght@400;500;700&display=swap\" rel=\"stylesheet\">\n\n<style>\n\n  \/* ==========================================================\n     RWB - NEO BRUTALISM: CONTACT PAGE HERO (FIXED & SMOOTHENED)\n     ========================================================== *\/\n  :root {\n    --rwb-bg: #FFFFFF;\n    --rwb-text: #000000;\n    --rwb-shadow: #000000;\n    --rwb-accent-1: #FF006E;    \/* Pink *\/\n    --rwb-accent-2: #00F5D4;    \/* Cyan *\/\n    --rwb-accent-3: #FFD6A5;    \/* Orange *\/\n    --rwb-font: 'Space Grotesk', sans-serif;\n    --rwb-font-heading: 'Archivo Black', sans-serif;\n  }\n\n  * { box-sizing: border-box; }\n\n  \/* ==========================================\n     FIXED NAVBAR SECTION\n     ========================================== *\/\n  .rwb-nav {\n    position: fixed; top: 0; left: 0; width: 100%; z-index: 999;\n    display: flex; justify-content: space-between; align-items: center;\n    padding: 16px 40px; background-color: var(--rwb-bg);\n    border-bottom: 3px solid var(--rwb-text); box-sizing: border-box;\n    font-family: var(--rwb-font);\n  }\n  .rwb-logo-area { display: flex; align-items: center; gap: 12px; text-decoration: none; }\n  .rwb-logo-img { width: 36px; height: 36px; object-fit: cover; border: 3px solid var(--rwb-text); background-color: var(--rwb-text); }\n  .rwb-logo-text { font-family: var(--rwb-font-heading); font-size: 1.2rem; text-transform: uppercase; letter-spacing: 1px; color: var(--rwb-text); }\n  \n  .rwb-menu { display: flex; gap: 10px; align-items: center; }\n  .rwb-menu-item { \n    display: flex; align-items: center; gap: 8px; text-decoration: none; \n    color: var(--rwb-text); font-weight: 700; font-size: 0.85rem; \n    padding: 8px 14px; border: 3px solid transparent; transition: all 0.2s ease; text-transform: uppercase; \n  }\n  .rwb-menu-item:hover { background-color: var(--rwb-accent-2); border: 3px solid var(--rwb-text); box-shadow: 4px 4px 0px var(--rwb-shadow); transform: translate(-2px, -2px); }\n  \n  \/* PERBAIKAN: STYLE MENU AKTIF (ACTIVE PAGE) *\/\n  .rwb-menu-item.rwb-active-menu {\n    background-color: var(--rwb-accent-2);\n    border: 3px solid var(--rwb-text);\n    box-shadow: 4px 4px 0px var(--rwb-shadow);\n    transform: translate(-2px, -2px);\n  }\n\n  .rwb-menu-item svg {\n    width: 16px;\n    height: 16px;\n    stroke-width: 2.5;\n  }\n\n  .rwb-menu-item:focus-visible, .rwb-btn:focus-visible, .rwb-menu-mobile-btn:focus-visible, .rwb-contact-card:focus-visible, .rwb-toast-close:focus-visible { outline: 3px solid var(--rwb-accent-1); outline-offset: 4px; }\n  .rwb-menu-mobile-btn { display: none; background: var(--rwb-bg); border: 3px solid var(--rwb-text); box-shadow: 4px 4px 0px var(--rwb-shadow); cursor: pointer; padding: 6px; transition: transform 0.1s; }\n  .rwb-menu-mobile-btn:active { transform: translate(4px, 4px); box-shadow: 0 0 0 var(--rwb-shadow); }\n  .rwb-menu-mobile-btn svg { width: 24px; height: 24px; stroke: var(--rwb-text); stroke-width: 3; }\n\n  \/* ============================================================\n     === TOAST NOTIFICATION \u2014 PERBAIKAN TOTAL ===\n     ============================================================ *\/\n  .rwb-toast {\n    position: fixed;\n    top: 90px; \n    left: 50%;\n    transform: translateX(-50%) translateY(-30px);\n    opacity: 0;\n    pointer-events: none;\n    background: var(--rwb-accent-3);\n    color: var(--rwb-text);\n    border: 4px solid var(--rwb-text);\n    box-shadow: 6px 6px 0px var(--rwb-text);\n    padding: 16px 20px;\n    z-index: 1001; \n    display: flex;\n    align-items: center;\n    gap: 20px;\n    max-width: 90%;\n    width: 500px;\n    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), \n                opacity 0.35s ease;\n  }\n  .rwb-toast.active {\n    transform: translateX(-50%) translateY(0); \n    opacity: 1;\n    pointer-events: auto;\n    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), \n                opacity 0.25s ease 0.15s;\n  }\n  .rwb-toast-text {\n    font-family: var(--rwb-font);\n    font-weight: 700;\n    font-size: 0.9rem;\n    line-height: 1.4;\n    flex-grow: 1;\n  }\n  .rwb-toast-close {\n    background: var(--rwb-text) !important;\n    color: var(--rwb-bg) !important;\n    border: 3px solid var(--rwb-text) !important;\n    width: 32px !important; \n    height: 32px !important;\n    display: flex !important; \n    align-items: center !important; \n    justify-content: center !important;\n    cursor: pointer !important;\n    flex-shrink: 0 !important;\n    padding: 0 !important; \/* Mencegah padding bawaan tema merusak posisi *\/\n    position: relative !important;\n    transition: transform 0.1s;\n    box-shadow: none !important;\n  }\n  .rwb-toast-close:active {\n    transform: scale(0.9);\n  }\n  \n  \/* FIX #1: Paksa SVG (tanda X) & path garis agar selalu terlihat warna putih *\/\n  .rwb-toast-close svg { \n    width: 18px !important; \n    height: 18px !important; \n    display: block !important;\n    margin: 0 auto !important;\n    overflow: visible !important;\n  }\n  .rwb-toast-close svg path {\n    stroke: #FFFFFF !important; \n    stroke-width: 3px !important; \n    fill: none !important;\n    stroke-linecap: round !important;\n    stroke-linejoin: round !important;\n    opacity: 1 !important;\n    display: inline !important;\n  }\n\n  \/* === HERO CONTACT SECTION === *\/\n  .rwb-contact-hero {\n    font-family: var(--rwb-font);\n    background-color: var(--rwb-bg);\n    padding: 160px 40px 0 40px;\n    overflow: hidden;\n    position: relative;\n    min-height: 85vh;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n  }\n\n  .rwb-contact-content {\n    max-width: 1200px;\n    margin: 0 auto;\n    width: 100%;\n    text-align: center;\n    position: relative;\n    z-index: 2;\n    padding-bottom: 80px;\n  }\n\n  .rwb-contact-bg-text {\n    font-family: var(--rwb-font-heading);\n    font-size: clamp(4rem, 18vw, 14rem);\n    color: transparent;\n    -webkit-text-stroke: 2px rgba(0,0,0,0.1);\n    text-transform: uppercase;\n    position: absolute;\n    top: -40px;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 0;\n    white-space: nowrap;\n    pointer-events: none;\n  }\n\n  .rwb-contact-badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    background-color: var(--rwb-accent-2);\n    color: var(--rwb-text);\n    font-weight: 700;\n    padding: 6px 14px;\n    border: 3px solid var(--rwb-text);\n    margin-bottom: 24px;\n    font-size: 0.75rem;\n    text-transform: uppercase;\n    letter-spacing: 1px;\n    position: relative;\n    z-index: 2;\n    box-shadow: 4px 4px 0px var(--rwb-shadow);\n  }\n\n  .rwb-contact-title {\n    font-family: var(--rwb-font-heading);\n    font-size: clamp(2.2rem, 6vw, 5rem);\n    line-height: 1;\n    color: var(--rwb-text);\n    text-transform: uppercase;\n    margin: 0 0 20px 0;\n    letter-spacing: -0.02em;\n    position: relative;\n    z-index: 2;\n  }\n\n  .rwb-contact-title span {\n    background-color: var(--rwb-accent-1);\n    color: #FFFFFF;\n    padding: 0 12px;\n    display: inline-block;\n    transform: rotate(-2deg);\n    border: 4px solid var(--rwb-text);\n    box-shadow: 8px 8px 0px var(--rwb-shadow);\n  }\n\n  .rwb-contact-desc {\n    font-size: 1.1rem;\n    font-weight: 500;\n    color: #333333;\n    max-width: 600px;\n    margin: 0 auto 50px auto;\n    line-height: 1.6;\n    position: relative;\n    z-index: 2;\n  }\n\n  .rwb-contact-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n    gap: 30px;\n    position: relative;\n    z-index: 2;\n  }\n\n  .rwb-contact-card {\n    background: var(--rwb-bg);\n    border: 4px solid var(--rwb-text);\n    box-shadow: 8px 8px 0px var(--rwb-text);\n    padding: 30px;\n    text-decoration: none;\n    color: var(--rwb-text);\n    display: flex;\n    align-items: center;\n    gap: 20px;\n    transition: transform 0.2s ease, box-shadow 0.2s ease;\n    cursor: pointer;\n    font-family: var(--rwb-font);\n    text-align: left;\n  }\n\n  .rwb-contact-card:hover {\n    transform: translate(-4px, -4px);\n    box-shadow: 12px 12px 0px var(--rwb-text);\n  }\n\n  .rwb-contact-card:active {\n    transform: translate(2px, 2px);\n    box-shadow: 4px 4px 0px var(--rwb-text);\n  }\n\n  \/* FIX #2: Tambahkan warna dark saat di-hover secara spesifik *\/\n  .rwb-card-email:hover .rwb-card-value,\n  .rwb-card-email:hover .rwb-card-label {\n    color: #000000 !important;\n  }\n\n  button.rwb-contact-card {\n    width: 100%;\n    background: var(--rwb-bg);\n    font-size: 1rem; \n    font-family: var(--rwb-font);\n  }\n\n  .rwb-contact-icon {\n    width: 56px; height: 56px;\n    border: 3px solid var(--rwb-text);\n    display: flex; align-items: center; justify-content: center;\n    flex-shrink: 0;\n  }\n  \n  .rwb-contact-icon svg { width: 28px; height: 28px; }\n  \n  .rwb-card-wa .rwb-contact-icon { background: var(--rwb-accent-2); }\n  .rwb-card-email .rwb-contact-icon { background: var(--rwb-accent-3); }\n\n  .rwb-card-label {\n    font-size: 0.8rem;\n    text-transform: uppercase;\n    font-weight: 700;\n    color: #555;\n    margin-bottom: 4px;\n  }\n\n  .rwb-card-value {\n    font-family: var(--rwb-font-heading);\n    font-size: 1.2rem;\n    text-transform: uppercase;\n    line-height: 1.1;\n    word-break: break-word;\n  }\n\n  \/* MARQUEE TEKS BERJALAN *\/\n  .rwb-marquee {\n    width: 100%;\n    background: var(--rwb-text);\n    color: var(--rwb-bg);\n    border-top: 4px solid var(--rwb-text);\n    border-bottom: 4px solid var(--rwb-text);\n    padding: 12px 0;\n    margin-top: auto;\n    overflow: hidden;\n    white-space: nowrap;\n  }\n\n  .rwb-marquee-track {\n    display: inline-block;\n    animation: rwb-scroll 20s linear infinite;\n    font-family: var(--rwb-font-heading);\n    font-size: 0.9rem;\n    text-transform: uppercase;\n    letter-spacing: 2px;\n  }\n\n  .rwb-marquee-track span { margin: 0 20px; }\n  .rwb-marquee-track span.star { color: var(--rwb-accent-2); }\n\n  @keyframes rwb-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }\n\n  \/* === ANIMASI FADE UP === *\/\n  .rwb-contact-hero.rwb-js-ready .rwb-contact-badge,\n  .rwb-contact-hero.rwb-js-ready .rwb-contact-title,\n  .rwb-contact-hero.rwb-js-ready .rwb-contact-desc,\n  .rwb-contact-hero.rwb-js-ready .rwb-contact-grid {\n    opacity: 0;\n    transform: translateY(40px);\n    transition: opacity 0.8s ease-out, transform 0.8s ease-out;\n    will-change: opacity, transform;\n  }\n  .rwb-contact-hero.rwb-js-ready.is-visible .rwb-contact-badge { transition-delay: 0.1s; opacity: 1; transform: translateY(0); }\n  .rwb-contact-hero.rwb-js-ready.is-visible .rwb-contact-title { transition-delay: 0.3s; opacity: 1; transform: translateY(0); }\n  .rwb-contact-hero.rwb-js-ready.is-visible .rwb-contact-desc { transition-delay: 0.5s; opacity: 1; transform: translateY(0); }\n  .rwb-contact-hero.rwb-js-ready.is-visible .rwb-contact-grid { transition-delay: 0.7s; opacity: 1; transform: translateY(0); }\n\n    \/* RESPONSIVE HP *\/\n  @media (max-width: 768px) {\n    .rwb-nav { padding: 12px 20px; }\n    .rwb-menu {\n      display: none; flex-direction: column; gap: 15px; padding: 20px 30px;\n      background-color: var(--rwb-bg); border-bottom: 4px solid var(--rwb-text);\n      position: absolute; top: 100%; left: 0; width: 100%; z-index: 998;\n    }\n    .rwb-menu.active { display: flex; }\n    .rwb-menu .rwb-menu-item { font-size: 1rem; padding: 12px 0; border-bottom: 2px dashed var(--rwb-text); width: 100%; }\n    .rwb-menu .rwb-menu-item:last-child { border-bottom: none; }\n    \n    \/* === PERBAIKAN: Menu aktif tidak terpotong di bawah === *\/\n    .rwb-menu .rwb-menu-item.rwb-active-menu { \n      transform: none; \n      box-shadow: none; \n      border: 3px solid var(--rwb-text); \n      background-color: var(--rwb-accent-2); \/* Warna cyan tetap muncul *\/\n    }\n    \/* Paksa border bawah agar tidak hilang (khusus menu terakhir yang aktif) *\/\n    .rwb-menu .rwb-menu-item.rwb-active-menu:last-child { \n      border-bottom: 3px solid var(--rwb-text) !important; \n    }\n\n    .rwb-menu-mobile-btn { display: block; }\n\n    .rwb-contact-hero { padding: 120px 20px 0 20px; }\n    .rwb-contact-card { flex-direction: column; text-align: center; }\n    .rwb-card-value { font-size: 1rem; }\n    \n    .rwb-toast { width: 95%; padding: 12px 15px; gap: 10px; top: 80px; }\n    .rwb-toast-text { font-size: 0.8rem; }\n  }\n<\/style>\n\n<!-- HTML STRUCTURE START -->\n\n<div class=\"rwb-contact-page-wrapper\">\n  \n  <!-- TOAST NOTIFICATION -->\n  <div class=\"rwb-toast\" id=\"rwbEmailToast\" role=\"alert\">\n    <span class=\"rwb-toast-text\">\ud83d\udce7 Your email is safe... I'm just pretending I didn't see it. WhatsApp is faster. \ud83e\udd77\ud83e\udd23<\/span>\n    <button class=\"rwb-toast-close\" id=\"rwbToastClose\" aria-label=\"Close Notification\">\n      <svg fill=\"none\" stroke=\"#FFFFFF\" stroke-width=\"3\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n        <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\"><\/path>\n      <\/svg>\n    <\/button>\n  <\/div>\n\n  <!-- NAVBAR -->\n  <nav class=\"rwb-nav\">\n    <a href=\"https:\/\/lab.rwb.my.id\/neo\/\" class=\"rwb-logo-area\">\n      <img decoding=\"async\" src=\"https:\/\/lab.rwb.my.id\/neo\/wp-content\/uploads\/sites\/19\/2026\/06\/Logo-RWB.jpeg\" alt=\"Rudi Dev Logo\" class=\"rwb-logo-img\">\n      <span class=\"rwb-logo-text\">Rudi Dev<\/span>\n    <\/a>\n\n    <div class=\"rwb-menu\" id=\"rwbMobileMenu\">\n      <a href=\"https:\/\/lab.rwb.my.id\/neo\/\" class=\"rwb-menu-item\">\n        <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6\"><\/path><\/svg>\n        Home\n      <\/a>\n      <a href=\"https:\/\/lab.rwb.my.id\/neo\/works\/\" class=\"rwb-menu-item\">\n        <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M20 7l-8-4-8 4m16 0l-8 4m8-4v10l-8 4m0-10L4 7m8 4v10M4 7v10l8 4\"><\/path><\/svg>\n        Works\n      <\/a>\n      <a href=\"https:\/\/lab.rwb.my.id\/neo\/about\/\" class=\"rwb-menu-item\">\n        <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z\"><\/path><\/svg>\n        About\n      <\/a>\n      <a href=\"https:\/\/lab.rwb.my.id\/neo\/contact\/\" class=\"rwb-menu-item\">\n        <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"><\/path><\/svg>\n        Contact\n      <\/a>\n    <\/div>\n\n    <button class=\"rwb-menu-mobile-btn\" id=\"rwbMenuToggle\" aria-label=\"Toggle Menu\" aria-expanded=\"false\">\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h16\"><\/path><\/svg>\n    <\/button>\n  <\/nav>\n\n  <!-- HERO CONTACT -->\n  <section class=\"rwb-contact-hero\">\n    <div class=\"rwb-contact-content\">\n      <h2 class=\"rwb-contact-bg-text\">CONTACT<\/h2>\n      \n      <div class=\"rwb-contact-badge\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"4\"><circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle><\/svg> \n        Open for Projects 2026\n      <\/div>\n\n      <h1 class=\"rwb-contact-title\">LET'S MAKE <br><span>BOLD MOVES<\/span>.<\/h1>\n      <p class=\"rwb-contact-desc\">\n        Got a crazy idea or a project that needs a serious upgrade? Don't hesitate to reach out. I reply fast and I don't do boring templates.\n      <\/p>\n\n      <div class=\"rwb-contact-grid\">\n        \n        <a href=\"https:\/\/wa.me\/6281227008020?text=Hi%20Rudi%2C%20I%20saw%20your%20portfolio%20and%20I%27m%20interested%20in%20hiring%20you%20for%20a%20project.\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"rwb-contact-card rwb-card-wa\">\n          <div class=\"rwb-contact-icon\">\n            <svg fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z\"><\/path><\/svg>\n          <\/div>\n          <div>\n            <div class=\"rwb-card-label\">Chat on WhatsApp<\/div>\n            <div class=\"rwb-card-value\">Faster than my inbox\ud83d\ude06<\/div>\n          <\/div>\n        <\/a>\n\n        <button class=\"rwb-contact-card rwb-card-email\" id=\"rwbEmailCard\" aria-label=\"Show email notification\">\n          <div class=\"rwb-contact-icon\">\n            <svg fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"><\/path><\/svg>\n          <\/div>\n          <div>\n            <div class=\"rwb-card-label\">Send an Email<\/div>\n            <div class=\"rwb-card-value\">Inbox\ud83d\udcec? Maybe later\ud83e\udd23<\/div>\n          <\/div>\n        <\/button>\n\n      <\/div>\n    <\/div>\n\n    <div class=\"rwb-marquee\">\n      <div class=\"rwb-marquee-track\">\n        <span>AVAILABLE 2026<\/span> <span class=\"star\">\u2726<\/span>\n        <span>FAST RESPONSE<\/span> <span class=\"star\">\u2726<\/span>\n        <span>GLOBAL CLIENTS<\/span> <span class=\"star\">\u2726<\/span>\n        <span>BASED IN INDONESIA<\/span> <span class=\"star\">\u2726<\/span>\n        <span>AVAILABLE 2026<\/span> <span class=\"star\">\u2726<\/span>\n        <span>FAST RESPONSE<\/span> <span class=\"star\">\u2726<\/span>\n        <span>GLOBAL CLIENTS<\/span> <span class=\"star\">\u2726<\/span>\n        <span>BASED IN INDONESIA<\/span> <span class=\"star\">\u2726<\/span>\n      <\/div>\n    <\/div>\n  <\/section>\n\n<\/div>\n\n<!-- Vanilla JS for Mobile Menu, Animations & Toast -->\n<script>\n  (function(){\n    const wrapper = document.querySelector('.rwb-contact-hero');\n    \n    try {\n      \/\/ 1. Mobile Menu Toggle\n      const toggleBtn = document.getElementById('rwbMenuToggle');\n      const menu = document.getElementById('rwbMobileMenu');\n      \n      if(toggleBtn && menu) {\n        toggleBtn.addEventListener('click', function(e) {\n          e.stopPropagation();\n          const isActive = menu.classList.toggle('active');\n          toggleBtn.setAttribute('aria-expanded', isActive ? 'true' : 'false');\n        });\n\n        const menuLinks = menu.querySelectorAll('.rwb-menu-item');\n        menuLinks.forEach(link => {\n          link.addEventListener('click', () => {\n            if (menu.classList.contains('active')) {\n              menu.classList.remove('active');\n              toggleBtn.setAttribute('aria-expanded', 'false');\n            }\n          });\n        });\n\n        document.addEventListener('click', (e) => {\n          if (menu.classList.contains('active') && !menu.contains(e.target) && !toggleBtn.contains(e.target)) {\n            menu.classList.remove('active');\n            toggleBtn.setAttribute('aria-expanded', 'false');\n          }\n        });\n      }\n\n      \/\/ 2. Animasi Fade Up\n      if(!wrapper) return;\n      wrapper.classList.add('rwb-js-ready');\n\n      const observer = new IntersectionObserver((entries) => {\n        entries.forEach(entry => {\n          if(entry.isIntersecting) {\n            wrapper.classList.add('is-visible');\n            observer.unobserve(entry.target);\n          }\n        });\n      }, { threshold: 0.1 });\n      observer.observe(wrapper);\n\n      \/\/ ================================================\n      \/\/ 3. LOGIKA TOAST \u2014 PERBAIKAN CLOSE X\n      \/\/ ================================================\n      const emailCard = document.getElementById('rwbEmailCard');\n      const toast = document.getElementById('rwbEmailToast');\n      const toastClose = document.getElementById('rwbToastClose');\n      let toastTimeout = null;\n\n      function showToast() {\n        if(!toast) return;\n        \n        \/\/ Kalau toast lagi aktif, reset dulu tanpa animasi\n        if(toast.classList.contains('active')) {\n          toast.style.transition = 'none';\n          toast.classList.remove('active');\n          \/\/ Force reflow\n          void toast.offsetWidth;\n          toast.style.transition = '';\n        }\n        \n        toast.classList.add('active');\n        \n        if(toastTimeout) clearTimeout(toastTimeout);\n        toastTimeout = setTimeout(hideToast, 7000);\n      }\n\n      function hideToast() {\n        if(!toast) return;\n        if(!toast.classList.contains('active')) return;\n        \n        toast.classList.remove('active');\n        if(toastTimeout) {\n          clearTimeout(toastTimeout);\n          toastTimeout = null;\n        }\n      }\n\n      if(emailCard && toast) {\n        emailCard.addEventListener('click', showToast);\n      }\n\n      if(toastClose) {\n        toastClose.addEventListener('click', function(e) {\n          e.stopPropagation(); \/\/ FIX: cegah event bubble ke Elementor wrapper\n          hideToast();\n        });\n      }\n\n      \/\/ 4. PERBAIKAN: Deteksi Halaman Aktif berdasarkan URL\n      const currentUrl = window.location.href;\n      const menuItems = document.querySelectorAll('.rwb-menu-item');\n      menuItems.forEach(item => {\n        \/\/ Hapus trailing slash (tanda \/ di akhir) agar pencocokan lebih akurat\n        const itemUrl = item.href.replace(\/\\\/$\/, \"\");\n        const currentUrlClean = currentUrl.replace(\/\\\/$\/, \"\");\n        \n        if (itemUrl === currentUrlClean) {\n          item.classList.add('rwb-active-menu');\n        }\n      });\n\n    } catch(e) {\n      console.error(\"RWB Script Error:\", e);\n      if(wrapper) wrapper.classList.remove('rwb-js-ready');\n    }\n  })();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ac92598 e-con-full e-flex e-con e-parent\" data-id=\"ac92598\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1a73cf2 elementor-widget elementor-widget-html\" data-id=\"1a73cf2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n  \/* ==========================================================\n     RWB - NEO BRUTALISM: CYBER ROLET CONTACT v2.2 (CANVAS WHITE)\n     ========================================================== *\/\n  \n  .rwb-rlt-section {\n    --rwb-rlt-bg: #FFFFFF; \/* CANVAS PUTIH BERSIH *\/\n    --rwb-rlt-text: #000000;\n    --rwb-rlt-shadow: #000000;\n    --rwb-rlt-neon-yellow: #FFE600; \/* Kuning Kasino *\/\n    --rwb-rlt-neon-cyan: #00F5D4;   \/* Cyan Laser *\/\n    --rwb-rlt-neon-pink: #FF0055;   \/* Pink Amarah *\/\n    --rwb-rlt-font: 'Space Grotesk', sans-serif;\n    --rwb-rlt-font-heading: 'Archivo Black', sans-serif;\n\n    font-family: var(--rwb-rlt-font);\n    background-color: var(--rwb-rlt-bg);\n    padding: 100px 40px;\n    overflow: hidden;\n    position: relative;\n    border-top: 4px solid var(--rwb-rlt-text);\n  }\n\n  .rwb-rlt-container {\n    max-width: 800px;\n    margin: 0 auto;\n    width: 100%;\n  }\n\n  \/* SECTION HEADER *\/\n  .rwb-rlt-header {\n    margin-bottom: 50px;\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    text-align: center;\n    align-items: center;\n  }\n\n  .rwb-rlt-tag {\n    display: inline-block;\n    background-color: var(--rwb-rlt-text);\n    color: var(--rwb-rlt-bg);\n    font-weight: 700;\n    padding: 4px 12px;\n    font-size: 0.75rem;\n    text-transform: uppercase;\n    letter-spacing: 1px;\n  }\n\n  .rwb-rlt-title {\n    font-family: var(--rwb-rlt-font-heading);\n    font-size: clamp(1.8rem, 3.5vw, 2.6rem);\n    line-height: 1.1;\n    color: var(--rwb-rlt-text);\n    text-transform: uppercase;\n    margin: 0;\n    letter-spacing: -0.02em;\n  }\n\n  .rwb-rlt-title span {\n    background-color: var(--rwb-rlt-neon-pink);\n    color: #FFFFFF;\n    padding: 2px 8px;\n    display: inline-block;\n    transform: skewX(-10deg);\n    border: 3px solid var(--rwb-rlt-text);\n    box-shadow: 4px 4px 0px var(--rwb-rlt-shadow);\n  }\n\n  .rwb-rlt-desc {\n    font-size: 0.9rem;\n    font-weight: 500;\n    max-width: 500px;\n    color: #333;\n    margin: 0;\n    line-height: 1.5;\n  }\n\n  \/* THE CASINO MACHINE CONSOLE *\/\n  .rwb-rlt-console {\n    background-color: #FFFFFF;\n    border: 4px solid var(--rwb-rlt-text);\n    box-shadow: 8px 8px 0px var(--rwb-rlt-shadow);\n    padding: 40px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 30px;\n    position: relative;\n  }\n\n  \/* SLOT DISPLAY MACHINE *\/\n  .rwb-rlt-display-box {\n    width: 100%;\n    background-color: #F5F5F5;\n    border: 4px solid var(--rwb-rlt-text);\n    padding: 30px 20px;\n    box-sizing: border-box;\n    text-align: center;\n    position: relative;\n    overflow: hidden;\n  }\n\n  .rwb-rlt-display-box::before {\n    content: '[ LINK_SYSTEM_SLOT ]';\n    position: absolute;\n    top: 6px;\n    left: 10px;\n    font-family: monospace;\n    font-size: 0.65rem;\n    font-weight: 700;\n    color: #888;\n  }\n\n  .rwb-rlt-target-channel {\n    font-family: var(--rwb-rlt-font-heading);\n    font-size: clamp(1.6rem, 4vw, 3rem);\n    text-transform: uppercase;\n    margin: 0;\n    color: var(--rwb-rlt-text);\n    letter-spacing: 2px;\n    transition: transform 0.1s ease;\n    word-break: break-all;\n    line-height: 1.1;\n  }\n\n  \/* CHALLENGE CODE TEXT *\/\n  .rwb-rlt-challenge-zone {\n    border-top: 2px dashed var(--rwb-rlt-text);\n    width: 100%;\n    padding-top: 20px;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    align-items: center;\n  }\n\n  .rwb-rlt-challenge-lbl {\n    font-family: monospace;\n    font-size: 0.7rem;\n    font-weight: 700;\n    color: var(--rwb-rlt-neon-pink);\n    text-transform: uppercase;\n  }\n\n  .rwb-rlt-challenge-text {\n    font-size: 0.85rem;\n    font-weight: 600;\n    color: #222222;\n    margin: 0;\n    text-align: center;\n    max-width: 550px;\n    line-height: 1.4;\n  }\n\n  \/* ACTION TRIGGER BUTTONS *\/\n  .rwb-rlt-actions {\n    display: flex;\n    gap: 16px;\n    width: 100%;\n  }\n\n  .rwb-rlt-btn-spin {\n    flex: 1;\n    background-color: var(--rwb-rlt-neon-yellow);\n    color: var(--rwb-rlt-text);\n    border: 3px solid var(--rwb-rlt-text);\n    font-family: var(--rwb-rlt-font-heading);\n    font-size: 1.1rem;\n    padding: 16px;\n    text-transform: uppercase;\n    cursor: pointer;\n    box-shadow: 4px 4px 0px var(--rwb-rlt-shadow);\n    transition: transform 0.1s ease, box-shadow 0.1s ease;\n  }\n\n  .rwb-rlt-btn-spin:hover {\n    transform: translate(-2px, -2px);\n    box-shadow: 6px 6px 0px var(--rwb-rlt-shadow);\n  }\n\n  .rwb-rlt-btn-spin:active {\n    transform: translate(2px, 2px);\n    box-shadow: 2px 2px 0px var(--rwb-rlt-shadow);\n  }\n\n  .rwb-rlt-btn-gate {\n    background-color: var(--rwb-rlt-neon-cyan);\n    color: var(--rwb-rlt-text);\n    border: 3px solid var(--rwb-rlt-text);\n    font-family: var(--rwb-rlt-font-heading);\n    font-size: 1.1rem;\n    padding: 16px 24px;\n    text-transform: uppercase;\n    cursor: not-allowed;\n    box-shadow: 4px 4px 0px var(--rwb-rlt-shadow);\n    opacity: 0.5;\n    text-decoration: none;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.1s ease;\n  }\n\n  .rwb-rlt-btn-gate.is-unlocked {\n    cursor: pointer;\n    opacity: 1;\n  }\n\n  .rwb-rlt-btn-gate.is-unlocked:hover {\n    transform: translate(-2px, -2px);\n    box-shadow: 6px 6px 0px var(--rwb-rlt-shadow);\n  }\n\n  \/* ANIMASI INTERSECTION OBSERVER SINKRON *\/\n  .rwb-rlt-section.rwb-rlt-ready .rwb-rlt-header,\n  .rwb-rlt-section.rwb-rlt-ready .rwb-rlt-console {\n    opacity: 0;\n    transform: translateY(40px);\n    transition: opacity .8s ease, transform .8s cubic-bezier(.25,.46,.45,.94);\n    will-change: opacity, transform;\n  }\n\n  .rwb-rlt-section.rwb-rlt-ready.is-rlt-visible .rwb-rlt-header {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n  .rwb-rlt-section.rwb-rlt-ready.is-rlt-visible .rwb-rlt-console {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n\n  \/* ==========================================================\n     MOBILE RESPONSIVE UPDATES: ANTI-OVERFLOW TEXT & FIXED WIDTH\n     ========================================================== *\/\n  @media (max-width: 768px) {\n    .rwb-rlt-section {\n      padding: 60px 20px;\n    }\n\n    .rwb-rlt-console {\n      padding: 24px 16px;\n      box-shadow: 4px 4px 0px var(--rwb-rlt-shadow);\n      gap: 20px;\n    }\n\n    .rwb-rlt-display-box {\n      padding: 24px 12px;\n    }\n\n    \/* FIX: Turunkan skala teks di HP biar kata panjang anti-terpotong *\/\n    .rwb-rlt-target-channel {\n      font-size: clamp(1.3rem, 5.5vw, 1.8rem);\n      letter-spacing: 1px;\n    }\n\n    .rwb-rlt-actions {\n      flex-direction: column;\n      gap: 12px;\n    }\n\n    .rwb-rlt-btn-spin, .rwb-rlt-btn-gate {\n      width: 100%;\n      box-sizing: border-box;\n      padding: 14px;\n      font-size: 0.95rem;\n    }\n  }\n<\/style>\n\n<!-- HTML STRUCTURE -->\n<section class=\"rwb-rlt-section\" id=\"rwbRltSection\">\n  <div class=\"rwb-rlt-container\">\n    \n    <!-- SECTION HEADER -->\n    <div class=\"rwb-rlt-header\">\n      <span class=\"rwb-rlt-tag\">\/\/ ANTI_FORM CONNECTION SYSTEM<\/span>\n      <h2 class=\"rwb-rlt-title\">COMMUNICATION <span>ROULETTE<\/span><\/h2>\n      <p class=\"rwb-rlt-desc\">\n        No boring contact forms. No useless FAQs. Spin the wheel below to unlock a random operational terminal node and transmit your vector.\n      <\/p>\n    <\/div>\n\n    <!-- CONSOLE MACHINE -->\n    <div class=\"rwb-rlt-console\">\n      \n      <!-- MONITOR DISPLAY -->\n      <div class=\"rwb-rlt-display-box\" id=\"rltDisplayBox\">\n        <h3 class=\"rwb-rlt-target-channel\" id=\"rltTargetChannel\">ROLL_NODE<\/h3>\n      <\/div>\n\n      <!-- TRANSMISSION DEKRET CHALLENGE -->\n      <div class=\"rwb-rlt-challenge-zone\">\n        <span class=\"rwb-rlt-challenge-lbl\">[ REQUIRED TRANSMISSION DECREE ]<\/span>\n        <p class=\"rwb-rlt-challenge-text\" id=\"rltChallengeText\">\n          Press \"SPIN CHANNELS\" to randomly load secure gateway parameters and connection target instructions.\n        <\/p>\n      <\/div>\n\n      <!-- CONTROL BUTTONS -->\n      <div class=\"rwb-rlt-actions\">\n        <button class=\"rwb-rlt-btn-spin\" id=\"rltBtnSpin\">SPIN CHANNELS<\/button>\n        <a href=\"#\" target=\"_blank\" class=\"rwb-rlt-btn-gate\" id=\"rltBtnGate\">LAUNCH LINK<\/a>\n      <\/div>\n\n    <\/div>\n\n  <\/div>\n<\/section>\n\n<!-- ENGINE INTERACTIVE ROLET SYSTEM -->\n<script>\n  (function(){\n    try {\n      const section = document.getElementById('rwbRltSection');\n      if(!section) return;\n\n      \/\/ 1. ENGINE INTERSECTION OBSERVER SAKTI SINKRON 200MS\n      section.classList.add('rwb-rlt-ready');\n      let isRltAnimated = false;\n\n      function startRltAnimations() {\n        if (isRltAnimated) return;\n        isRltAnimated = true;\n        section.classList.add('is-rlt-visible');\n      }\n\n      const rltObserver = new IntersectionObserver((entries) => {\n        entries.forEach(entry => {\n          if (entry.isIntersecting) {\n            setTimeout(startRltAnimations, 200); \n            rltObserver.unobserve(entry.target);\n          }\n        });\n      }, { threshold: 0.15 });\n      \n      rltObserver.observe(section);\n\n      \/* ==========================================================\n         DATABASE DATA LINK - INJECTED LINK RWBDEV\n         ========================================================== *\/\n      const ROLET_CHANNELS = [\n        {\n          name: \"SECURE_EMAIL\",\n          url: \"mailto:hello@yourdomain.com?subject=ROULETTE_SIGNAL_ALPHA\",\n          challenge: '\"Send an email with the subject \\'ROULETTE_SIGNAL_ALPHA\\' and state your urgent development deployment requirements immediately.\"'\n        },\n        {\n          name: \"GITHUB_RELAY\",\n          url: \"https:\/\/github.com\/rwbdev\",\n          challenge: '\"Connect straight via GitHub. Find the pinned repository, open a raw performance issue log, or audit the latest codes.\"'\n        },\n        {\n          name: \"LINKEDIN_CORE\",\n          url: \"https:\/\/www.linkedin.com\/feed\/\",\n          challenge: '\"Establish a secure handshake on LinkedIn. Drop a message starting with code parameter \\'SYS_INIT_2026\\' to skip the filter.\"'\n        },\n        {\n          name: \"TELEGRAM_UPLINK\",\n          url: \"https:\/\/t.me\/username\",\n          challenge: '\"Ping the secure Telegram transmission node directly. Send your raw business pitch proposal in under 3 dense text bars.\"'\n        }\n      ];\n\n      \/\/ ELEMENT SELECTOR\n      const btnSpin = document.getElementById('rltBtnSpin');\n      const btnGate = document.getElementById('rltBtnGate');\n      const txtChannel = document.getElementById('rltTargetChannel');\n      const txtChallenge = document.getElementById('rltChallengeText');\n      const displayBox = document.getElementById('rltDisplayBox');\n\n      let isSpinning = false;\n\n      btnSpin.addEventListener('click', function() {\n        if (isSpinning) return;\n        isSpinning = true;\n\n        \/\/ Reset state tombol gate\n        btnGate.classList.remove('is-unlocked');\n        btnGate.style.cursor = 'not-allowed';\n        btnGate.style.opacity = '0.5';\n        btnGate.setAttribute('href', '#');\n\n        let counter = 0;\n        const totalSpins = 15; \n        const spinInterval = setInterval(() => {\n          \/\/ Efek acak teks brutal kasino\n          const randomIdx = Math.floor(Math.random() * ROLET_CHANNELS.length);\n          txtChannel.innerText = ROLET_CHANNELS[randomIdx].name;\n          \n          \/\/ Efek ganti warna box random pas muter\n          const colors = ['#FFE600', '#00F5D4', '#FF0055', '#EEEEEE'];\n          displayBox.style.backgroundColor = colors[Math.floor(Math.random() * colors.length)];\n\n          counter++;\n          if (counter >= totalSpins) {\n            clearInterval(spinInterval);\n            \n            \/\/ PILIHAN FINAL PEMENANG ROLET\n            const finalIdx = Math.floor(Math.random() * ROLET_CHANNELS.length);\n            const winner = ROLET_CHANNELS[finalIdx];\n\n            \/\/ Tampilkan data pemenang\n            txtChannel.innerText = winner.name;\n            txtChallenge.innerText = winner.challenge;\n            displayBox.style.backgroundColor = '#FFFFFF'; \n\n            \/\/ Buka gembok tombol eksekusi link luar\n            btnGate.setAttribute('href', winner.url);\n            btnGate.classList.add('is-unlocked');\n            btnGate.style.cursor = 'pointer';\n            btnGate.style.opacity = '1';\n\n            isSpinning = false;\n          }\n        }, 100); \n      });\n\n    } catch(err) {\n      console.error(\"Roulette Section Core Error:\", err);\n    }\n  })();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c860200 e-con-full e-flex e-con e-parent\" data-id=\"c860200\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d4ff44f elementor-widget elementor-widget-html\" data-id=\"d4ff44f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n  \/* ==========================================================\n     RWB - FAREWELL TERMINAL (WITH SYNCED ANIMATION)\n     ========================================================== *\/\n  \n  .rwb-fw-section {\n    background-color: #FFFFFF;\n    padding: 100px 20px;\n    text-align: center;\n    border-top: 4px solid #000;\n  }\n\n  \/* --- ANIMASI SINKRON --- *\/\n  .rwb-fw-section.rwb-fw-ready .rwb-robot-area,\n  .rwb-fw-section.rwb-fw-ready .rwb-fw-title,\n  .rwb-fw-section.rwb-fw-ready .rwb-fw-joke,\n  .rwb-fw-section.rwb-fw-ready .rwb-fw-btn {\n    opacity: 0;\n    transform: translateY(40px);\n    transition: opacity 0.8s ease, transform 0.8s ease;\n  }\n\n  .rwb-fw-section.rwb-fw-ready.is-fw-visible .rwb-robot-area,\n  .rwb-fw-section.rwb-fw-ready.is-fw-visible .rwb-fw-title,\n  .rwb-fw-section.rwb-fw-ready.is-fw-visible .rwb-fw-joke,\n  .rwb-fw-section.rwb-fw-ready.is-fw-visible .rwb-fw-btn {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n  \/* Delay biar munculnya elegan satu-satu *\/\n  .rwb-fw-section.is-fw-visible .rwb-fw-title { transition-delay: 0.1s; }\n  .rwb-fw-section.is-fw-visible .rwb-fw-joke { transition-delay: 0.2s; }\n  .rwb-fw-section.is-fw-visible .rwb-fw-btn { transition-delay: 0.3s; }\n\n  .rwb-fw-container { max-width: 600px; margin: 0 auto; }\n\n  .rwb-robot-area { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 24px; }\n  .rwb-robot-zzz { font-family: monospace; font-size: 1rem; font-weight: bold; animation: zzz 2s infinite; }\n  .rwb-robot-img-box { width: 120px; height: 120px; border: 3px solid #000; background-color: #F0F0F0; overflow: hidden; display: flex; align-items: center; justify-content: center; box-shadow: 6px 6px 0px #000; }\n  .rwb-robot-img-box img { width: 100%; height: 100%; object-fit: cover; }\n\n  @keyframes zzz { 0% { opacity: 0; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-10px); } 100% { opacity: 0; transform: translateY(-20px); } }\n\n  .rwb-fw-title { font-family: 'Archivo Black', sans-serif; font-size: clamp(1.8rem, 3.5vw, 2.6rem); text-transform: uppercase; margin-bottom: 20px; }\n  .rwb-fw-joke { font-family: 'Space Grotesk', sans-serif; font-size: 0.95rem; line-height: 1.6; margin-bottom: 40px; color: #222; }\n  .rwb-fw-btn { background-color: #000; color: #FFF; border: 3px solid #000; padding: 16px 32px; font-family: 'Archivo Black', sans-serif; text-transform: uppercase; cursor: pointer; font-size: 1rem; box-shadow: 4px 4px 0px #FF0055; transition: all 0.2s ease; }\n  .rwb-fw-btn:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0px #000; }\n  .rwb-is-dormant { filter: grayscale(1) brightness(0.7); transition: filter 1s ease; }\n<\/style>\n\n<section class=\"rwb-fw-section\" id=\"rwbFwSection\">\n  <div class=\"rwb-fw-container\">\n    <div class=\"rwb-robot-area\">\n      <div class=\"rwb-robot-zzz\">Zzz<\/div>\n      <div class=\"rwb-robot-img-box\">\n        <img decoding=\"async\" src=\"https:\/\/lab.rwb.my.id\/neo\/wp-content\/uploads\/sites\/19\/2026\/06\/Sleep-Robot.jpeg\" alt=\"Sleeping Robot\">\n      <\/div>\n    <\/div>\n    <h2 class=\"rwb-fw-title\">SYSTEM_BURNED_OUT<\/h2>\n    <p class=\"rwb-fw-joke\" id=\"rwbFwJoke\">\n      Congrats, you've survived the roulette. My server is now officially tired. It\u2019s requesting a 48-hour nap and an iced coffee. \n      You can leave now, or click below to force the site into 'Dormant Mode'.\n    <\/p>\n    <button class=\"rwb-fw-btn\" id=\"rwbFwBtn\">ENTER DORMANT MODE<\/button>\n  <\/div>\n<\/section>\n\n<script>\n  (function(){\n    \/\/ ANIMASI OBSERVER\n    const section = document.getElementById('rwbFwSection');\n    section.classList.add('rwb-fw-ready');\n    const observer = new IntersectionObserver((entries) => {\n      entries.forEach(entry => { if(entry.isIntersecting) section.classList.add('is-fw-visible'); });\n    }, { threshold: 0.15 });\n    observer.observe(section);\n\n    \/\/ BUTTON LOGIC\n    const fwBtn = document.getElementById('rwbFwBtn');\n    fwBtn.addEventListener('click', () => {\n      document.body.classList.add('rwb-is-dormant');\n      fwBtn.innerText = \"SYSTEM SLEEPING...\";\n      fwBtn.style.cursor = \"wait\";\n      setTimeout(() => {\n        alert(\"Wait, did you really think that would work? Go back to work, human. Refresh the page if you want to bother me again.\");\n        window.location.reload();\n      }, 2000);\n    });\n  })();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b679939 e-con-full e-flex e-con e-parent\" data-id=\"b679939\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5ad1462 elementor-widget elementor-widget-html\" data-id=\"5ad1462\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n  \/* ==========================================================\n     RWB - NEO BRUTALISM: PREMIUM DARK\/GREY FOOTER (REVISED)\n     ========================================================== *\/\n  \n  \/* SCOPED VARIABLES: Terisolasi penuh di dalam komponen footer, gampang diganti warna canvasnya *\/\n  .rwb-footer-section {\n    --rwb-foot-bg: #1A1A1A;              \/* Canvas Gelap \/ Grey Premium *\/\n    --rwb-foot-text-light: #FFFFFF;      \/* Teks utama putih bersih *\/\n    --rwb-foot-text-muted: #A0A0A0;      \/* Teks sekunder abu-abu soft *\/\n    --rwb-foot-border: #FFFFFF;          \/* Garis border putih kontras *\/\n    --rwb-foot-accent-flash: #CCFF00;    \/* Neon Lime Yellow untuk animasi berkedip *\/\n    --rwb-foot-hover-bg: #FF006E;        \/* Neon Pink untuk hover Back to Top *\/\n    --rwb-foot-pulse-color: #00F5D4;     \/* Cyan untuk status aktif *\/\n    --rwb-foot-font-body: 'Space Grotesk', sans-serif;\n    --rwb-foot-font-heading: 'Archivo Black', sans-serif;\n\n    \/* Base Layout Styles *\/\n    font-family: var(--rwb-foot-font-body);\n    background-color: var(--rwb-foot-bg);\n    color: var(--rwb-foot-text-light);\n    padding: 60px 40px;\n    border-top: 4px solid var(--rwb-foot-border); \/* Garis pembatas tegas top section *\/\n    position: relative;\n    overflow: hidden;\n  }\n\n  .rwb-foot-container {\n    max-width: 1000px; \/* Lebar container disamakan rata dengan seksi di atasnya *\/\n    margin: 0 auto;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    gap: 40px;\n  }\n\n  \/* Baris Utama Atas *\/\n  .rwb-foot-main-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    width: 100%;\n  }\n\n  \/* Elemen Logo \/ Branding *\/\n  .rwb-foot-brand {\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n  }\n\n  .rwb-foot-logo {\n    font-family: var(--rwb-foot-font-heading);\n    font-size: 1.5rem;\n    text-transform: uppercase;\n    line-height: 1;\n    letter-spacing: -0.02em;\n    margin: 0;\n    color: var(--rwb-foot-text-light);\n  }\n\n  .rwb-foot-tagline {\n    font-size: 0.85rem;\n    font-weight: 500;\n    color: var(--rwb-foot-text-muted);\n    margin: 0;\n  }\n\n  \/* Status Ketersediaan Proyek (Availability Dashboard) *\/\n  .rwb-foot-status-badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 12px;\n    border: 3px solid var(--rwb-foot-border);\n    padding: 8px 16px;\n    background-color: transparent;\n    box-shadow: 4px 4px 0px var(--rwb-foot-border);\n    font-weight: 700;\n    font-size: 0.85rem;\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n  }\n\n  \/* Efek denyut lampu indikator proyek *\/\n  .rwb-foot-pulse-dot {\n    width: 10px;\n    height: 10px;\n    background-color: var(--rwb-foot-pulse-color);\n    border: 2px solid var(--rwb-foot-bg);\n    border-radius: 50%;\n    position: relative;\n  }\n\n  .rwb-foot-pulse-dot::after {\n    content: '';\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    top: -2px;\n    left: -2px;\n    border-radius: 50%;\n    border: 2px solid var(--rwb-foot-pulse-color);\n    animation: rwbFootPulse 1.8s infinite ease-out;\n    opacity: 0.6;\n  }\n\n  @keyframes rwbFootPulse {\n    0% { transform: scale(1); opacity: 1; }\n    100% { transform: scale(2.5); opacity: 0; }\n  }\n\n  \/* Baris Bawah (Copyright & Control) *\/\n  .rwb-foot-bottom-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    border-top: 2px dashed var(--rwb-foot-border);\n    padding-top: 24px;\n    width: 100%;\n  }\n\n  \/* Text Copyright Style Base *\/\n  .rwb-foot-copy {\n    font-size: 0.85rem;\n    font-weight: 700;\n    margin: 0;\n    color: var(--rwb-foot-text-light);\n    line-height: 1.6;\n  }\n\n  \/* ANIMASI BERKEDIP KONTRAS DENGAN LINK LINK KE WHATSAPP *\/\n  .rwb-foot-copy a.rwb-flash-credit-link {\n    color: var(--rwb-foot-accent-flash);\n    text-transform: uppercase;\n    text-decoration: none;\n    display: inline-block;\n    animation: rwbNeonBlink 1.5s infinite steps(2, start);\n    padding: 0 4px;\n    border: 1px dashed transparent;\n    transition: border 0.2s ease;\n  }\n\n  .rwb-foot-copy a.rwb-flash-credit-link:hover {\n    border-color: var(--rwb-foot-accent-flash);\n  }\n\n  @keyframes rwbNeonBlink {\n    0%, 100% {\n      opacity: 1;\n      text-shadow: 0 0 8px var(--rwb-foot-accent-flash);\n    }\n    50% {\n      opacity: 0.3;\n      text-shadow: none;\n    }\n  }\n\n  \/* Tombol Back to Top Kotak Elegan *\/\n  .rwb-foot-top-btn {\n    font-family: var(--rwb-foot-font-heading);\n    font-size: 0.9rem;\n    text-transform: uppercase;\n    background-color: transparent;\n    color: var(--rwb-foot-text-light);\n    border: 3px solid var(--rwb-foot-border);\n    padding: 10px 14px;\n    box-shadow: 4px 4px 0px var(--rwb-foot-border);\n    cursor: pointer;\n    transition: all 0.2s ease;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  \/* Warna hover text back to top jadi neon pink *\/\n  .rwb-foot-top-btn:hover {\n    transform: translate(3px, 3px);\n    box-shadow: 1px 1px 0px var(--rwb-foot-border);\n    background-color: var(--rwb-foot-hover-bg); \n    color: var(--rwb-foot-text-light);          \n  }\n\n  \/* ==========================================================\n     MOBILE RESPONSIVE LAYOUT (< 768px)\n     ========================================================== *\/\n  @media (max-width: 768px) {\n    .rwb-footer-section {\n      padding: 40px 20px;\n    }\n\n    .rwb-foot-container {\n      gap: 30px;\n    }\n\n    \/* Baris utama atas vertikal *\/\n    .rwb-foot-main-row {\n      flex-direction: column;\n      align-items: flex-start;\n      gap: 20px;\n    }\n\n    .rwb-foot-status-badge {\n      align-self: stretch;\n      justify-content: center;\n    }\n\n    \/* Penyesuaian baris bawah vertikal *\/\n    .rwb-foot-bottom-row {\n      flex-direction: column-reverse;\n      align-items: stretch;\n      gap: 24px;\n    }\n\n    \/* REVISI: Seluruh text credit wajib CENTER di mobile *\/\n    .rwb-foot-copy {\n      text-align: center;\n      width: 100%;\n    }\n\n    .rwb-foot-top-btn {\n      width: 100%;\n    }\n  }\n<\/style>\n\n<footer class=\"rwb-footer-section\">\n  <div class=\"rwb-foot-container\">\n    \n    <div class=\"rwb-foot-main-row\">\n      \n      <div class=\"rwb-foot-brand\">\n        <h4 class=\"rwb-foot-logo\">Rudi Dev<\/h4>\n        <p class=\"rwb-foot-tagline\">High-performance digital craftsperson.<\/p>\n      <\/div>\n\n      <div class=\"rwb-foot-status-badge\">\n        <div class=\"rwb-foot-pulse-dot\"><\/div>\n        <span>Available for Projects<\/span>\n      <\/div>\n\n    <\/div>\n\n    <div class=\"rwb-foot-bottom-row\">\n      \n      <p class=\"rwb-foot-copy\">\n        &copy; <span id=\"rwbAutoYear\"><\/span> Rudi Dev. All rights reserved. \n        <a href=\"https:\/\/wa.me\/6281227008020?text=Hello%20Rudi%20Dev%2C%20I%20saw%20your%20awesome%20portfolio%20and%20want%20to%20collaborate%20on%20a%20high-performance%20web%20project.\" target=\"_blank\" class=\"rwb-flash-credit-link\">\n          Built with pure code.\n        <\/a>\n      <\/p>\n\n      <button class=\"rwb-foot-top-btn\" onclick=\"rwbScrollToTop()\">\n        Back To Top <span>&uarr;<\/span>\n      <\/button>\n\n    <\/div>\n\n  <\/div>\n<\/footer>\n\n<script>\n  (function() {\n    try {\n      \/\/ Script pengisi TAHUN otomatis secara Real-Time sesuai tahun berjalan\n      const yearSpan = document.getElementById('rwbAutoYear');\n      if (yearSpan) {\n        yearSpan.textContent = new Date().getFullYear();\n      }\n    } catch (e) {\n      console.error(\"Year automated error:\", e);\n    }\n  })();\n\n  \/\/ Fungsi Kembali Ke Atas Halaman\n  function rwbScrollToTop() {\n    try {\n      window.scrollTo({\n        top: 0,\n        behavior: 'smooth'\n      });\n    } catch (e) {\n      window.scrollTo(0, 0);\n    }\n  }\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\ud83d\udce7 Your email is safe&#8230; I&#8217;m just pretending I didn&#8217;t see it. WhatsApp is faster. \ud83e\udd77\ud83e\udd23 Rudi Dev Home Works About Contact CONTACT Open for Projects 2026 LET&#8217;S MAKE BOLD MOVES. Got a crazy idea or a project that needs a serious upgrade? Don&#8217;t hesitate to reach out. I reply fast and I don&#8217;t do [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-25","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/lab.rwb.my.id\/neo\/wp-json\/wp\/v2\/pages\/25","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lab.rwb.my.id\/neo\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/lab.rwb.my.id\/neo\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/lab.rwb.my.id\/neo\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lab.rwb.my.id\/neo\/wp-json\/wp\/v2\/comments?post=25"}],"version-history":[{"count":79,"href":"https:\/\/lab.rwb.my.id\/neo\/wp-json\/wp\/v2\/pages\/25\/revisions"}],"predecessor-version":[{"id":302,"href":"https:\/\/lab.rwb.my.id\/neo\/wp-json\/wp\/v2\/pages\/25\/revisions\/302"}],"wp:attachment":[{"href":"https:\/\/lab.rwb.my.id\/neo\/wp-json\/wp\/v2\/media?parent=25"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}