{"id":2957,"date":"2026-01-30T18:06:30","date_gmt":"2026-01-30T10:06:30","guid":{"rendered":"https:\/\/www.klwong.hk\/?page_id=2957"},"modified":"2026-04-27T18:07:42","modified_gmt":"2026-04-27T10:07:42","slug":"%e7%ab%8b%e6%b3%95%e6%9c%83%e9%81%b8%e8%88%89%e5%b0%88%e9%a0%81-2-2","status":"publish","type":"page","link":"https:\/\/www.klwong.hk\/?page_id=2957","title":{"rendered":"\u7acb\u6cd5\u6703\u767c\u8a00"},"content":{"rendered":"<!-- \u7acb\u6cd5\u6703\u767c\u8a00\u5c08\u9801 -->\r\n<!-- \u8bf7\u5c06\u6b64\u5185\u5bb9\u590d\u5236\u5230 WordPress \u9875\u9762\u7684\u7f16\u8f91\u5668\u4e2d\uff0c\u5e76\u9009\u62e9 \"Election Home\" \u6a21\u677f -->\r\n<!-- \u6ce8\u610f\uff1a\u5c01\u9762\u9875\u5df2\u5728\u6a21\u677f\u4e2d\u663e\u793a\uff0c\u6b64\u5904\u53ea\u5305\u542b\u7acb\u6cd5\u6703\u767c\u8a00\u7279\u6709\u7684\u5185\u5bb9 -->\r\n\r\n<style>\r\n    .play-fullscreen-btn:hover {\r\n        background: rgba(30, 60, 114, 1) !important;\r\n        transform: scale(1.05);\r\n    }\r\n\r\n    .play-overlay {\r\n        pointer-events: auto;\r\n        z-index: 5;\r\n    }\r\n\r\n    .play-overlay-button {\r\n        background-image: url(\"https:\/\/static.xx.fbcdn.net\/rsrc.php\/v4\/y6\/r\/WEXl7U8fX95.png\");\r\n        background-repeat: no-repeat;\r\n        background-size: 81px 245px;\r\n        background-position: 0px 0px;\r\n        background-color: transparent;\r\n        border: none;\r\n        border-radius: 50%;\r\n        cursor: pointer;\r\n        height: 80px;\r\n        width: 80px;\r\n        outline: none;\r\n        padding: 0;\r\n        margin: 0;\r\n        position: absolute;\r\n        top: 50%;\r\n        left: 50%;\r\n        transform: translate(-50%, -50%);\r\n        transition: transform 0.3s ease;\r\n    }\r\n\r\n    .play-overlay:hover .play-overlay-button {\r\n        transform: translate(-50%, -50%) scale(1.1);\r\n    }\r\n\r\n    video {\r\n        z-index: 1;\r\n    }\r\n\r\n    .video-cover {\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 100%;\r\n        background-size: cover;\r\n        background-position: center;\r\n        cursor: pointer;\r\n        z-index: 10;\r\n        transition: opacity 0.3s ease;\r\n    }\r\n\r\n    .play-button-overlay {\r\n        position: absolute;\r\n        top: 50%;\r\n        left: 50%;\r\n        transform: translate(-50%, -50%);\r\n        width: 80px;\r\n        height: 80px;\r\n        background: rgba(30, 60, 114, 0.9);\r\n        border-radius: 50%;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        cursor: pointer;\r\n        transition: transform 0.3s ease, background 0.3s ease;\r\n    }\r\n\r\n    .play-button-overlay::after {\r\n        content: \"\";\r\n        width: 0;\r\n        height: 0;\r\n        border-left: 25px solid #fff;\r\n        border-top: 15px solid transparent;\r\n        border-bottom: 15px solid transparent;\r\n        margin-left: 5px;\r\n    }\r\n\r\n    .play-button-overlay:hover {\r\n        transform: translate(-50%, -50%) scale(1.1);\r\n        background: rgba(30, 60, 114, 1);\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .play-button-overlay {\r\n            width: 48px;\r\n            height: 48px;\r\n        }\r\n\r\n        .play-button-overlay::after {\r\n            border-left-width: 15px;\r\n            border-top-width: 9px;\r\n            border-bottom-width: 9px;\r\n            margin-left: 3px;\r\n        }\r\n\r\n        .play-fullscreen-btn {\r\n            display: none !important;\r\n        }\r\n    }\r\n\r\n    \/* \u2500\u2500 Category section scroll offset \u2500\u2500 *\/\r\n    [id^=\"legco-cat-\"] {\r\n        scroll-margin-top: 100px;\r\n    }\r\n\r\n    \/* \u2500\u2500 Category Tabs \u2500\u2500 *\/\r\n    #legco-tabs-nav {\r\n        position: sticky;\r\n        top: 0;\r\n        z-index: 50;\r\n        background: rgba(255, 255, 255, 0.95);\r\n        backdrop-filter: blur(8px);\r\n        -webkit-backdrop-filter: blur(8px);\r\n        padding: 14px 0;\r\n        margin-bottom: 48px;\r\n        box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);\r\n        border-radius: 0 0 12px 12px;\r\n    }\r\n\r\n    .legco-tabs-wrapper {\r\n        display: flex;\r\n        justify-content: center;\r\n        gap: 12px;\r\n        flex-wrap: wrap;\r\n    }\r\n\r\n    .legco-tab-btn {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 6px;\r\n        padding: 9px 22px;\r\n        border-radius: 40px;\r\n        border: 2px solid;\r\n        font-size: 15px;\r\n        font-weight: 700;\r\n        letter-spacing: 2px;\r\n        cursor: pointer;\r\n        background: transparent;\r\n        transition: background 0.2s ease, color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;\r\n    }\r\n\r\n    .legco-tab-btn:hover {\r\n        transform: translateY(-1px);\r\n        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\r\n    }\r\n\r\n    .legco-tab-btn.is-active {\r\n        color: #fff !important;\r\n        box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);\r\n    }\r\n\r\n    .legco-tab-dot {\r\n        width: 8px;\r\n        height: 8px;\r\n        border-radius: 50%;\r\n        flex-shrink: 0;\r\n        transition: background 0.2s ease;\r\n    }\r\n\r\n    @media (max-width: 600px) {\r\n        .legco-tab-btn {\r\n            font-size: 13px;\r\n            padding: 7px 16px;\r\n            letter-spacing: 1px;\r\n        }\r\n\r\n        .video-grid {\r\n            grid-template-columns: 1fr !important;\r\n            gap: 20px !important;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<!-- Main Content Section -->\r\n<div class=\"ebook-page intro-page\" style=\"text-align: center; padding: 80px 20px; border-left: none !important;\">\r\n    <div style=\"max-width: 1200px; margin: 0 auto;\">\r\n\r\n        <!-- Header Section -->\r\n        <div style=\"margin-bottom: 60px;\">\r\n            <h2 style=\"font-size: 36px; font-weight: bold; color: #2c3e50; margin-bottom: 20px; text-align: center;\">\r\n                \u7acb\u6cd5\u6703\u767c\u8a00<\/h2>\r\n        <\/div>\r\n\r\n        <!-- Speech Videos Section -->\r\n        <div style=\"margin: 60px 0;\">\r\n            <!-- Category Tabs Navigation -->\r\n            <nav id=\"legco-tabs-nav\" aria-label=\"\u5f71\u7247\u5206\u985e\u5c0e\u822a\">\r\n                <div class=\"legco-tabs-wrapper\" id=\"legco-tabs-wrapper\"><\/div>\r\n            <\/nav>\r\n\r\n            <div id=\"legco-video-sections\"><\/div>\r\n\r\n            <!-- Video Modal -->\r\n            <div id=\"videoModal\" style=\"display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.9); z-index: 10000; align-items: center; justify-content: center;\">\r\n                <div id=\"modalContainer\" style=\"position: relative; width: 90%; max-width: 1200px; max-height: 90vh; display: flex; flex-direction: column; align-items: center; justify-content: center;\">\r\n                    <div style=\"position: absolute; top: -44px; right: 0; display: flex; gap: 8px; z-index: 10001;\">\r\n                        <button id=\"modalFullscreenBtn\" style=\"background: rgba(255,255,255,0.2); border: 1px solid rgba(255,255,255,0.5); color: #fff; font-size: 14px; cursor: pointer; padding: 6px 12px; border-radius: 6px;\">\u5168\u5c4f<\/button>\r\n                        <button id=\"closeModal\" style=\"background: transparent; border: none; color: #fff; font-size: 32px; cursor: pointer; padding: 0 8px; line-height: 1;\">\u00d7<\/button>\r\n                    <\/div>\r\n                    <div id=\"modalVideoContainer\" style=\"position: relative; background: #000; display: flex; align-items: center; justify-content: center;\">\r\n                        <iframe id=\"modalVideo\" style=\"width: 100%; height: 100%; border: none; display: block; position: absolute; top: 0; left: 0;\" src=\"about:blank\" frameborder=\"0\" allowfullscreen allow=\"fullscreen; autoplay; encrypted-media\"><\/iframe>\r\n                        <video id=\"modalVideoMP4\" style=\"width: 100%; height: 100%; display: none; position: absolute; top: 0; left: 0; object-fit: contain;\" autoplay=\"autoplay\" controls=\"controls\" width=\"300\" height=\"150\"><\/video>\r\n                    <\/div>\r\n                    <p id=\"modalHint\" style=\"margin-top: 12px; font-size: 14px; color: rgba(255,255,255,0.85); text-align: center; display: none;\">\r\n                        \u70ba\u907f\u514d\u81ea\u52d5\u64ad\u653e\u975c\u97f3\uff0c\u8acb\u9ede\u64ca\u5f71\u7247\u5167\u64ad\u653e\u9375\u958b\u59cb\u64ad\u653e\uff08\u901a\u5e38\u6703\u6709\u8072\uff09\u3002\u6216\r\n                        <a id=\"modalOpenNewTab\" href=\"#\" target=\"_blank\" rel=\"noopener\" style=\"color: #7eb8ff;\">\u5728\u65b0\u5206\u9801\u958b\u555f<\/a>\r\n                    <\/p>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <script>\r\n                var VIDEO_CATEGORIES = [{\r\n                    title: '\u7acb\u6cd5\u6703\u5de5\u4f5c\u5831\u544a',\r\n                    colorBar: ['#7c3aed', '#a78bfa'],\r\n                    colorBadge: '#7c3aed',\r\n                    subtitle: '',\r\n                    layout: 'single',\r\n                    videos: [{\r\n                        reel: '26428291096839707',\r\n                        h: 312,\r\n                        ratio: 0.5625,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/2026\u9ec3\u9326\u826f-\u7acb\u6cd5\u6703\u5de5\u4f5c\u5831\u544a-1.jpg'\r\n                    }]\r\n                }, {\r\n                    title: '\u5927\u6703\u8cea\u8a62',\r\n                    colorBar: ['#b91c1c', '#ef4444'],\r\n                    colorBadge: '#b91c1c',\r\n                    subtitle: '',\r\n                    layout: 'grid',\r\n                    videos: [\r\n                    {\r\n                        reel: '1234740468629654',\r\n                        h: 312,\r\n                        ratio: 1.79,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f.jpg'\r\n                    },     \r\n                    {\r\n                        reel: '873336802218570',\r\n                        h: 314,\r\n                        ratio: 1.78,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-9.jpg'\r\n                    },]\r\n                }, {\r\n                    title: '\u8b70\u54e1\u8b70\u6848',\r\n                    colorBar: ['#1e3c72', '#2980b9'],\r\n                    colorBadge: '#1e3c72',\r\n                    subtitle: null,\r\n                    layout: 'grid',\r\n                    videos: [{\r\n                        reel: '1916258625667074',\r\n                        h: 312,\r\n                        ratio: 1.79,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/1916258625667074.jpg'\r\n                    }, {\r\n                        reel: '2228751441229500',\r\n                        h: 312,\r\n                        ratio: 1.79,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/2228751441229500.jpg'\r\n                    }, {\r\n                        reel: '1883755562344346',\r\n                        h: 312,\r\n                        ratio: 1.79,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u8b70\u54e1\u8b70\u6848_1883755562344346.jpg'\r\n                    }, {\r\n                        reel: '1082192060659555',\r\n                        h: 314,\r\n                        ratio: 1.78,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-10.jpg'\r\n                    }, {\r\n                        reel: '1451279003093567',\r\n                        h: 314,\r\n                        ratio: 1.78,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-8.jpg'\r\n                    }, {\r\n                        reel: '876278235300254',\r\n                        h: 316,\r\n                        ratio: 1.78,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-5.jpg'\r\n                    }, {\r\n                        reel: '876714981800190',\r\n                        h: 316,\r\n                        ratio: 1.78,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-4.jpg'\r\n                    }, {\r\n                        reel: '848971554805934',\r\n                        h: 314,\r\n                        ratio: 1.78,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-3.jpg'\r\n                    }]\r\n                }, {\r\n                    title: '\u4e8b\u52d9\u59d4\u54e1\u6703',\r\n                    colorBar: ['#15803d', '#22c55e'],\r\n                    colorBadge: '#15803d',\r\n                    subtitle: '',\r\n                    layout: 'grid',\r\n                    videos: [],\r\n                    subCategories: [{\r\n                        title: '\u6c11\u653f\u53ca\u6587\u5316\u9ad4\u80b2\u4e8b\u52d9\u59d4\u54e1\u6703',\r\n                        colorBar: ['#7c3aed', '#a78bfa'],\r\n                        colorBadge: '#7c3aed',\r\n                        videos: [{\r\n                            reel: '2805138196488225',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/2805138196488225.jpg'\r\n                        }, {\r\n                            reel: '935048196179976',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/935048196179976.jpg'\r\n                        }, {\r\n                            reel: '922773576760524',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-12.jpg'\r\n                        }, {\r\n                            reel: '1166194401995699',\r\n                            h: 316,\r\n                            ratio: 1.78,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-6.jpg'\r\n                        }, {\r\n                            reel: '1458156549074898',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u6c11\u653f\u53ca\u6587\u5316\u9ad4\u80b2\u4e8b\u52d9\u59d4\u54e1\u6703_1458156549074898.jpg'\r\n                        }]\r\n                    }, {\r\n                        title: '\u4eba\u529b\u4e8b\u52d9\u59d4\u54e1\u6703',\r\n                        colorBar: ['#0369a1', '#0ea5e9'],\r\n                        colorBadge: '#0369a1',\r\n                        videos: [{\r\n                            reel: '998435759189918',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u4eba\u529b\u4e8b\u52d9\u59d4\u54e1\u6703_998435759189918.jpg'\r\n                        },{\r\n                            reel: '776498795503029',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-14.jpg'\r\n                        }, {\r\n                            reel: '896555420032052',\r\n                            h: 316,\r\n                            ratio: 1.78,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-7.jpg'\r\n                        }, {\r\n                            reel: '1107939664823284',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u4eba\u529b\u4e8b\u52d9\u59d4\u54e1\u6703_1107939664823284.jpg'\r\n                        }, {\r\n                            reel: '4040758442845192',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u4eba\u529b\u4e8b\u52d9\u59d4\u54e1\u6703_4040758442845192.jpg'\r\n                        }]\r\n                    }, {\r\n                        title: '\u4fdd\u5b89\u4e8b\u52d9\u59d4\u54e1\u6703',\r\n                        colorBar: ['#9a3412', '#ea580c'],\r\n                        colorBadge: '#9a3412',\r\n                        videos: [{\r\n                            reel: '4425530594358724',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/4425530594358724.jpg'\r\n                        }, {\r\n                            reel: '1288903783177990',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/1288903783177990.jpg'\r\n                        }, {\r\n                            reel: '1974457870111651',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-15.jpg'\r\n                        }, {\r\n                            reel: '3113449552376787',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-13.jpg'\r\n                        }, {\r\n                            reel: '848369541538527',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u7acb\u6cd5\u6703\u6703\u8b70_848369541538527.jpg'\r\n                        }, {\r\n                            reel: '895851199919991',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u4fdd\u5b89\u4e8b\u52d9\u59d4\u54e1\u6703_895851199919991.jpg'\r\n                        }]\r\n                    }, {\r\n                        title: '\u6559\u80b2\u4e8b\u52d9\u59d4\u54e1\u6703',\r\n                        colorBar: ['#1d4ed8', '#60a5fa'],\r\n                        colorBadge: '#1d4ed8',\r\n                        videos: [{\r\n                            reel: '1310095677544025',\r\n                            h: 314,\r\n                            ratio: 1.78,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/02\/\u9ec3\u9326\u826f-11.jpg'\r\n                        }, {\r\n                            reel: '3175383702665599',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u6559\u80b2\u4e8b\u52d9\u59d4\u54e1\u6703_3175383702665599.jpg'\r\n                        }, {\r\n                            reel: '1289474176474730',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u6559\u80b2\u4e8b\u52d9\u59d4\u54e1\u6703_1289474176474730.jpg'\r\n                        }, {\r\n                            reel: '3153245188216470',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u6559\u80b2\u4e8b\u52d9\u59d4\u54e1\u6703_3153245188216470.jpg'\r\n                        }]\r\n                    }, {\r\n                        title: '\u7279\u5225\u8ca1\u6703',\r\n                        colorBar: ['#166534', '#4ade80'],\r\n                        colorBadge: '#166534',\r\n                        videos: [{\r\n                            reel: '2371900316632774',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/2371900316632774.jpg'\r\n                        }, {\r\n                            reel: '1310490061144634',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u7279\u5225\u8ca1\u6703_1310490061144634.jpg'\r\n                        }, {\r\n                            reel: '1688887438929566',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/1688887438929566.jpg'\r\n                        }, {\r\n                            reel: '1276816291185291',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/1276816291185291.jpg'\r\n                        }, {\r\n                            reel: '980266574529490',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u7279\u5225\u8ca1\u6703_980266574529490.jpg'\r\n                        }, {\r\n                            reel: '1494054159041715',\r\n                            h: 312,\r\n                            ratio: 1.79,\r\n                            cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/1494054159041715.jpg'\r\n                        }]\r\n                    }]\r\n                }, {\r\n                    title: '\u653f\u5e9c\u6cd5\u6848',\r\n                    colorBar: ['#0f766e', '#2dd4bf'],\r\n                    colorBadge: '#0f766e',\r\n                    subtitle: '',\r\n                    layout: 'single',\r\n                    videos: [{\r\n                        reel: '1698320677995899',\r\n                        h: 312,\r\n                        ratio: 1.79,\r\n                        cover: 'https:\/\/www.klwong.hk\/wp-content\/uploads\/2026\/04\/\u653f\u5e9c\u6cd5\u6848_2187474562083357.jpg'\r\n                    }]\r\n                }];\r\n\r\n                function el(tag, styles, attrs) {\r\n                    var node = document.createElement(tag);\r\n                    if (styles) node.style.cssText = styles;\r\n                    if (attrs) Object.keys(attrs).forEach(function(k) {\r\n                        node.setAttribute(k, attrs[k]);\r\n                    });\r\n                    return node;\r\n                }\r\n\r\n                function fbUrl(reel, h, ratio) {\r\n                    ratio = (typeof ratio === 'number' && ratio > 0) ? ratio : 1.78;\r\n                    var isPortrait = (1 \/ ratio) > 1;\r\n                    var pw, ph;\r\n                    if (isPortrait) {\r\n                        pw = 314;\r\n                        ph = Math.round(pw \/ ratio);\r\n                    } else {\r\n                        pw = 560;\r\n                        ph = h;\r\n                    }\r\n                    return 'https:\/\/www.facebook.com\/plugins\/video.php?height=' + ph +\r\n                        '&href=https%3A%2F%2Fwww.facebook.com%2Freel%2F' + reel +\r\n                        '%2F&show_text=false&width=' + pw + '&t=0';\r\n                }\r\n\r\n                function buildVideoCard(v, isSingle) {\r\n                    var url = fbUrl(v.reel, v.h, v.ratio);\r\n                    var isPortrait = v.ratio > 0 && (1 \/ v.ratio) > 1;\r\n\r\n                    var wrapper = el('div', null, { class: 'video-wrapper' });\r\n                    wrapper.style.cssText = 'background:#000;border-radius:16px;padding:0;' +\r\n                        'box-shadow:0 8px 24px rgba(0,0,0,0.12);' +\r\n                        'transition:transform 0.3s ease,box-shadow 0.3s ease;' +\r\n                        'overflow:hidden;position:relative;width:100%;' +\r\n                        (isSingle ? (isPortrait ? 'max-width:420px;' : 'max-width:620px;') : '');\r\n\r\n                    var aspectBox = el('div',\r\n                        'position:relative;padding-bottom:' + (1 \/ v.ratio * 100).toFixed(4) + '%;height:0;overflow:hidden;border-radius:16px;background:#000;'\r\n                    );\r\n\r\n                    var iframe = el('iframe',\r\n                        'border:none;overflow:hidden;position:absolute;top:0;left:0;width:100%;height:100%;', {\r\n                            class: 'lazy-iframe',\r\n                            'data-src': url,\r\n                            src: 'about:blank',\r\n                            frameborder: '0',\r\n                            scrolling: 'no',\r\n                            allowfullscreen: 'allowfullscreen'\r\n                        });\r\n\r\n                    var cover = el('div', null, {\r\n                        class: 'video-cover',\r\n                        'data-video-src': url,\r\n                        'data-aspect-ratio': String(v.ratio),\r\n                        'data-cover-image': v.cover\r\n                    });\r\n                    cover.style.backgroundImage = 'url(' + v.cover + ')';\r\n\r\n                    var playIcon = el('div', null, { class: 'play-button-overlay' });\r\n                    cover.appendChild(playIcon);\r\n\r\n                    aspectBox.appendChild(iframe);\r\n                    aspectBox.appendChild(cover);\r\n                    wrapper.appendChild(aspectBox);\r\n\r\n                    var btn = el('button',\r\n                        'position:absolute;bottom:20px;right:20px;' +\r\n                        'background:rgba(30,60,114,0.9);color:#fff;border:none;' +\r\n                        'padding:12px 24px;border-radius:8px;font-size:16px;font-weight:bold;' +\r\n                        'cursor:pointer;z-index:10;transition:all 0.3s ease;', {\r\n                            class: 'play-fullscreen-btn',\r\n                            'data-video-src': url,\r\n                            'data-aspect-ratio': String(v.ratio)\r\n                        });\r\n                    btn.textContent = '\u5168\u5c4f\u64ad\u653e';\r\n                    wrapper.appendChild(btn);\r\n\r\n                    return wrapper;\r\n                }\r\n\r\n                function buildCategorySection(cat, isLast, index) {\r\n                    var section = el('div', 'margin-bottom:' + (isLast ? '60' : '80') + 'px;');\r\n                    section.id = 'legco-cat-' + index;\r\n\r\n                    var header = el('div', 'display:flex;align-items:center;gap:16px;margin-bottom:40px;');\r\n\r\n                    var bar = el('span',\r\n                        'display:block;width:5px;height:52px;' +\r\n                        'background:linear-gradient(to bottom,' + cat.colorBar[0] + ',' + cat.colorBar[1] + ');' +\r\n                        'border-radius:3px;flex-shrink:0;');\r\n\r\n                    var titleGroup = el('div', 'text-align:left;');\r\n                    var titleRow = el('div', 'display:flex;align-items:center;gap:12px;flex-wrap:wrap;');\r\n\r\n                    var h3 = el('h3', 'font-size:26px;font-weight:800;color:#1a1a2e;margin:0;letter-spacing:3px;');\r\n                    h3.textContent = cat.title;\r\n\r\n                    var totalVideos = cat.subCategories\r\n                        ? cat.subCategories.reduce(function(s, sc) { return s + (sc.videos ? sc.videos.length : 0); }, 0)\r\n                        : (cat.videos ? cat.videos.length : 0);\r\n\r\n                    var badge = el('span',\r\n                        'font-size:12px;font-weight:700;padding:3px 12px;border-radius:20px;' +\r\n                        'white-space:nowrap;letter-spacing:0;color:#fff;background:' + cat.colorBadge + ';');\r\n                    badge.textContent = totalVideos + ' \u5f71\u7247';\r\n\r\n                    titleRow.appendChild(h3);\r\n                    titleRow.appendChild(badge);\r\n                    titleGroup.appendChild(titleRow);\r\n\r\n                    if (cat.subtitle) {\r\n                        var sub = el('p',\r\n                            'font-size:12px;color:#aaa;margin:6px 0 0;letter-spacing:1.5px;text-transform:uppercase;'\r\n                        );\r\n                        sub.textContent = cat.subtitle;\r\n                        titleGroup.appendChild(sub);\r\n                    }\r\n\r\n                    var rule = el('div', 'flex:1;height:1px;background:linear-gradient(to right,#e0e0e0,transparent);');\r\n\r\n                    header.appendChild(bar);\r\n                    header.appendChild(titleGroup);\r\n                    header.appendChild(rule);\r\n                    section.appendChild(header);\r\n\r\n                    if (cat.subCategories) {\r\n                        cat.subCategories.forEach(function(subCat, si) {\r\n                            var subHeader = el('div', 'margin-bottom:28px;margin-top:' + (si === 0 ? '0' : '48') + 'px;');\r\n                            var subBar = el('span',\r\n                                'display:inline-block;width:4px;height:32px;' +\r\n                                'background:linear-gradient(to bottom,' + subCat.colorBar[0] + ',' + subCat.colorBar[1] + ');' +\r\n                                'border-radius:2px;margin-right:12px;vertical-align:middle;');\r\n                            var subTitle = el('span',\r\n                                'font-size:18px;font-weight:700;color:' + subCat.colorBadge + ';letter-spacing:1px;vertical-align:middle;');\r\n                            subTitle.textContent = subCat.title;\r\n                            var subBadge = el('span',\r\n                                'font-size:11px;font-weight:600;padding:2px 10px;border-radius:14px;margin-left:10px;' +\r\n                                'vertical-align:middle;letter-spacing:0;color:#fff;background:' + subCat.colorBadge + ';');\r\n                            subBadge.textContent = (subCat.videos ? subCat.videos.length : 0) + ' \u7247\u6bb5';\r\n                            subHeader.appendChild(subBar);\r\n                            subHeader.appendChild(subTitle);\r\n                            subHeader.appendChild(subBadge);\r\n                            section.appendChild(subHeader);\r\n\r\n                            var subGrid = el('div', null, { class: 'video-grid' });\r\n                            subGrid.style.cssText = 'display:grid;grid-template-columns:repeat(2,1fr);gap:40px;max-width:100%;';\r\n                            if (subCat.videos && subCat.videos.length > 0) {\r\n                                subCat.videos.forEach(function(v) {\r\n                                    subGrid.appendChild(buildVideoCard(v, false));\r\n                                });\r\n                            } else {\r\n                                var placeholder = el('div',\r\n                                    'text-align:center;padding:40px 0;color:#aaa;font-size:15px;letter-spacing:1px;');\r\n                                placeholder.textContent = '\u656c\u8acb\u671f\u5f85';\r\n                                subGrid.appendChild(placeholder);\r\n                            }\r\n                            section.appendChild(subGrid);\r\n                        });\r\n                    } else if (cat.layout === 'single') {\r\n                        var center = el('div', 'display:flex;justify-content:center;');\r\n                        center.appendChild(buildVideoCard(cat.videos[0], true));\r\n                        section.appendChild(center);\r\n                    } else {\r\n                        var grid = el('div', null, { class: 'video-grid' });\r\n                        grid.style.cssText = 'display:grid;grid-template-columns:repeat(2,1fr);gap:40px;max-width:100%;';\r\n                        if (cat.videos) {\r\n                            cat.videos.forEach(function(v) {\r\n                                grid.appendChild(buildVideoCard(v, false));\r\n                            });\r\n                        }\r\n                        section.appendChild(grid);\r\n                    }\r\n\r\n                    return section;\r\n                }\r\n\r\n                function buildTabsNav() {\r\n                    var wrapper = document.getElementById('legco-tabs-wrapper');\r\n                    VIDEO_CATEGORIES.forEach(function(cat, i) {\r\n                        var btn = el('button', null, {\r\n                            class: 'legco-tab-btn',\r\n                            'data-cat-index': String(i)\r\n                        });\r\n                        btn.style.borderColor = cat.colorBadge;\r\n                        btn.style.color = cat.colorBadge;\r\n\r\n                        var dot = el('span', null, { class: 'legco-tab-dot' });\r\n                        dot.style.background = cat.colorBadge;\r\n                        btn.appendChild(dot);\r\n                        btn.appendChild(document.createTextNode(cat.title));\r\n\r\n                        btn.addEventListener('click', function() {\r\n                            var target = document.getElementById('legco-cat-' + i);\r\n                            if (target) target.scrollIntoView({ behavior: 'smooth', block: 'start' });\r\n                        });\r\n\r\n                        wrapper.appendChild(btn);\r\n                    });\r\n                }\r\n\r\n                function setActiveTab(index) {\r\n                    document.querySelectorAll('.legco-tab-btn').forEach(function(btn, i) {\r\n                        var cat = VIDEO_CATEGORIES[i];\r\n                        if (i === index) {\r\n                            btn.classList.add('is-active');\r\n                            btn.style.background = cat.colorBadge;\r\n                            btn.style.borderColor = cat.colorBadge;\r\n                            btn.style.color = '#fff';\r\n                            btn.querySelector('.legco-tab-dot').style.background = 'rgba(255,255,255,0.7)';\r\n                        } else {\r\n                            btn.classList.remove('is-active');\r\n                            btn.style.background = 'transparent';\r\n                            btn.style.borderColor = cat.colorBadge;\r\n                            btn.style.color = cat.colorBadge;\r\n                            btn.querySelector('.legco-tab-dot').style.background = cat.colorBadge;\r\n                        }\r\n                    });\r\n                }\r\n\r\n                function initActiveTabTracking() {\r\n                    var navH = document.getElementById('legco-tabs-nav').offsetHeight;\r\n                    var observer = new IntersectionObserver(function(entries) {\r\n                        entries.forEach(function(entry) {\r\n                            if (entry.isIntersecting) {\r\n                                setActiveTab(parseInt(entry.target.id.replace('legco-cat-', ''), 10));\r\n                            }\r\n                        });\r\n                    }, {\r\n                        rootMargin: '-' + (navH + 10) + 'px 0px -55% 0px',\r\n                        threshold: 0\r\n                    });\r\n\r\n                    VIDEO_CATEGORIES.forEach(function(_, i) {\r\n                        var sec = document.getElementById('legco-cat-' + i);\r\n                        if (sec) observer.observe(sec);\r\n                    });\r\n                }\r\n\r\n                document.addEventListener('DOMContentLoaded', function() {\r\n                    var container = document.getElementById('legco-video-sections');\r\n\r\n                    VIDEO_CATEGORIES.forEach(function(cat, i) {\r\n                        container.appendChild(buildCategorySection(cat, i === VIDEO_CATEGORIES.length - 1, i));\r\n                    });\r\n\r\n                    buildTabsNav();\r\n                    setActiveTab(0);\r\n\r\n                    var navH = document.getElementById('legco-tabs-nav').offsetHeight;\r\n                    VIDEO_CATEGORIES.forEach(function(_, i) {\r\n                        var sec = document.getElementById('legco-cat-' + i);\r\n                        if (sec) sec.style.scrollMarginTop = (navH + 32) + 'px';\r\n                    });\r\n\r\n                    initActiveTabTracking();\r\n\r\n                    var modal = document.getElementById('videoModal');\r\n                    var modalVideo = document.getElementById('modalVideo');\r\n                    var modalVideoMP4 = document.getElementById('modalVideoMP4');\r\n                    var modalVideoContainer = document.getElementById('modalVideoContainer');\r\n                    var modalContainer = document.getElementById('modalContainer');\r\n                    var closeModalBtn = document.getElementById('closeModal');\r\n                    var modalFullscreenBtn = document.getElementById('modalFullscreenBtn');\r\n                    var modalContainerStyleLandscape =\r\n                        'position:relative;width:90%;max-width:1200px;max-height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center;';\r\n                    var modalContainerStylePortrait =\r\n                        'position:relative;width:auto;max-width:100%;max-height:90vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 12px;box-sizing:border-box;';\r\n\r\n                    function parseReelUrl(embedUrl) {\r\n                        var m = embedUrl.match(\/href=([^&]+)\/);\r\n                        if (m) try { return decodeURIComponent(m[1]); } catch (e) {}\r\n                        return null;\r\n                    }\r\n\r\n                    function openVideoModal(videoSrc, aspectRatio, isMP4) {\r\n                        isMP4 = isMP4 || false;\r\n                        var reelUrl = parseReelUrl(videoSrc);\r\n                        var hintEl = document.getElementById('modalHint');\r\n                        var newTabEl = document.getElementById('modalOpenNewTab');\r\n                        if (reelUrl && newTabEl) {\r\n                            newTabEl.href = reelUrl;\r\n                            hintEl.style.display = 'block';\r\n                        } else {\r\n                            hintEl.style.display = 'none';\r\n                        }\r\n\r\n                        var maxH = window.innerHeight * 0.9;\r\n                        var maxW = window.innerWidth * 0.9;\r\n                        var h, w;\r\n                        if (aspectRatio > 0 && (1 \/ aspectRatio) > 1) {\r\n                            h = maxH;\r\n                            w = h * aspectRatio;\r\n                            if (w > maxW) { w = maxW; h = w \/ aspectRatio; }\r\n                        } else {\r\n                            w = Math.min(maxW, 1200);\r\n                            h = w \/ aspectRatio;\r\n                            if (h > maxH) { h = maxH; w = h * aspectRatio; }\r\n                        }\r\n\r\n                        modalVideoContainer.style.cssText =\r\n                            'position:relative;background:#000;display:flex;align-items:center;justify-content:center;' +\r\n                            'width:' + w + 'px;height:' + h +\r\n                            'px;max-width:100%;max-height:90vh;border-radius:8px;overflow:hidden;';\r\n\r\n                        if (modalContainer) {\r\n                            modalContainer.style.cssText =\r\n                                (aspectRatio > 0 && (1 \/ aspectRatio) > 1)\r\n                                    ? modalContainerStylePortrait\r\n                                    : modalContainerStyleLandscape;\r\n                        }\r\n\r\n                        modal.style.display = 'flex';\r\n                        document.body.style.overflow = 'hidden';\r\n                        if (modalFullscreenBtn) modalFullscreenBtn.textContent = '\u5168\u5c4f';\r\n\r\n                        if (isMP4) {\r\n                            modalVideo.style.display = 'none';\r\n                            modalVideoMP4.style.display = 'block';\r\n                            modalVideoMP4.src = videoSrc;\r\n                            modalVideoMP4.play().catch(function(e) { console.log('MP4 autoplay failed:', e); });\r\n                        } else {\r\n                            modalVideoMP4.style.display = 'none';\r\n                            modalVideo.style.display = 'block';\r\n                            modalVideo.src = videoSrc;\r\n                        }\r\n                    }\r\n\r\n                    function closeVideoModal() {\r\n                        if (document.fullscreenElement) document.exitFullscreen();\r\n                        modal.style.display = 'none';\r\n                        modalVideo.src = 'about:blank';\r\n                        modalVideoMP4.src = '';\r\n                        modalVideoMP4.pause();\r\n                        document.body.style.overflow = '';\r\n                        if (modalContainer) modalContainer.style.cssText = modalContainerStyleLandscape;\r\n                    }\r\n\r\n                    container.addEventListener('click', function(e) {\r\n                        var btn = e.target.closest('.play-fullscreen-btn');\r\n                        if (btn) {\r\n                            e.stopPropagation();\r\n                            openVideoModal(\r\n                                btn.getAttribute('data-video-src'),\r\n                                parseFloat(btn.getAttribute('data-aspect-ratio')) || 1.78,\r\n                                btn.getAttribute('data-is-mp4') === 'true'\r\n                            );\r\n                            return;\r\n                        }\r\n                        var cover = e.target.closest('.video-cover');\r\n                        if (cover) {\r\n                            e.stopPropagation();\r\n                            openVideoModal(\r\n                                cover.getAttribute('data-video-src'),\r\n                                parseFloat(cover.getAttribute('data-aspect-ratio')) || 1.78,\r\n                                false\r\n                            );\r\n                        }\r\n                    });\r\n\r\n                    modalFullscreenBtn.addEventListener('click', function() {\r\n                        if (!document.fullscreenElement) {\r\n                            modalVideoContainer.requestFullscreen()\r\n                                .then(function() { modalFullscreenBtn.textContent = '\u9000\u51fa\u5168\u5c4f'; })\r\n                                .catch(function() { modalFullscreenBtn.textContent = '\u5168\u5c4f'; });\r\n                        } else {\r\n                            document.exitFullscreen();\r\n                            modalFullscreenBtn.textContent = '\u5168\u5c4f';\r\n                        }\r\n                    });\r\n\r\n                    document.addEventListener('fullscreenchange', function() {\r\n                        if (!document.fullscreenElement) modalFullscreenBtn.textContent = '\u5168\u5c4f';\r\n                    });\r\n\r\n                    closeModalBtn.addEventListener('click', closeVideoModal);\r\n                    modal.addEventListener('click', function(e) {\r\n                        if (e.target === modal) closeVideoModal();\r\n                    });\r\n                    document.addEventListener('keydown', function(e) {\r\n                        if (e.key === 'Escape') {\r\n                            if (document.fullscreenElement) document.exitFullscreen();\r\n                            else if (modal.style.display === 'flex') closeVideoModal();\r\n                        }\r\n                    });\r\n                });\r\n            <\/script>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/div>\r\n","protected":false},"excerpt":{"rendered":"<p>\u7acb\u6cd5\u6703\u767c\u8a00 \u5168\u5c4f \u00d7 \u70ba\u907f\u514d\u81ea\u52d5\u64ad\u653e\u975c\u97f3\uff0c\u8acb\u9ede\u64ca\u5f71\u7247\u5167\u64ad\u653e\u9375\u958b\u59cb\u64ad\u653e\uff08\u901a\u5e38\u6703\u6709\u8072\uff09\u3002\u6216 \u5728\u65b0\u5206\u9801\u958b\u555f<\/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-2957","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.klwong.hk\/index.php?rest_route=\/wp\/v2\/pages\/2957","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.klwong.hk\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.klwong.hk\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.klwong.hk\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.klwong.hk\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2957"}],"version-history":[{"count":54,"href":"https:\/\/www.klwong.hk\/index.php?rest_route=\/wp\/v2\/pages\/2957\/revisions"}],"predecessor-version":[{"id":3100,"href":"https:\/\/www.klwong.hk\/index.php?rest_route=\/wp\/v2\/pages\/2957\/revisions\/3100"}],"wp:attachment":[{"href":"https:\/\/www.klwong.hk\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2957"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}