Our Worlds | MetaSkool<\/title>\n \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=Montserrat:wght@400;500;600;700&family=Roboto:wght@300;400;500;700&display=swap\" rel=\"stylesheet\">\n \n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\" media=\"print\" onload=\"this.media='all'\">\n \n <link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@4.6.2\/dist\/css\/bootstrap.min.css\">\n <style>\n \/* MetaSkool header styles (responsive with hamburger) *\/\n\t.metaskool-site-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0.6rem 1rem;background:linear-gradient(90deg,var(--ukm-blue),#004080);color:#fff;position:relative}\n\t.metaskool-site-header .brand{display:flex;align-items:center;gap:0.75rem}\n\t.metaskool-site-header .brand img{height:44px;width:auto}\n\t.metaskool-site-header h1{font-size:1.05rem;margin:0;color:#fff;font-family:'Montserrat',sans-serif}\n\t.metaskool-site-header .site-nav{display:flex;gap:0.5rem;align-items:center}\n\t.metaskool-site-header .site-nav a{color:#fff;text-decoration:none;padding:0.45rem 0.6rem;border-radius:6px;font-weight:600}\n\t.metaskool-site-header .site-nav a:hover{background:rgba(255,255,255,0.08)}\n\t.menu-toggle{display:none;background:transparent;border:none;color:#fff;width:44px;height:44px;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}\n\t.menu-toggle .hamburger{display:block;width:20px;height:2px;background:#fff;position:relative}\n\t.menu-toggle .hamburger::before,.menu-toggle .hamburger::after{content:'';position:absolute;left:0;right:0;height:2px;background:#fff}\n\t.menu-toggle .hamburger::before{top:-6px}.menu-toggle .hamburger::after{top:6px}\n\t@media(max-width:768px){\n\t\t.metaskool-site-header{padding:0.75rem 1rem;align-items:flex-start}\n\t\t.metaskool-site-header .brand{flex-direction:column;align-items:center;gap:0.5rem;text-align:center}\n\t\t.metaskool-site-header .brand img{height:36px}\n\t\t.metaskool-site-header h1{font-size:0.9rem;line-height:1.2}\n\t\t.menu-toggle{display:flex;position:absolute;top:0.75rem;right:1rem}\n\t\t.metaskool-site-header .site-nav{position:absolute;left:0;right:0;top:100%;background:linear-gradient(180deg,var(--ukm-blue),#003355);flex-direction:column;display:none;padding:0.25rem 0}\n\t\t.metaskool-site-header .site-nav.open{display:flex}\n\t\t.metaskool-site-header .site-nav a{padding:0.75rem 1rem;border-radius:0;border-bottom:1px solid rgba(255,255,255,0.06)}\n\t}\n :root {\n --ukm-blue: #003366;\n --ukm-red: #c00;\n --ukm-light-blue: #007bff;\n --light-gray: #f8f9fa;\n --medium-gray: #e9ecef;\n --dark-gray: #495057;\n --spacing-xs: 0.5rem;\n --spacing-sm: 1rem;\n --spacing-md: 2rem;\n --spacing-lg: 4rem;\n --section-bg-1: #ffffff;\n --section-bg-2: #f8f9fa;\n --card-hover-bg: #ffffff;\n }\n \n body {\n background: #fff;\n font-family: 'Roboto', Arial, sans-serif;\n color: #333;\n margin: 0;\n padding: 0;\n }\n\n .metaskool-container {\n padding: 4rem 0;\n background: #ffffff;\n position: relative;\n max-width:1200px; \n margin:0 auto;\n }\n\n .metaskool-container::before {\n display: none;\n }\n\n .metaskool-header {\n text-align: center;\n margin-bottom: 4rem;\n }\n\n .metaskool-header h1 {\n position: relative;\n font-family: 'Montserrat', sans-serif;\n font-size: 2.8rem;\n font-weight: 700;\n color: var(--ukm-blue);\n margin-bottom: 2rem;\n padding-bottom: 1rem;\n text-shadow: 1px 1px 1px rgba(0,0,0,0.1);\n }\n\n .metaskool-header h1:after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n width: 80px;\n height: 3px;\n background: linear-gradient(to right, var(--ukm-blue), var(--ukm-red));\n }\n\n .metaskool-worlds-grid {\n max-width: 1200px;\n margin: 0 auto;\n padding: 0 1rem;\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 2rem;\n }\n\n .metaskool-world-card {\n background: white;\n border-radius: 4px;\n overflow: hidden;\n box-shadow: 0 3px 10px rgba(0,0,0,0.1);\n transition: all 0.3s ease;\n border: 1px solid rgba(0,51,102,0.1);\n box-sizing: border-box;\n }\n\n .metaskool-world-card:hover {\n transform: translateY(-8px);\n box-shadow: 0 12px 20px rgba(0,0,0,0.15);\n background: var(--card-hover-bg);\n border-color: var(--ukm-red);\n }\n\n .metaskool-world-image {\n width: 100%;\n height: 250px;\n object-fit: cover;\n }\n\n .metaskool-world-content {\n padding: 1.5rem;\n display: flex;\n flex-direction: column;\n min-height: auto;\n box-sizing: border-box;\n }\n\n .metaskool-world-title {\n font-family: 'Montserrat', sans-serif;\n font-size: 1.3rem;\n font-weight: 600;\n color: var(--ukm-blue);\n margin-bottom: 0.75rem;\n }\n\n .metaskool-world-creator {\n display: inline-block;\n background: var(--ukm-blue);\n color: white;\n font-size: clamp(0.7rem, 2.5vw, 0.9rem);\n padding: 0.5rem 1.2rem;\n border-radius: 50px;\n margin-bottom: 1rem;\n line-height: 1.4;\n max-width: 100%;\n white-space: normal;\n text-align: center;\n box-shadow: 0 2px 4px rgba(0, 51, 102, 0.1);\n }\n\n \/* Additional rule for very long creator names *\/\n .metaskool-world-creator:has(span) {\n font-size: 0.75rem;\n padding: 0.4rem 1rem;\n }\n\n .metaskool-world-description {\n color: var(--dark-gray);\n font-size: 0.95rem;\n line-height: 1.6;\n margin-bottom: 1.5rem;\n flex-grow: 1;\n }\n\n .metaskool-play-button {\n display: flex;\n align-items: center;\n justify-content: center;\n width: calc(100% - 0px);\n background: linear-gradient(45deg, var(--ukm-blue) 0%, var(--ukm-light-blue) 100%);\n color: white;\n text-decoration: none;\n padding: 0.75rem 1.5rem;\n border-radius: 50px;\n font-weight: 500;\n transition: all 0.3s ease;\n box-shadow: 0 2px 5px rgba(0, 51, 102, 0.2);\n border: none;\n cursor: pointer;\n gap: 0.5rem;\n margin-top: auto;\n flex-shrink: 0;\n box-sizing: border-box;\n max-width: 100%;\n }\n\n .metaskool-play-button:hover {\n background: linear-gradient(45deg, var(--ukm-light-blue) 0%, var(--ukm-blue) 100%);\n color: white;\n transform: translateY(-2px);\n box-shadow: 0 4px 10px rgba(0, 51, 102, 0.3);\n text-decoration: none;\n }\n\n .metaskool-featured-card {\n grid-column: 1 \/ -1;\n }\n\n .metaskool-featured-card .metaskool-world-content {\n background: linear-gradient(135deg, var(--ukm-blue) 0%, #004080 100%);\n border-radius: 0 0 4px 4px;\n min-height: 300px;\n }\n\n .metaskool-featured-card .metaskool-world-title {\n color: white;\n font-size: 1.8rem;\n }\n\n .metaskool-featured-card .metaskool-world-description {\n color: rgba(255, 255, 255, 0.9);\n }\n\n .metaskool-featured-card .metaskool-world-creator {\n background: rgba(255, 255, 255, 0.2);\n border: 1px solid rgba(255, 255, 255, 0.3);\n box-shadow: none;\n }\n\n .metaskool-featured-card .metaskool-play-button {\n background: rgba(255, 255, 255, 0.2);\n border: 2px solid rgba(255, 255, 255, 0.3);\n }\n\n .metaskool-featured-card .metaskool-play-button:hover {\n background: white;\n color: var(--ukm-blue);\n border-color: white;\n }\n\n \/* Video Button Styles *\/\n .metaskool-world-image-container {\n position: relative;\n }\n\n .metaskool-world-image-container .metaskool-video-btn {\n position: absolute;\n top: 10px;\n right: 10px;\n background: rgba(255, 255, 255, 0.9);\n color: var(--ukm-blue);\n border: none;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n font-size: 20px;\n z-index: 2;\n transition: all 0.3s ease;\n }\n\n .metaskool-world-image-container .metaskool-video-btn:hover {\n background: white;\n transform: scale(1.1);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);\n }\n\n @media (max-width: 768px) {\n .metaskool-container {\n padding: 3rem 0;\n }\n\n .metaskool-header h1 {\n font-size: 2rem;\n }\n\n .metaskool-worlds-grid {\n grid-template-columns: 1fr;\n gap: 1.5rem;\n padding: 0 1rem;\n }\n\n .metaskool-world-image {\n height: 200px;\n }\n\n .metaskool-world-title {\n font-size: 1.2rem;\n }\n\n .metaskool-featured-card .metaskool-world-title {\n font-size: 1.5rem;\n }\n\n .metaskool-world-image-container .metaskool-video-btn {\n width: 36px;\n height: 36px;\n font-size: 18px;\n }\n }\n\n @media (max-width: 480px) {\n .metaskool-container {\n padding: 2rem 0;\n }\n\n .metaskool-header h1 {\n font-size: 1.8rem;\n }\n\n .metaskool-world-image {\n height: 180px;\n }\n\n .metaskool-world-title {\n font-size: 1.1rem;\n }\n\n .metaskool-featured-card .metaskool-world-title {\n font-size: 1.3rem;\n }\n\n .metaskool-play-button {\n padding: 0.6rem 1.2rem;\n font-size: 0.9rem;\n }\n }\n\n .metaskool-fade-in {\n animation: metaskoolFadeIn 0.6s ease-in;\n }\n\n @keyframes metaskoolFadeIn {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n \/* Modal Styles *\/\n .metaskool-modal {\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.9);\n z-index: 1000;\n align-items: center;\n justify-content: center;\n }\n\n .metaskool-modal.active {\n display: flex;\n }\n\n .metaskool-modal-content {\n position: relative;\n width: 90%;\n max-width: 800px;\n background: black;\n border-radius: 10px;\n overflow: hidden;\n }\n\n .metaskool-modal-close {\n position: absolute;\n top: 10px;\n right: 10px;\n color: white;\n background: rgba(255, 255, 255, 0.2);\n border: none;\n border-radius: 50%;\n width: 30px;\n height: 30px;\n font-size: 20px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1001;\n }\n\n .metaskool-video-container {\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n overflow: hidden;\n }\n\n .metaskool-video-container iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border: none;\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"metaskool-container\">\n <header class=\"metaskool-header metaskool-fade-in\">\n <h1>JPN Kedah<\/h1>\n <\/header>\n\n <div class=\"metaskool-worlds-grid\">\n \n\n \n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20TUNKU%20SOFIAH.png\" \n alt=\"SMK TUNKU SOFIAH\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK TUNKU SOFIAH<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK TUNKU SOFIAH<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-TUNKU-SOFIAH-683075b2020a938bd2174d47?share=3007083669463980702\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20KEDAWANG.png\" \n alt=\"SMK KEDAWANG\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK KEDAWANG<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-KEDAWANG-683075f78e3c31fe47445da0?share=2879219145505073415\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20TENGKU%20LAKSAMANA.png\" \n alt=\"SMK TENGKU LAKSAMANA\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK TENGKU LAKSAMANA<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK TENGKU LAKSAMANA<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-TENGKU-LAKSAMANA-6830762e020a938bd2174ebd?share=7864113905639528624\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20SERI%20PANTAI.png\" \n alt=\"SMK SERI PANTAI\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK SERI PANTAI<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK SERI PANTAI<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-SERI-PANTAI-683076568e3c31fe47445f33?share=6689548358780263226\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20BANDAR%20BUKIT%20KAYU%20HITAM.png\" \n alt=\"SMK BANDAR BUKIT KAYU HITAM\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK BANDAR BUKIT KAYU HITAM<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK BANDAR BUKIT KAYU HITAM<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-BANDAR-BUKIT-KAYU-HITAM-6830767d020a938bd2174fcd?share=6873565291866024902\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20BANDAR%20BARU%20DARULAMAN.png\" \n alt=\"SMK BANDAR BARU DARULAMAN\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK BANDAR BARU DARULAMAN<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK BANDAR BARU DARULAMAN<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-BANDAR-BARU-DARULAMAN-68307736020a938bd2175304?share=864804857343416119\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/MAKTAB%20MAHMUD%20PADANG%20TERAP.png\" \n alt=\"MAKTAB MAHMUD PADANG TERAP\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">MAKTAB MAHMUD PADANG TERAP<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">MAKTAB MAHMUD PADANG TERAP<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-MAKTAB-MAHMUD-PADANG-TERAP-6830775a8e3c31fe47446523?share=8124667973957277667\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20PADANG%20TERAP.png\" \n alt=\"SMK PADANG TERAP\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK PADANG TERAP<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK PADANG TERAP<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-PADANG-TERAP-683566b2c66189bb03a50440?share=3062400073024347328\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20TUNKU%20TEMENGGUNG.png\" \n alt=\"SMK TUNKU TEMENGGUNG\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK TUNKU TEMENGGUNG<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK TUNKU TEMENGGUNG<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-TUNKU-TEMENGGUNG-683077a28e3c31fe474467bb?share=5697523849809428868\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20SUNGAI%20TIANG.png\" \n alt=\"SMK SUNGAI TIANG\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK SUNGAI TIANG<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK SUNGAI TIANG<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-SUNGAI-TIANG-683077c88e3c31fe47446856?share=1613692777076023843\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20CONVENT%20FATHER%20BARRE.png\" \n alt=\"SMK CONVENT FATHER BARRE\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK CONVENT FATHER BARRE<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK CONVENT FATHER BARRE<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-CONVENT-FATHER-BARRE-683077ec8e3c31fe47446939\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SM%20PENDIDIKAN%20KHAS%20VOKASIONAL%20MERBOK.png\" \n alt=\"SM PENDIDIKAN KHAS VOKASIONAL MERBOK\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SM PENDIDIKAN KHAS VOKASIONAL MERBOK<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SM PENDIDIKAN KHAS VOKASIONAL MERBOK<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SM-PENDIDIKAN-KHAS-VOKASIONAL-MERBOK-68356de2e66b592ddb4c5687?share=1106527780516157945\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20BALING.png\" \n alt=\"SMK BALING\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK BALING<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK BALING<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-BALING-683078358e3c31fe47446a37?share=2614359621530368627\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20JERAI.png\" \n alt=\"SMK JERAI\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK JERAI<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK JERAI<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-JERAI-683078538e3c31fe47446adb?share=5495811201219605371\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SM%20AGAMA%20NAHDZAH.png\" \n alt=\"SM AGAMA NAHDZAH\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SM AGAMA NAHDZAH<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SM AGAMA NAHDZAH<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SM-AGAMA-NAHDZAH-683078a7fba39574f9ff8c73?share=6780646092815593006\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SM%20AGAMA%20SG%20PETANI.png\" \n alt=\"SM AGAMA SG PETANI\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SM AGAMA SG PETANI<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SM AGAMA SG PETANI<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SM-AGAMA-SG-PETANI-6830792e8e3c31fe47447058?share=7182954741829348619\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/MAAHAD%20DINI%20SULTAN%20ABDUL%20HALIM.png\" \n alt=\"MAAHAD DINI SULTAN ABDUL HALIM\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">MAAHAD DINI SULTAN ABDUL HALIM<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">MAAHAD DINI SULTAN ABDUL HALIM<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-MAAHAD-DINI-SULTAN-ABDUL-HALIM-68307955020a938bd2175830?share=3357360259057252860\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20SULTAN%20BADLISHAH.png\" \n alt=\"SMK SULTAN BADLISHAH\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK SULTAN BADLISHAH<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK SULTAN BADLISHAH<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-SULTAN-BADLISHAH-683079998e3c31fe474476d6\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20TUNKU%20PANGLIMA%20BESAR.png\" \n alt=\"SMK TUNKU PANGLIMA BESAR\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK TUNKU PANGLIMA BESAR<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK TUNKU PANGLIMA BESAR<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-TUNKU-PANGLIMA-BESAR-683079c98e3c31fe474478b8?share=7992941877142139258\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <\/div>\n<\/div>\n\n\n<div class=\"metaskool-modal\" id=\"videoModal\">\n <div class=\"metaskool-modal-content\">\n <button class=\"metaskool-modal-close\" onclick=\"closeVideo()\">×<\/button>\n <div class=\"metaskool-video-container\">\n <iframe id=\"videoFrame\" \n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" \n allowfullscreen><\/iframe>\n <\/div>\n <\/div>\n<\/div>\n\n<script>\n \/\/ Add Font Awesome for the play icon\n if (!document.querySelector('link[href*=\"font-awesome\"]')) {\n const link = document.createElement('link');\n link.rel = 'stylesheet';\n link.href = 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/5.15.4\/css\/all.min.css';\n document.head.appendChild(link);\n }\n\n function openVideo(videoId) {\n const modal = document.getElementById('videoModal');\n const videoFrame = document.getElementById('videoFrame');\n videoFrame.src = `https:\/\/www.youtube.com\/embed\/${videoId}?autoplay=1`;\n modal.classList.add('active');\n document.body.style.overflow = 'hidden'; \/\/ Prevent scrolling\n }\n\n function closeVideo() {\n const modal = document.getElementById('videoModal');\n const videoFrame = document.getElementById('videoFrame');\n videoFrame.src = '';\n modal.classList.remove('active');\n document.body.style.overflow = ''; \/\/ Restore scrolling\n }\n\n \/\/ Close modal on background click\n document.getElementById('videoModal').addEventListener('click', function(e) {\n if (e.target === this) {\n closeVideo();\n }\n });\n\n \/\/ Close modal on escape key\n document.addEventListener('keydown', function(e) {\n if (e.key === 'Escape') {\n closeVideo();\n }\n });\n<\/script>\n\n\n<script>\n(function(){\n const placeholder = 'data:image\/svg+xml;charset=utf-8,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"9\" viewBox=\"0 0 16 9\"><\/svg>';\n const imgs = document.querySelectorAll('.metaskool-world-image');\n imgs.forEach(img => {\n if (!img.dataset.src) {\n img.dataset.src = img.src; \/\/ store real src\n img.src = placeholder; \/\/ tiny placeholder\n img.loading = 'lazy';\n }\n });\n\n function loadImg(img){\n const src = img.dataset.src;\n if (!src) return;\n const newImg = new Image();\n newImg.src = src;\n newImg.decoding = 'async';\n newImg.onload = () => {\n img.src = src;\n };\n newImg.onerror = () => {\n img.src = src; \/\/ try anyway on error\n };\n }\n\n if ('IntersectionObserver' in window) {\n const io = new IntersectionObserver((entries, observer) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n loadImg(entry.target);\n observer.unobserve(entry.target);\n }\n });\n }, {rootMargin: '200px'});\n imgs.forEach(i => io.observe(i));\n } else {\n \/\/ no IntersectionObserver, load all\n imgs.forEach(loadImg);\n }\n})();\n<\/script>\n<script>\n\/\/ header menu toggle\n(function() {\n\tfunction initMenu() {\n\t\tconst btn = document.querySelector('.menu-toggle');\n\t\tconst nav = document.getElementById('siteNav');\n\t\t\n\t\tif (!btn || !nav) {\n\t\t\tconsole.log('Menu elements not found');\n\t\t\treturn;\n\t\t}\n\t\t\n\t\tbtn.addEventListener('click', function(e) {\n\t\t\te.preventDefault();\n\t\t\tconst isOpen = nav.classList.contains('open');\n\t\t\t\n\t\t\tif (isOpen) {\n\t\t\t\tnav.classList.remove('open');\n\t\t\t\tbtn.setAttribute('aria-expanded', 'false');\n\t\t\t} else {\n\t\t\t\tnav.classList.add('open');\n\t\t\t\tbtn.setAttribute('aria-expanded', 'true');\n\t\t\t}\n\t\t});\n\t}\n\t\n\tif (document.readyState === 'loading') {\n\t\tdocument.addEventListener('DOMContentLoaded', initMenu);\n\t} else {\n\t\tinitMenu();\n\t}\n})();\n<\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\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>Our Worlds | MetaSkool JPN Kedah SMK TUNKU SOFIAH SMK TUNKU SOFIAH Access Metaverse SMK KEDAWANG Access Metaverse SMK TENGKU LAKSAMANA SMK TENGKU LAKSAMANA Access<a class=\"ut-readmore\" href=\"https:\/\/www.ukm.my\/metaskool\/sstp-jpn-kedah\/\"> …<\/a><\/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-665","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/pages\/665","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/comments?post=665"}],"version-history":[{"count":14,"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/pages\/665\/revisions"}],"predecessor-version":[{"id":825,"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/pages\/665\/revisions\/825"}],"wp:attachment":[{"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/media?parent=665"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\n\n\n \n \n Our Worlds | MetaSkool<\/title>\n \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=Montserrat:wght@400;500;600;700&family=Roboto:wght@300;400;500;700&display=swap\" rel=\"stylesheet\">\n \n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\" media=\"print\" onload=\"this.media='all'\">\n \n <link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@4.6.2\/dist\/css\/bootstrap.min.css\">\n <style>\n \/* MetaSkool header styles (responsive with hamburger) *\/\n\t.metaskool-site-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0.6rem 1rem;background:linear-gradient(90deg,var(--ukm-blue),#004080);color:#fff;position:relative}\n\t.metaskool-site-header .brand{display:flex;align-items:center;gap:0.75rem}\n\t.metaskool-site-header .brand img{height:44px;width:auto}\n\t.metaskool-site-header h1{font-size:1.05rem;margin:0;color:#fff;font-family:'Montserrat',sans-serif}\n\t.metaskool-site-header .site-nav{display:flex;gap:0.5rem;align-items:center}\n\t.metaskool-site-header .site-nav a{color:#fff;text-decoration:none;padding:0.45rem 0.6rem;border-radius:6px;font-weight:600}\n\t.metaskool-site-header .site-nav a:hover{background:rgba(255,255,255,0.08)}\n\t.menu-toggle{display:none;background:transparent;border:none;color:#fff;width:44px;height:44px;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}\n\t.menu-toggle .hamburger{display:block;width:20px;height:2px;background:#fff;position:relative}\n\t.menu-toggle .hamburger::before,.menu-toggle .hamburger::after{content:'';position:absolute;left:0;right:0;height:2px;background:#fff}\n\t.menu-toggle .hamburger::before{top:-6px}.menu-toggle .hamburger::after{top:6px}\n\t@media(max-width:768px){\n\t\t.metaskool-site-header{padding:0.75rem 1rem;align-items:flex-start}\n\t\t.metaskool-site-header .brand{flex-direction:column;align-items:center;gap:0.5rem;text-align:center}\n\t\t.metaskool-site-header .brand img{height:36px}\n\t\t.metaskool-site-header h1{font-size:0.9rem;line-height:1.2}\n\t\t.menu-toggle{display:flex;position:absolute;top:0.75rem;right:1rem}\n\t\t.metaskool-site-header .site-nav{position:absolute;left:0;right:0;top:100%;background:linear-gradient(180deg,var(--ukm-blue),#003355);flex-direction:column;display:none;padding:0.25rem 0}\n\t\t.metaskool-site-header .site-nav.open{display:flex}\n\t\t.metaskool-site-header .site-nav a{padding:0.75rem 1rem;border-radius:0;border-bottom:1px solid rgba(255,255,255,0.06)}\n\t}\n :root {\n --ukm-blue: #003366;\n --ukm-red: #c00;\n --ukm-light-blue: #007bff;\n --light-gray: #f8f9fa;\n --medium-gray: #e9ecef;\n --dark-gray: #495057;\n --spacing-xs: 0.5rem;\n --spacing-sm: 1rem;\n --spacing-md: 2rem;\n --spacing-lg: 4rem;\n --section-bg-1: #ffffff;\n --section-bg-2: #f8f9fa;\n --card-hover-bg: #ffffff;\n }\n \n body {\n background: #fff;\n font-family: 'Roboto', Arial, sans-serif;\n color: #333;\n margin: 0;\n padding: 0;\n }\n\n .metaskool-container {\n padding: 4rem 0;\n background: #ffffff;\n position: relative;\n max-width:1200px; \n margin:0 auto;\n }\n\n .metaskool-container::before {\n display: none;\n }\n\n .metaskool-header {\n text-align: center;\n margin-bottom: 4rem;\n }\n\n .metaskool-header h1 {\n position: relative;\n font-family: 'Montserrat', sans-serif;\n font-size: 2.8rem;\n font-weight: 700;\n color: var(--ukm-blue);\n margin-bottom: 2rem;\n padding-bottom: 1rem;\n text-shadow: 1px 1px 1px rgba(0,0,0,0.1);\n }\n\n .metaskool-header h1:after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n width: 80px;\n height: 3px;\n background: linear-gradient(to right, var(--ukm-blue), var(--ukm-red));\n }\n\n .metaskool-worlds-grid {\n max-width: 1200px;\n margin: 0 auto;\n padding: 0 1rem;\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 2rem;\n }\n\n .metaskool-world-card {\n background: white;\n border-radius: 4px;\n overflow: hidden;\n box-shadow: 0 3px 10px rgba(0,0,0,0.1);\n transition: all 0.3s ease;\n border: 1px solid rgba(0,51,102,0.1);\n box-sizing: border-box;\n }\n\n .metaskool-world-card:hover {\n transform: translateY(-8px);\n box-shadow: 0 12px 20px rgba(0,0,0,0.15);\n background: var(--card-hover-bg);\n border-color: var(--ukm-red);\n }\n\n .metaskool-world-image {\n width: 100%;\n height: 250px;\n object-fit: cover;\n }\n\n .metaskool-world-content {\n padding: 1.5rem;\n display: flex;\n flex-direction: column;\n min-height: auto;\n box-sizing: border-box;\n }\n\n .metaskool-world-title {\n font-family: 'Montserrat', sans-serif;\n font-size: 1.3rem;\n font-weight: 600;\n color: var(--ukm-blue);\n margin-bottom: 0.75rem;\n }\n\n .metaskool-world-creator {\n display: inline-block;\n background: var(--ukm-blue);\n color: white;\n font-size: clamp(0.7rem, 2.5vw, 0.9rem);\n padding: 0.5rem 1.2rem;\n border-radius: 50px;\n margin-bottom: 1rem;\n line-height: 1.4;\n max-width: 100%;\n white-space: normal;\n text-align: center;\n box-shadow: 0 2px 4px rgba(0, 51, 102, 0.1);\n }\n\n \/* Additional rule for very long creator names *\/\n .metaskool-world-creator:has(span) {\n font-size: 0.75rem;\n padding: 0.4rem 1rem;\n }\n\n .metaskool-world-description {\n color: var(--dark-gray);\n font-size: 0.95rem;\n line-height: 1.6;\n margin-bottom: 1.5rem;\n flex-grow: 1;\n }\n\n .metaskool-play-button {\n display: flex;\n align-items: center;\n justify-content: center;\n width: calc(100% - 0px);\n background: linear-gradient(45deg, var(--ukm-blue) 0%, var(--ukm-light-blue) 100%);\n color: white;\n text-decoration: none;\n padding: 0.75rem 1.5rem;\n border-radius: 50px;\n font-weight: 500;\n transition: all 0.3s ease;\n box-shadow: 0 2px 5px rgba(0, 51, 102, 0.2);\n border: none;\n cursor: pointer;\n gap: 0.5rem;\n margin-top: auto;\n flex-shrink: 0;\n box-sizing: border-box;\n max-width: 100%;\n }\n\n .metaskool-play-button:hover {\n background: linear-gradient(45deg, var(--ukm-light-blue) 0%, var(--ukm-blue) 100%);\n color: white;\n transform: translateY(-2px);\n box-shadow: 0 4px 10px rgba(0, 51, 102, 0.3);\n text-decoration: none;\n }\n\n .metaskool-featured-card {\n grid-column: 1 \/ -1;\n }\n\n .metaskool-featured-card .metaskool-world-content {\n background: linear-gradient(135deg, var(--ukm-blue) 0%, #004080 100%);\n border-radius: 0 0 4px 4px;\n min-height: 300px;\n }\n\n .metaskool-featured-card .metaskool-world-title {\n color: white;\n font-size: 1.8rem;\n }\n\n .metaskool-featured-card .metaskool-world-description {\n color: rgba(255, 255, 255, 0.9);\n }\n\n .metaskool-featured-card .metaskool-world-creator {\n background: rgba(255, 255, 255, 0.2);\n border: 1px solid rgba(255, 255, 255, 0.3);\n box-shadow: none;\n }\n\n .metaskool-featured-card .metaskool-play-button {\n background: rgba(255, 255, 255, 0.2);\n border: 2px solid rgba(255, 255, 255, 0.3);\n }\n\n .metaskool-featured-card .metaskool-play-button:hover {\n background: white;\n color: var(--ukm-blue);\n border-color: white;\n }\n\n \/* Video Button Styles *\/\n .metaskool-world-image-container {\n position: relative;\n }\n\n .metaskool-world-image-container .metaskool-video-btn {\n position: absolute;\n top: 10px;\n right: 10px;\n background: rgba(255, 255, 255, 0.9);\n color: var(--ukm-blue);\n border: none;\n border-radius: 50%;\n width: 40px;\n height: 40px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n font-size: 20px;\n z-index: 2;\n transition: all 0.3s ease;\n }\n\n .metaskool-world-image-container .metaskool-video-btn:hover {\n background: white;\n transform: scale(1.1);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);\n }\n\n @media (max-width: 768px) {\n .metaskool-container {\n padding: 3rem 0;\n }\n\n .metaskool-header h1 {\n font-size: 2rem;\n }\n\n .metaskool-worlds-grid {\n grid-template-columns: 1fr;\n gap: 1.5rem;\n padding: 0 1rem;\n }\n\n .metaskool-world-image {\n height: 200px;\n }\n\n .metaskool-world-title {\n font-size: 1.2rem;\n }\n\n .metaskool-featured-card .metaskool-world-title {\n font-size: 1.5rem;\n }\n\n .metaskool-world-image-container .metaskool-video-btn {\n width: 36px;\n height: 36px;\n font-size: 18px;\n }\n }\n\n @media (max-width: 480px) {\n .metaskool-container {\n padding: 2rem 0;\n }\n\n .metaskool-header h1 {\n font-size: 1.8rem;\n }\n\n .metaskool-world-image {\n height: 180px;\n }\n\n .metaskool-world-title {\n font-size: 1.1rem;\n }\n\n .metaskool-featured-card .metaskool-world-title {\n font-size: 1.3rem;\n }\n\n .metaskool-play-button {\n padding: 0.6rem 1.2rem;\n font-size: 0.9rem;\n }\n }\n\n .metaskool-fade-in {\n animation: metaskoolFadeIn 0.6s ease-in;\n }\n\n @keyframes metaskoolFadeIn {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n \/* Modal Styles *\/\n .metaskool-modal {\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.9);\n z-index: 1000;\n align-items: center;\n justify-content: center;\n }\n\n .metaskool-modal.active {\n display: flex;\n }\n\n .metaskool-modal-content {\n position: relative;\n width: 90%;\n max-width: 800px;\n background: black;\n border-radius: 10px;\n overflow: hidden;\n }\n\n .metaskool-modal-close {\n position: absolute;\n top: 10px;\n right: 10px;\n color: white;\n background: rgba(255, 255, 255, 0.2);\n border: none;\n border-radius: 50%;\n width: 30px;\n height: 30px;\n font-size: 20px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1001;\n }\n\n .metaskool-video-container {\n position: relative;\n padding-bottom: 56.25%;\n height: 0;\n overflow: hidden;\n }\n\n .metaskool-video-container iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border: none;\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"metaskool-container\">\n <header class=\"metaskool-header metaskool-fade-in\">\n <h1>JPN Kedah<\/h1>\n <\/header>\n\n <div class=\"metaskool-worlds-grid\">\n \n\n \n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20TUNKU%20SOFIAH.png\" \n alt=\"SMK TUNKU SOFIAH\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK TUNKU SOFIAH<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK TUNKU SOFIAH<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-TUNKU-SOFIAH-683075b2020a938bd2174d47?share=3007083669463980702\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20KEDAWANG.png\" \n alt=\"SMK KEDAWANG\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK KEDAWANG<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-KEDAWANG-683075f78e3c31fe47445da0?share=2879219145505073415\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20TENGKU%20LAKSAMANA.png\" \n alt=\"SMK TENGKU LAKSAMANA\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK TENGKU LAKSAMANA<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK TENGKU LAKSAMANA<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-TENGKU-LAKSAMANA-6830762e020a938bd2174ebd?share=7864113905639528624\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20SERI%20PANTAI.png\" \n alt=\"SMK SERI PANTAI\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK SERI PANTAI<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK SERI PANTAI<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-SERI-PANTAI-683076568e3c31fe47445f33?share=6689548358780263226\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20BANDAR%20BUKIT%20KAYU%20HITAM.png\" \n alt=\"SMK BANDAR BUKIT KAYU HITAM\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK BANDAR BUKIT KAYU HITAM<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK BANDAR BUKIT KAYU HITAM<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-BANDAR-BUKIT-KAYU-HITAM-6830767d020a938bd2174fcd?share=6873565291866024902\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20BANDAR%20BARU%20DARULAMAN.png\" \n alt=\"SMK BANDAR BARU DARULAMAN\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK BANDAR BARU DARULAMAN<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK BANDAR BARU DARULAMAN<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-BANDAR-BARU-DARULAMAN-68307736020a938bd2175304?share=864804857343416119\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/MAKTAB%20MAHMUD%20PADANG%20TERAP.png\" \n alt=\"MAKTAB MAHMUD PADANG TERAP\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">MAKTAB MAHMUD PADANG TERAP<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">MAKTAB MAHMUD PADANG TERAP<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-MAKTAB-MAHMUD-PADANG-TERAP-6830775a8e3c31fe47446523?share=8124667973957277667\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20PADANG%20TERAP.png\" \n alt=\"SMK PADANG TERAP\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK PADANG TERAP<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK PADANG TERAP<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-PADANG-TERAP-683566b2c66189bb03a50440?share=3062400073024347328\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20TUNKU%20TEMENGGUNG.png\" \n alt=\"SMK TUNKU TEMENGGUNG\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK TUNKU TEMENGGUNG<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK TUNKU TEMENGGUNG<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-TUNKU-TEMENGGUNG-683077a28e3c31fe474467bb?share=5697523849809428868\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20SUNGAI%20TIANG.png\" \n alt=\"SMK SUNGAI TIANG\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK SUNGAI TIANG<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK SUNGAI TIANG<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-SUNGAI-TIANG-683077c88e3c31fe47446856?share=1613692777076023843\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20CONVENT%20FATHER%20BARRE.png\" \n alt=\"SMK CONVENT FATHER BARRE\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK CONVENT FATHER BARRE<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK CONVENT FATHER BARRE<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-CONVENT-FATHER-BARRE-683077ec8e3c31fe47446939\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SM%20PENDIDIKAN%20KHAS%20VOKASIONAL%20MERBOK.png\" \n alt=\"SM PENDIDIKAN KHAS VOKASIONAL MERBOK\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SM PENDIDIKAN KHAS VOKASIONAL MERBOK<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SM PENDIDIKAN KHAS VOKASIONAL MERBOK<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SM-PENDIDIKAN-KHAS-VOKASIONAL-MERBOK-68356de2e66b592ddb4c5687?share=1106527780516157945\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20BALING.png\" \n alt=\"SMK BALING\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK BALING<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK BALING<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-BALING-683078358e3c31fe47446a37?share=2614359621530368627\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20JERAI.png\" \n alt=\"SMK JERAI\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK JERAI<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK JERAI<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-JERAI-683078538e3c31fe47446adb?share=5495811201219605371\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SM%20AGAMA%20NAHDZAH.png\" \n alt=\"SM AGAMA NAHDZAH\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SM AGAMA NAHDZAH<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SM AGAMA NAHDZAH<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SM-AGAMA-NAHDZAH-683078a7fba39574f9ff8c73?share=6780646092815593006\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SM%20AGAMA%20SG%20PETANI.png\" \n alt=\"SM AGAMA SG PETANI\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SM AGAMA SG PETANI<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SM AGAMA SG PETANI<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SM-AGAMA-SG-PETANI-6830792e8e3c31fe47447058?share=7182954741829348619\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/MAAHAD%20DINI%20SULTAN%20ABDUL%20HALIM.png\" \n alt=\"MAAHAD DINI SULTAN ABDUL HALIM\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">MAAHAD DINI SULTAN ABDUL HALIM<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">MAAHAD DINI SULTAN ABDUL HALIM<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-MAAHAD-DINI-SULTAN-ABDUL-HALIM-68307955020a938bd2175830?share=3357360259057252860\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20SULTAN%20BADLISHAH.png\" \n alt=\"SMK SULTAN BADLISHAH\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK SULTAN BADLISHAH<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK SULTAN BADLISHAH<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-SULTAN-BADLISHAH-683079998e3c31fe474476d6\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <div class=\"metaskool-world-card metaskool-fade-in\">\n <img decoding=\"async\" src=\"https:\/\/hub.metaskool.my\/kedah-img\/SMK%20TUNKU%20PANGLIMA%20BESAR.png\" \n alt=\"SMK TUNKU PANGLIMA BESAR\" class=\"metaskool-world-image\" onerror=\"this.style.display='none'; this.nextElementSibling.style.display='flex';\">\n <div class=\"metaskool-world-image-placeholder\" style=\"display: none;\">SMK TUNKU PANGLIMA BESAR<\/div>\n <div class=\"metaskool-world-content\">\n <div class=\"metaskool-world-header\">\n <h2 class=\"metaskool-world-title\">SMK TUNKU PANGLIMA BESAR<\/h2>\n \n <\/div>\n <a href=\"https:\/\/www.spatial.io\/s\/SSTP-KEDAH-SMK-TUNKU-PANGLIMA-BESAR-683079c98e3c31fe474478b8?share=7992941877142139258\" target=\"_blank\" class=\"metaskool-play-button\">Access Metaverse<\/a>\n <\/div>\n <\/div>\n\n <\/div>\n<\/div>\n\n\n<div class=\"metaskool-modal\" id=\"videoModal\">\n <div class=\"metaskool-modal-content\">\n <button class=\"metaskool-modal-close\" onclick=\"closeVideo()\">×<\/button>\n <div class=\"metaskool-video-container\">\n <iframe id=\"videoFrame\" \n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" \n allowfullscreen><\/iframe>\n <\/div>\n <\/div>\n<\/div>\n\n<script>\n \/\/ Add Font Awesome for the play icon\n if (!document.querySelector('link[href*=\"font-awesome\"]')) {\n const link = document.createElement('link');\n link.rel = 'stylesheet';\n link.href = 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/5.15.4\/css\/all.min.css';\n document.head.appendChild(link);\n }\n\n function openVideo(videoId) {\n const modal = document.getElementById('videoModal');\n const videoFrame = document.getElementById('videoFrame');\n videoFrame.src = `https:\/\/www.youtube.com\/embed\/${videoId}?autoplay=1`;\n modal.classList.add('active');\n document.body.style.overflow = 'hidden'; \/\/ Prevent scrolling\n }\n\n function closeVideo() {\n const modal = document.getElementById('videoModal');\n const videoFrame = document.getElementById('videoFrame');\n videoFrame.src = '';\n modal.classList.remove('active');\n document.body.style.overflow = ''; \/\/ Restore scrolling\n }\n\n \/\/ Close modal on background click\n document.getElementById('videoModal').addEventListener('click', function(e) {\n if (e.target === this) {\n closeVideo();\n }\n });\n\n \/\/ Close modal on escape key\n document.addEventListener('keydown', function(e) {\n if (e.key === 'Escape') {\n closeVideo();\n }\n });\n<\/script>\n\n\n<script>\n(function(){\n const placeholder = 'data:image\/svg+xml;charset=utf-8,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"9\" viewBox=\"0 0 16 9\"><\/svg>';\n const imgs = document.querySelectorAll('.metaskool-world-image');\n imgs.forEach(img => {\n if (!img.dataset.src) {\n img.dataset.src = img.src; \/\/ store real src\n img.src = placeholder; \/\/ tiny placeholder\n img.loading = 'lazy';\n }\n });\n\n function loadImg(img){\n const src = img.dataset.src;\n if (!src) return;\n const newImg = new Image();\n newImg.src = src;\n newImg.decoding = 'async';\n newImg.onload = () => {\n img.src = src;\n };\n newImg.onerror = () => {\n img.src = src; \/\/ try anyway on error\n };\n }\n\n if ('IntersectionObserver' in window) {\n const io = new IntersectionObserver((entries, observer) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n loadImg(entry.target);\n observer.unobserve(entry.target);\n }\n });\n }, {rootMargin: '200px'});\n imgs.forEach(i => io.observe(i));\n } else {\n \/\/ no IntersectionObserver, load all\n imgs.forEach(loadImg);\n }\n})();\n<\/script>\n<script>\n\/\/ header menu toggle\n(function() {\n\tfunction initMenu() {\n\t\tconst btn = document.querySelector('.menu-toggle');\n\t\tconst nav = document.getElementById('siteNav');\n\t\t\n\t\tif (!btn || !nav) {\n\t\t\tconsole.log('Menu elements not found');\n\t\t\treturn;\n\t\t}\n\t\t\n\t\tbtn.addEventListener('click', function(e) {\n\t\t\te.preventDefault();\n\t\t\tconst isOpen = nav.classList.contains('open');\n\t\t\t\n\t\t\tif (isOpen) {\n\t\t\t\tnav.classList.remove('open');\n\t\t\t\tbtn.setAttribute('aria-expanded', 'false');\n\t\t\t} else {\n\t\t\t\tnav.classList.add('open');\n\t\t\t\tbtn.setAttribute('aria-expanded', 'true');\n\t\t\t}\n\t\t});\n\t}\n\t\n\tif (document.readyState === 'loading') {\n\t\tdocument.addEventListener('DOMContentLoaded', initMenu);\n\t} else {\n\t\tinitMenu();\n\t}\n})();\n<\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\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>Our Worlds | MetaSkool JPN Kedah SMK TUNKU SOFIAH SMK TUNKU SOFIAH Access Metaverse SMK KEDAWANG Access Metaverse SMK TENGKU LAKSAMANA SMK TENGKU LAKSAMANA Access<a class=\"ut-readmore\" href=\"https:\/\/www.ukm.my\/metaskool\/sstp-jpn-kedah\/\"> …<\/a><\/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-665","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/pages\/665","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/comments?post=665"}],"version-history":[{"count":14,"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/pages\/665\/revisions"}],"predecessor-version":[{"id":825,"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/pages\/665\/revisions\/825"}],"wp:attachment":[{"href":"https:\/\/www.ukm.my\/metaskool\/wp-json\/wp\/v2\/media?parent=665"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}