{
  "version": "1.0",
  "timestamp": "2026-01-21T14:55:00.000Z",
  "pageSettings": {
    "title": "Sistem Pengurusan Kontrak (CMS) - Suruhanjaya Koperasi Malaysia",
    "description": "Urus kontrak dengan teratur, selamat dan cekap - Suruhanjaya Koperasi Malaysia",
    "author": "Suruhanjaya Koperasi Malaysia",
    "keywords": "SKM, koperasi, kontrak, hartanah, Malaysia, suruhanjaya koperasi",
    "backgroundColor": "#ffffff",
    "customCSS": ":root {\n    --primary-color: #1e3a8a;\n    --secondary-color: #3b82f6;\n    --accent-color: #10b981;\n}\n\nbody {\n    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n    margin: 0;\n    padding: 0;\n}\n\n.top-bar {\n    background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);\n    padding: 15px 0;\n    color: white;\n    text-align: center;\n}\n\n.top-bar h1 {\n    font-size: 1.5rem;\n    margin: 0 0 10px 0;\n    font-weight: bold;\n    letter-spacing: 0.5px;\n}\n\n.top-bar .login-links {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: 10px;\n    flex-wrap: wrap;\n}\n\n.top-bar .login-links a {\n    color: white;\n    text-decoration: none;\n    padding: 8px 20px;\n    border: 2px solid white;\n    border-radius: 5px;\n    transition: all 0.3s;\n    font-weight: 500;\n}\n\n.top-bar .login-links a:hover {\n    background: white;\n    color: #1e3a8a;\n    transform: scale(1.05);\n}\n\n.navbar {\n    background: white;\n    box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n    padding: 10px 0;\n}\n\n.navbar-brand {\n    display: flex;\n    align-items: center;\n    gap: 15px;\n}\n\n.navbar-brand img {\n    max-height: 70px;\n}\n\n.navbar-brand .brand-text {\n    display: flex;\n    flex-direction: column;\n}\n\n.navbar-brand .brand-text h4 {\n    margin: 0;\n    color: #1e3a8a;\n    font-size: 1.2rem;\n    font-weight: bold;\n}\n\n.navbar-brand .brand-text p {\n    margin: 0;\n    color: #6b7280;\n    font-size: 0.85rem;\n}\n\n.navbar-nav .nav-link {\n    color: #333;\n    font-weight: 500;\n    padding: 10px 15px;\n    transition: all 0.3s;\n}\n\n.navbar-nav .nav-link:hover {\n    color: #3b82f6;\n    background: #f3f4f6;\n    border-radius: 5px;\n}\n\n.hero-slider {\n    position: relative;\n    margin-top: 0;\n}\n\n.hero-slider .carousel-item img {\n    width: 100%;\n    height: 500px;\n    object-fit: cover;\n}\n\n.hero-slider .carousel-caption {\n    background: rgba(30, 58, 138, 0.8);\n    padding: 20px;\n    border-radius: 10px;\n}\n\n.latest-news {\n    background: #fef3c7;\n    padding: 20px;\n    margin: 30px 0;\n    border-left: 5px solid #f59e0b;\n    border-radius: 8px;\n}\n\n.latest-news h4 {\n    color: #d97706;\n    font-weight: bold;\n    margin-bottom: 10px;\n    font-size: 1.3rem;\n}\n\n.latest-news p {\n    color: #92400e;\n    margin: 0;\n    line-height: 1.6;\n}\n\n.section-title {\n    text-align: center;\n    margin: 50px 0 30px;\n}\n\n.section-title h4 {\n    color: #1e3a8a;\n    font-weight: bold;\n    font-size: 1.8rem;\n    border-bottom: 3px solid #3b82f6;\n    display: inline-block;\n    padding-bottom: 10px;\n}\n\n.section-subtitle {\n    text-align: center;\n    color: #6b7280;\n    margin-bottom: 30px;\n    font-size: 1rem;\n}\n\n.property-card {\n    border: 1px solid #e5e7eb;\n    border-radius: 10px;\n    padding: 20px;\n    margin-bottom: 30px;\n    box-shadow: 0 2px 10px rgba(0,0,0,0.05);\n    transition: all 0.3s;\n    background: white;\n}\n\n.property-card:hover {\n    box-shadow: 0 10px 30px rgba(0,0,0,0.1);\n    transform: translateY(-5px);\n}\n\n.property-card h5 {\n    color: #1e3a8a;\n    font-weight: bold;\n    margin-bottom: 15px;\n    font-size: 1.3rem;\n}\n\n.property-card .property-type {\n    display: inline-block;\n    background: #dbeafe;\n    color: #1e40af;\n    padding: 5px 15px;\n    border-radius: 20px;\n    font-size: 0.85rem;\n    font-weight: 600;\n    margin-bottom: 15px;\n}\n\n.property-card h6 {\n    color: #6b7280;\n    font-size: 0.9rem;\n    margin-top: 15px;\n    margin-bottom: 5px;\n    font-weight: 600;\n}\n\n.property-card .price {\n    color: #10b981;\n    font-size: 1.8rem;\n    font-weight: bold;\n    margin: 20px 0;\n}\n\n.property-card .property-details {\n    color: #6b7280;\n    font-size: 0.95rem;\n    line-height: 1.8;\n}\n\n.property-card .btn-book {\n    background: #3b82f6;\n    color: white;\n    border: none;\n    padding: 10px 25px;\n    border-radius: 5px;\n    text-decoration: none;\n    display: inline-block;\n    transition: all 0.3s;\n    font-weight: 600;\n}\n\n.property-card .btn-book:hover {\n    background: #1e3a8a;\n    transform: scale(1.05);\n}\n\n.property-card .contact-info {\n    font-size: 0.85rem;\n    color: #6b7280;\n    margin-top: 15px;\n    padding-top: 15px;\n    border-top: 1px solid #e5e7eb;\n}\n\n.service-card {\n    text-align: center;\n    padding: 30px 20px;\n    border: 1px solid #e5e7eb;\n    border-radius: 10px;\n    margin-bottom: 30px;\n    transition: all 0.3s;\n    text-decoration: none;\n    display: block;\n    background: white;\n    height: 100%;\n}\n\n.service-card:hover {\n    box-shadow: 0 10px 30px rgba(0,0,0,0.1);\n    transform: translateY(-5px);\n    border-color: #3b82f6;\n}\n\n.service-card .service-icon {\n    width: 80px;\n    height: 80px;\n    margin: 0 auto 20px;\n    background: linear-gradient(135deg, #3b82f6 0%, #1e3a8a 100%);\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 2rem;\n    color: white;\n}\n\n.service-card h6 {\n    color: #1e3a8a;\n    font-weight: 600;\n    margin-top: 15px;\n    font-size: 1rem;\n}\n\nfooter {\n    background: #1f2937;\n    color: white;\n    padding: 50px 0 20px;\n    margin-top: 50px;\n}\n\nfooter h6 {\n    color: #fff;\n    font-weight: bold;\n    margin-bottom: 20px;\n    border-bottom: 2px solid #3b82f6;\n    padding-bottom: 10px;\n    font-size: 1.1rem;\n}\n\nfooter ul {\n    list-style: none;\n    padding: 0;\n    margin: 0;\n}\n\nfooter ul li {\n    margin-bottom: 10px;\n    line-height: 1.6;\n}\n\nfooter a {\n    color: #d1d5db;\n    text-decoration: none;\n    transition: all 0.3s;\n}\n\nfooter a:hover {\n    color: #3b82f6;\n    padding-left: 5px;\n}\n\n.footer-bottom {\n    background: #111827;\n    padding: 20px 0;\n    margin-top: 30px;\n    text-align: center;\n    border-top: 1px solid #374151;\n}\n\n.footer-bottom p {\n    margin: 5px 0;\n    color: #9ca3af;\n    font-size: 0.9rem;\n}\n\n.w3c-widget {\n    position: fixed;\n    right: 0;\n    top: 50%;\n    transform: translateY(-50%);\n    background: white;\n    padding: 15px 10px;\n    border-radius: 10px 0 0 10px;\n    box-shadow: -2px 0 10px rgba(0,0,0,0.2);\n    z-index: 999;\n}\n\n.w3c-widget h6 {\n    font-size: 11px;\n    font-weight: bold;\n    margin-bottom: 10px;\n    color: #1e3a8a;\n    text-align: center;\n}\n\n.w3c-widget .widget-section {\n    margin-bottom: 15px;\n}\n\n.w3c-widget .widget-label {\n    font-size: 10px;\n    margin-bottom: 5px;\n    color: #6b7280;\n    text-align: center;\n}\n\n.w3c-widget button {\n    display: block;\n    width: 35px;\n    margin: 5px auto;\n    padding: 5px;\n    border: 1px solid #d1d5db;\n    background: white;\n    cursor: pointer;\n    border-radius: 4px;\n    transition: all 0.2s;\n    font-weight: bold;\n}\n\n.w3c-widget button:hover {\n    border-color: #3b82f6;\n    background: #eff6ff;\n}",
    "customJS": "",
    "externalCSS": [],
    "externalJS": []
  },
  "components": [
    {
      "id": "topbar-skm-1",
      "type": "custom-code",
      "html": "<section class=\"top-bar\">\n    <div class=\"container\">\n        <h1>URUS KONTRAK DENGAN TERATUR, SELAMAT DAN CEKAP</h1>\n        <div class=\"login-links\">\n            <a href=\"#\">LOG MASUK</a>\n            <span style=\"color: white; margin: 0 5px;\">|</span>\n            <a href=\"#\">DAFTAR PENGGUNA</a>\n        </div>\n    </div>\n</section>",
      "customHTML": "<section class=\"top-bar\">\n    <div class=\"container\">\n        <h1>URUS KONTRAK DENGAN TERATUR, SELAMAT DAN CEKAP</h1>\n        <div class=\"login-links\">\n            <a href=\"#\">LOG MASUK</a>\n            <span style=\"color: white; margin: 0 5px;\">|</span>\n            <a href=\"#\">DAFTAR PENGGUNA</a>\n        </div>\n    </div>\n</section>",
      "styles": {},
      "name": "Top Bar - Login",
      "position": 0
    },
    {
      "id": "navbar-skm-2",
      "type": "custom-code",
      "html": "<nav class=\"navbar navbar-expand-lg\">\n    <div class=\"container\">\n        <a class=\"navbar-brand\" href=\"#\">\n            <img src=\"https://skm.dynaweb4.work/assets/portal/images/logo_skm.png\" alt=\"SKM Logo\" onerror=\"this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAiIGhlaWdodD0iNzAiIHZpZXdCb3g9IjAgMCAxMDAgNzAiPjxyZWN0IHdpZHRoPSIxMDAiIGhlaWdodD0iNzAiIGZpbGw9IiMxZTNhOGEiLz48dGV4dCB4PSI1MCIgeT0iNDAiIGZvbnQtZmFtaWx5PSJBcmlhbCIgZm9udC1zaXplPSIyMCIgZm9udC13ZWlnaHQ9ImJvbGQiIGZpbGw9IndoaXRlIiB0ZXh0LWFuY2hvcj0ibWlkZGxlIj5TS008L3RleHQ+PC9zdmc+'\">\n            <div class=\"brand-text\">\n                <h4>Sistem Pengurusan Kontrak</h4>\n                <p>Suruhanjaya Koperasi Malaysia (SKM)</p>\n            </div>\n        </a>\n        <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarNav\">\n            <span class=\"navbar-toggler-icon\"></span>\n        </button>\n        <div class=\"collapse navbar-collapse\" id=\"navbarNav\">\n            <ul class=\"navbar-nav ms-auto\">\n                <li class=\"nav-item\"><a class=\"nav-link\" href=\"#\">Utama</a></li>\n                <li class=\"nav-item\"><a class=\"nav-link\" href=\"#\">Mengenai Kami</a></li>\n                <li class=\"nav-item\"><a class=\"nav-link\" href=\"#\">Hartanah</a></li>\n                <li class=\"nav-item dropdown\">\n                    <a class=\"nav-link dropdown-toggle\" href=\"#\" data-bs-toggle=\"dropdown\">Hubungi Kami</a>\n                    <ul class=\"dropdown-menu\">\n                        <li><a class=\"dropdown-item\" href=\"#\">Alamat</a></li>\n                        <li><a class=\"dropdown-item\" href=\"#\">Borang</a></li>\n                    </ul>\n                </li>\n            </ul>\n        </div>\n    </div>\n</nav>",
      "customHTML": "<nav class=\"navbar navbar-expand-lg\">\n    <div class=\"container\">\n        <a class=\"navbar-brand\" href=\"#\">\n            <img src=\"https://skm.dynaweb4.work/assets/portal/images/logo_skm.png\" alt=\"SKM Logo\" onerror=\"this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAiIGhlaWdodD0iNzAiIHZpZXdCb3g9IjAgMCAxMDAgNzAiPjxyZWN0IHdpZHRoPSIxMDAiIGhlaWdodD0iNzAiIGZpbGw9IiMxZTNhOGEiLz48dGV4dCB4PSI1MCIgeT0iNDAiIGZvbnQtZmFtaWx5PSJBcmlhbCIgZm9udC1zaXplPSIyMCIgZm9udC13ZWlnaHQ9ImJvbGQiIGZpbGw9IndoaXRlIiB0ZXh0LWFuY2hvcj0ibWlkZGxlIj5TS008L3RleHQ+PC9zdmc+'\">\n            <div class=\"brand-text\">\n                <h4>Sistem Pengurusan Kontrak</h4>\n                <p>Suruhanjaya Koperasi Malaysia (SKM)</p>\n            </div>\n        </a>\n        <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarNav\">\n            <span class=\"navbar-toggler-icon\"></span>\n        </button>\n        <div class=\"collapse navbar-collapse\" id=\"navbarNav\">\n            <ul class=\"navbar-nav ms-auto\">\n                <li class=\"nav-item\"><a class=\"nav-link\" href=\"#\">Utama</a></li>\n                <li class=\"nav-item\"><a class=\"nav-link\" href=\"#\">Mengenai Kami</a></li>\n                <li class=\"nav-item\"><a class=\"nav-link\" href=\"#\">Hartanah</a></li>\n                <li class=\"nav-item dropdown\">\n                    <a class=\"nav-link dropdown-toggle\" href=\"#\" data-bs-toggle=\"dropdown\">Hubungi Kami</a>\n                    <ul class=\"dropdown-menu\">\n                        <li><a class=\"dropdown-item\" href=\"#\">Alamat</a></li>\n                        <li><a class=\"dropdown-item\" href=\"#\">Borang</a></li>\n                    </ul>\n                </li>\n            </ul>\n        </div>\n    </div>\n</nav>",
      "styles": {},
      "name": "Navigation Bar",
      "position": 1
    },
    {
      "id": "hero-slider-3",
      "type": "carousel",
      "html": "<div id=\"heroCarousel\" class=\"carousel slide hero-slider\" data-bs-ride=\"carousel\">\n    <div class=\"carousel-indicators\">\n        <button type=\"button\" data-bs-target=\"#heroCarousel\" data-bs-slide-to=\"0\" class=\"active\"></button>\n    </div>\n    <div class=\"carousel-inner\">\n        <div class=\"carousel-item active\">\n            <img src=\"https://skm.dynaweb4.work/assets/portal/images/slider1.jpg\" alt=\"SKM Building\" class=\"d-block w-100\" onerror=\"this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAwIiBoZWlnaHQ9IjUwMCIgdmlld0JveD0iMCAwIDEyMDAgNTAwIj48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9ImciIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMTAwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0eWxlPSJzdG9wLWNvbG9yOiMxZTNhOGE7c3RvcC1vcGFjaXR5OjEiIC8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdHlsZT0ic3RvcC1jb2xvcjojM2I4MmY2O3N0b3Atb3BhY2l0eToxIiAvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHdpZHRoPSIxMjAwIiBoZWlnaHQ9IjUwMCIgZmlsbD0idXJsKCNnKSIvPjx0ZXh0IHg9IjYwMCIgeT0iMjYwIiBmb250LWZhbWlseT0iQXJpYWwiIGZvbnQtc2l6ZT0iNDgiIGZvbnQtd2VpZ2h0PSJib2xkIiBmaWxsPSJ3aGl0ZSIgdGV4dC1hbmNob3I9Im1pZGRsZSI+U2lzdGVtIFBlbmd1cnVzYW4gS29udHJhazwvdGV4dD48L3N2Zz4='\">\n            <div class=\"carousel-caption d-none d-md-block\">\n                <h5>Selamat Datang ke Sistem Pengurusan Kontrak</h5>\n                <p>Suruhanjaya Koperasi Malaysia</p>\n            </div>\n        </div>\n    </div>\n</div>",
      "customHTML": "",
      "styles": {},
      "carouselSlides": [],
      "showCarouselControls": false,
      "showCarouselIndicators": true,
      "name": "Hero Slider",
      "position": 2
    },
    {
      "id": "latest-news-4",
      "type": "custom-code",
      "html": "<section class=\"container\">\n    <div class=\"latest-news\">\n        <h4>🔔 TERKINI</h4>\n        <p>Selamat datang ke Sistem Pengurusan Kontrak Suruhanjaya Koperasi Malaysia. Sila daftar sebagai pengguna untuk menggunakan kemudahan sistem kami.</p>\n    </div>\n</section>",
      "customHTML": "<section class=\"container\">\n    <div class=\"latest-news\">\n        <h4>🔔 TERKINI</h4>\n        <p>Selamat datang ke Sistem Pengurusan Kontrak Suruhanjaya Koperasi Malaysia. Sila daftar sebagai pengguna untuk menggunakan kemudahan sistem kami.</p>\n    </div>\n</section>",
      "styles": {},
      "name": "Latest News Banner",
      "position": 3
    },
    {
      "id": "properties-section-5",
      "type": "custom-code",
      "html": "<section class=\"container\">\n    <div class=\"section-title\">\n        <h4>Hartanah Terkini</h4>\n    </div>\n    <p class=\"section-subtitle\">Senarai hartanah yang tersedia untuk disewa</p>\n    <div class=\"row\">\n        <div class=\"col-md-4\">\n            <div class=\"property-card\">\n                <img src=\"https://skm.dynaweb4.work/assets/portal/images/property1.jpg\" alt=\"Menara Koperasi\" class=\"img-fluid rounded mb-3\" onerror=\"this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MDAiIGhlaWdodD0iMzAwIiB2aWV3Qm94PSIwIDAgNDAwIDMwMCI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJnIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdHlsZT0ic3RvcC1jb2xvcjojZTVlN2ViO3N0b3Atb3BhY2l0eToxIiAvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2Q2ZDhlMTtzdG9wLW9wYWNpdHk6MSIgLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB3aWR0aD0iNDAwIiBoZWlnaHQ9IjMwMCIgZmlsbD0idXJsKCNnKSIvPjxyZWN0IHg9IjEwMCIgeT0iODAiIHdpZHRoPSIyMDAiIGhlaWdodD0iMTYwIiBmaWxsPSIjMWUzYThhIiBvcGFjaXR5PSIwLjEiIHJ4PSI1Ii8+PHRleHQgeD0iMjAwIiB5PSIxNzAiIGZvbnQtZmFtaWx5PSJBcmlhbCIgZm9udC1zaXplPSIyNCIgZm9udC13ZWlnaHQ9ImJvbGQiIGZpbGw9IiMxZTNhOGEiIHRleHQtYW5jaG9yPSJtaWRkbGUiPvCfjow8L3RleHQ+PC9zdmc+'\">\n                <span class=\"property-type\">🏢 Bangunan</span>\n                <h5>Menara Koperasi KL</h5>\n                <h6>📍 Lokasi:</h6>\n                <p class=\"property-details\">Changkat Semantan, Off Jalan Semantan<br>Bukit Damansara, 50490 Kuala Lumpur</p>\n                <h6>💰 Harga Sewa:</h6>\n                <div class=\"price\">RM 100<span style=\"font-size: 1rem; color: #6b7280;\">/50 kaki persegi</span></div>\n                <a href=\"#\" class=\"btn-book\">Buat Tempahan</a>\n                <div class=\"contact-info\">\n                    <strong>Maklumat Lanjut:</strong><br>\n                    📧 web_master[at]skm[dot]gov[dot]my<br>\n                    📞 +603-2083 4000\n                </div>\n            </div>\n        </div>\n        <div class=\"col-md-4\">\n            <div class=\"property-card\">\n                <img src=\"https://skm.dynaweb4.work/assets/portal/images/property2.jpg\" alt=\"Sentral Business\" class=\"img-fluid rounded mb-3\" onerror=\"this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MDAiIGhlaWdodD0iMzAwIiB2aWV3Qm94PSIwIDAgNDAwIDMwMCI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJnIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdHlsZT0ic3RvcC1jb2xvcjojZjNmNGY2O3N0b3Atb3BhY2l0eToxIiAvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2RiZGVlMjtzdG9wLW9wYWNpdHk6MSIgLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB3aWR0aD0iNDAwIiBoZWlnaHQ9IjMwMCIgZmlsbD0idXJsKCNnKSIvPjxyZWN0IHg9IjgwIiB5PSI2MCIgd2lkdGg9IjI0MCIgaGVpZ2h0PSIxODAiIGZpbGw9IiMzYjgyZjYiIG9wYWNpdHk9IjAuMSIgcng9IjUiLz48dGV4dCB4PSIyMDAiIHk9IjE3MCIgZm9udC1mYW1pbHk9IkFyaWFsIiBmb250LXNpemU9IjI0IiBmb250LXdlaWdodD0iYm9sZCIgZmlsbD0iIzNiODJmNiIgdGV4dC1hbmNob3I9Im1pZGRsZSI+8J+Pog==PC90ZXh0Pjwvc3ZnPg=='\">\n                <span class=\"property-type\">🏢 Ruang Pejabat</span>\n                <h5>Sentral Business Suites</h5>\n                <h6>📍 Lokasi:</h6>\n                <p class=\"property-details\">Selangor</p>\n                <h6>💰 Harga Sewa:</h6>\n                <div class=\"price\">RM 1,550<span style=\"font-size: 1rem; color: #6b7280;\">/500 kaki persegi</span></div>\n                <a href=\"#\" class=\"btn-book\">Buat Tempahan</a>\n                <div class=\"contact-info\">\n                    <strong>Maklumat Lanjut:</strong><br>\n                    📧 web_master[at]skm[dot]gov[dot]my<br>\n                    📞 +603-2083 4000\n                </div>\n            </div>\n        </div>\n        <div class=\"col-md-4\">\n            <div class=\"property-card\">\n                <img src=\"https://skm.dynaweb4.work/assets/portal/images/property3.jpg\" alt=\"Pangsapuri Delima\" class=\"img-fluid rounded mb-3\" onerror=\"this.src='data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MDAiIGhlaWdodD0iMzAwIiB2aWV3Qm94PSIwIDAgNDAwIDMwMCI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJnIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdHlsZT0ic3RvcC1jb2xvcjojZmVmM2M3O3N0b3Atb3BhY2l0eToxIiAvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2ZhZTU5NztzdG9wLW9wYWNpdHk6MSIgLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB3aWR0aD0iNDAwIiBoZWlnaHQ9IjMwMCIgZmlsbD0idXJsKCNnKSIvPjxyZWN0IHg9IjkwIiB5PSI3MCIgd2lkdGg9IjIyMCIgaGVpZ2h0PSIxNjAiIGZpbGw9IiNmNTllMGIiIG9wYWNpdHk9IjAuMiIgcng9IjUiLz48dGV4dCB4PSIyMDAiIHk9IjE3MCIgZm9udC1mYW1pbHk9IkFyaWFsIiBmb250LXNpemU9IjI0IiBmb250LXdlaWdodD0iYm9sZCIgZmlsbD0iI2Q5NzcwNiIgdGV4dC1hbmNob3I9Im1pZGRsZSI+8J+PoTwvdGV4dD48L3N2Zz4='\">\n                <span class=\"property-type\">🏡 Kuarters</span>\n                <h5>Pangsapuri Delima U8</h5>\n                <h6>📍 Lokasi:</h6>\n                <p class=\"property-details\">Shah Alam, Selangor</p>\n                <h6>💰 Harga Sewa:</h6>\n                <div class=\"price\">RM 700<span style=\"font-size: 1rem; color: #6b7280;\">/1000 kaki persegi</span></div>\n                <a href=\"#\" class=\"btn-book\">Buat Tempahan</a>\n                <div class=\"contact-info\">\n                    <strong>Maklumat Lanjut:</strong><br>\n                    📧 web_master[at]skm[dot]gov[dot]my<br>\n                    📞 +603-2083 4000\n                </div>\n            </div>\n        </div>\n    </div>\n</section>",
      "customHTML": "",
      "styles": {},
      "name": "Properties Section",
      "position": 4
    },
    {
      "id": "services-section-6",
      "type": "custom-code",
      "html": "<section class=\"container\">\n    <div class=\"section-title\">\n        <h4>Perkhidmatan Utama</h4>\n    </div>\n    <p class=\"section-subtitle\">Berikut adalah senarai perkhidmatan atas talian yang disediakan oleh Suruhanjaya Koperasi Malaysia</p>\n    <div class=\"row\">\n        <div class=\"col-md-3\">\n            <a href=\"#\" class=\"service-card\">\n                <div class=\"service-icon\">📋</div>\n                <h6>Permohonan Penubuhan Koperasi</h6>\n            </a>\n        </div>\n        <div class=\"col-md-3\">\n            <a href=\"#\" class=\"service-card\">\n                <div class=\"service-icon\">🔍</div>\n                <h6>Sistem Carian Koperasi</h6>\n            </a>\n        </div>\n        <div class=\"col-md-3\">\n            <a href=\"#\" class=\"service-card\">\n                <div class=\"service-icon\">📝</div>\n                <h6>Sistem E-Daftar Online</h6>\n            </a>\n        </div>\n        <div class=\"col-md-3\">\n            <a href=\"#\" class=\"service-card\">\n                <div class=\"service-icon\">⚡</div>\n                <h6>Permohonan Bantuan Pembangunan Koperasi (e-FAST)</h6>\n            </a>\n        </div>\n    </div>\n</section>",
      "customHTML": "",
      "styles": {},
      "name": "Services Section",
      "position": 5
    },
    {
      "id": "footer-skm-7",
      "type": "custom-code",
      "html": "<footer>\n    <div class=\"container\">\n        <div class=\"row\">\n            <div class=\"col-md-3\">\n                <h6>HUBUNGI KAMI</h6>\n                <ul>\n                    <li>Menara Suruhanjaya Koperasi Malaysia</li>\n                    <li>Changkat Semantan</li>\n                    <li>Off Jalan Semantan, Bukit Damansara</li>\n                    <li>50490 Kuala Lumpur</li>\n                    <li style=\"margin-top: 15px;\">✉️ web_master[at]skm[dot]gov[dot]my</li>\n                    <li>📞 +603-2083 4000</li>\n                    <li>📠 +603-2083 4100</li>\n                </ul>\n            </div>\n            <div class=\"col-md-3\">\n                <h6>SAMBUNGAN</h6>\n                <ul>\n                    <li><a href=\"https://skm.gov.my\" target=\"_blank\">Suruhanjaya Koperasi Malaysia</a></li>\n                    <li><a href=\"#\">KUSKOP</a></li>\n                    <li><a href=\"https://www.malaysia.gov.my\" target=\"_blank\">MyGovernment</a></li>\n                    <li><a href=\"#\">IKMA</a></li>\n                    <li><a href=\"https://www.smecorp.gov.my\" target=\"_blank\">SME Corp Malaysia</a></li>\n                    <li><a href=\"https://www.tekun.gov.my\" target=\"_blank\">Tekun Nasional</a></li>\n                </ul>\n            </div>\n            <div class=\"col-md-3\">\n                <h6>PAUTAN LAIN</h6>\n                <ul>\n                    <li><a href=\"#\">Penafian</a></li>\n                    <li><a href=\"#\">Dasar Privasi</a></li>\n                    <li><a href=\"#\">Dasar Keselamatan</a></li>\n                    <li><a href=\"#\">Perlindungan Data Peribadi</a></li>\n                    <li><a href=\"#\">Soalan Lazim (FAQ)</a></li>\n                </ul>\n            </div>\n            <div class=\"col-md-3\">\n                <h6>STATISTIK PELAWAT</h6>\n                <ul>\n                    <li>📅 Hari Ini : 2</li>\n                    <li>📆 Minggu Ini : 3</li>\n                    <li>📊 Bulan Ini : 28</li>\n                    <li>📈 Tahun Ini : 28</li>\n                    <li>💯 Jumlah : 1,503</li>\n                </ul>\n            </div>\n        </div>\n    </div>\n    <div class=\"footer-bottom\">\n        <div class=\"container\">\n            <p>Paparan terbaik menggunakan pelayar Mozilla Firefox dan Google Chrome dengan resolusi skrin 1366x768.</p>\n            <p>Hakcipta Terpelihara © 2025 Suruhanjaya Koperasi Malaysia</p>\n        </div>\n    </div>\n</footer>",
      "customHTML": "",
      "styles": {},
      "name": "Footer",
      "position": 6
    },
    {
      "id": "w3c-widget-8",
      "type": "custom-code",
      "html": "<div class=\"w3c-widget\">\n    <h6>Pilihan W3C</h6>\n    <div class=\"widget-section\">\n        <div class=\"widget-label\">Warna Teks</div>\n        <button style=\"background: #000; color: white;\" onclick=\"document.body.style.color='#000'\">A</button>\n        <button style=\"background: #333; color: white;\" onclick=\"document.body.style.color='#333'\">A</button>\n        <button style=\"background: #666; color: white;\" onclick=\"document.body.style.color='#666'\">A</button>\n        <button style=\"background: #999; color: white;\" onclick=\"document.body.style.color='#999'\">A</button>\n    </div>\n    <div class=\"widget-section\">\n        <div class=\"widget-label\">Saiz Teks</div>\n        <button onclick=\"document.body.style.fontSize='18px'\">A+</button>\n        <button onclick=\"document.body.style.fontSize='16px'\">A</button>\n        <button onclick=\"document.body.style.fontSize='14px'\">A-</button>\n    </div>\n</div>",
      "customHTML": "",
      "styles": {},
      "name": "W3C Accessibility Widget",
      "position": 7
    }
  ]
}