{"id":11,"date":"2026-03-12T14:37:26","date_gmt":"2026-03-12T14:37:26","guid":{"rendered":"https:\/\/seminars.unj.ac.id\/insegt2026\/?page_id=11"},"modified":"2026-09-29T15:24:51","modified_gmt":"2026-09-29T15:24:51","slug":"elementor-11","status":"publish","type":"page","link":"https:\/\/seminars.unj.ac.id\/insegt2026\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"11\" class=\"elementor elementor-11\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ebf362b e-con-full e-flex e-con e-parent\" data-id=\"ebf362b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-57c2110 elementor-widget elementor-widget-html\" data-id=\"57c2110\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<head>\r\n    <meta charset=\"UTF-8\"\/>\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"\/>\r\n    <title>INSEGT 2026<\/title>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n    <style>\r\n        *, *::before, *::after {\r\n            box-sizing: border-box;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        :root {\r\n            --accent-orange: #f05228;\r\n            --accent-yellow: #fbbf24;\r\n            --accent-amber: #f97316;\r\n        }\r\n\r\n        .hero-section {\r\n            font-family: 'Lexend Deca', sans-serif;\r\n            min-height: 90vh;\r\n            display: flex;\r\n            flex-direction: column;\r\n            justify-content: center;\r\n            align-items: center;\r\n            padding: 60px 5% 120px;\r\n            background-color: #000;\r\n            background-image:\r\n                linear-gradient(to left,\r\n                    rgba(0, 0, 0, 0.85) 0%,\r\n                    rgba(0, 0, 0, 0.65) 40%,\r\n                    rgba(0, 0, 0, 0.35) 75%,\r\n                    rgba(0, 0, 0, 0.15) 100%),\r\n                url('https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/P1020952-scaled.jpg');\r\n            background-size: cover;\r\n            background-position: center 20%;\r\n            background-repeat: no-repeat;\r\n            position: relative;\r\n            overflow: visible;\r\n        }\r\n\r\n        @keyframes fadeInUp {\r\n            0% { opacity: 0; transform: translateY(30px); }\r\n            100% { opacity: 1; transform: translateY(0); }\r\n        }\r\n\r\n        @keyframes fadeInCoOrg {\r\n            0% { opacity: 0; }\r\n            100% { opacity: 1; }\r\n        }\r\n\r\n        .hero-container {\r\n            width: 100%;\r\n            max-width: 1100px;\r\n            margin: 0 auto;\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 40px;\r\n        }\r\n\r\n        .hero-content {\r\n            flex: 1;\r\n            text-align: left;\r\n        }\r\n\r\n        .hero-date {\r\n            font-size: 14px;\r\n            font-weight: 600;\r\n            letter-spacing: 3px;\r\n            color: var(--accent-yellow);\r\n            text-transform: uppercase;\r\n            text-shadow: 1px 2px 4px rgba(0,0,0,0.8);\r\n            margin-bottom: 12px;\r\n            opacity: 0;\r\n            animation: fadeInUp 0.8s ease forwards 0.2s;\r\n        }\r\n\r\n        .title {\r\n            background: rgba(255, 247, 237, 0.08);\r\n            backdrop-filter: blur(12px);\r\n            -webkit-backdrop-filter: blur(12px);\r\n            border: 1px solid rgba(251, 191, 36, 0.25);\r\n            border-radius: 16px;\r\n            padding: 32px 40px;\r\n            box-shadow: 0 8px 32px rgba(240, 82, 40, 0.15);\r\n            margin: 35px 0;\r\n            opacity: 0;\r\n            animation: fadeInUp 0.8s ease forwards 0.4s;\r\n        }\r\n\r\n        .hero-title {\r\n            font-size: 3rem;\r\n            line-height: 1.3;\r\n            font-weight: 700;\r\n            color: #ffffff;\r\n            text-shadow: 2px 3px 8px rgba(0,0,0,0.8);\r\n        }\r\n\r\n        .sub-hero-title {\r\n            font-size: 1.1rem;\r\n            font-weight: 500;\r\n            color: #ffffff;\r\n            text-shadow: 2px 3px 8px rgba(0,0,0,0.8);\r\n            margin-top: 8px;\r\n        }\r\n\r\n        .countdown-wrapper {\r\n            display: inline-flex;\r\n            align-items: center;\r\n            background: rgba(255, 247, 237, 0.08);\r\n            backdrop-filter: blur(12px);\r\n            -webkit-backdrop-filter: blur(12px);\r\n            border: 1px solid rgba(251, 191, 36, 0.2);\r\n            border-radius: 12px;\r\n            padding: 12px 25px;\r\n            box-shadow: 0 8px 20px rgba(240, 82, 40, 0.2);\r\n            opacity: 0;\r\n            animation: fadeInUp 0.8s ease forwards 0.6s;\r\n        }\r\n\r\n        .countdown-box { display: flex; flex-direction: column; align-items: center; min-width: 65px; }\r\n        .cd-number { font-size: 2rem; font-weight: 700; color: #ffffff; line-height: 1.1; text-shadow: 0 0 8px rgba(251, 191, 36, 0.4); }\r\n        .cd-label { font-size: 0.75rem; font-weight: 500; color: rgba(255,255,255,0.7); text-transform: uppercase; letter-spacing: 1px; margin-top: 4px; }\r\n        .cd-separator { font-size: 1.8rem; font-weight: 300; color: var(--accent-yellow); margin: 0 10px; margin-top: -18px; animation: pulse 2s infinite; }\r\n\r\n        @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }\r\n\r\n        .recap {\r\n            position: relative;\r\n            flex: 0 0 320px;\r\n            height: 360px;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            opacity: 0;\r\n            animation: fadeInUp 0.8s ease forwards 0.8s;\r\n        }\r\n\r\n        .recap-track { position: relative; width: 240px; height: 320px; overflow: visible; }\r\n\r\n        .recap-card { position: absolute; top: 0; left: 0; width: 240px; height: 320px; border-radius: 16px; overflow: hidden; box-shadow: 0 12px 32px rgba(0,0,0,0.45); transition: transform 0.5s ease, opacity 0.5s ease; }\r\n        .recap-card.active { z-index: 2; transform: translateX(0) translateY(0) scale(1) rotate(0deg); opacity: 1; }\r\n        .recap-card.behind { z-index: 1; transform: translateX(20px) translateY(12px) scale(0.93) rotate(3deg); opacity: 0.7; }\r\n\r\n        .recap-img { width: 100%; height: 100%; object-fit: cover; display: block; }\r\n        .recap-overlay { position: absolute; inset: 0; background: linear-gradient(to bottom, transparent 30%, rgba(0,0,0,0.85) 100%); }\r\n\r\n        .recap-info { position: absolute; bottom: 0; left: 0; right: 0; padding: 16px; display: flex; flex-direction: column; gap: 8px; z-index: 2; }\r\n        .recap-label { font-size: 0.85rem; font-weight: 700; color: #ffffff; letter-spacing: 1px; text-transform: uppercase; }\r\n\r\n        .recap-btn { display: inline-block; border-radius: 50px; padding: 7px 18px; font-size: 0.78rem; font-weight: 700; font-family: 'Lexend Deca', sans-serif; text-decoration: none; text-align: center; cursor: pointer; width: fit-content; transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease; }\r\n        .recap-btn-recap { background-color: var(--accent-orange); color: #ffffff; border: 2px solid var(--accent-orange); }\r\n        .recap-btn-recap:hover { background-color: #ffffff; color: var(--accent-orange); }\r\n        .recap-btn-gallery { background-color: transparent; color: #ffffff; border: 2px solid #ffffff; }\r\n        .recap-btn-gallery:hover { background-color: #ffffff; color: #111111; }\r\n\r\n        .recap-nav {\r\n            position: absolute;\r\n            top: 50%;\r\n            transform: translateY(-50%);\r\n            background: var(--accent-orange);\r\n            color: #ffffff;\r\n            border: 2px solid var(--accent-orange);\r\n            border-radius: 50%;\r\n            width: 36px;\r\n            height: 36px;\r\n            font-size: 1.4rem;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            cursor: pointer;\r\n            z-index: 10;\r\n            line-height: 1;\r\n            transition: background 0.3s ease, color 0.3s ease;\r\n        }\r\n        .recap-nav:hover { background: var(--accent-yellow); border-color: var(--accent-yellow); color: #0f172a; }\r\n        .recap-nav.left  { left: calc(50% - 136px); }\r\n        .recap-nav.right { right: calc(50% - 136px); }\r\n\r\n        .co-organizer-box {\r\n            position: absolute;\r\n            bottom: 0;\r\n            left: 50%;\r\n            transform: translate(-50%, 50%);\r\n            width: 85%;\r\n            max-width: 1200px;\r\n            background: rgba(255, 247, 237, 0.98);\r\n            backdrop-filter: blur(15px);\r\n            padding: 25px 40px;\r\n            border-radius: 20px;\r\n            box-shadow: 0 15px 40px rgba(240, 82, 40, 0.15);\r\n            z-index: 2;\r\n            text-align: center;\r\n            border: 1px solid rgba(240, 82, 40, 0.12);\r\n            opacity: 0;\r\n            animation: fadeInCoOrg 1s ease forwards 1s;\r\n        }\r\n\r\n        .co-org-title { font-weight: 700; font-size: 16px; color: #92400e; margin-bottom: 20px; letter-spacing: 2px; text-transform: uppercase; }\r\n        .co-org-slider { width: 100%; overflow: hidden; -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); }\r\n        .co-org-slide-track { display: flex; width: max-content; animation: scrollMarquee 25s linear infinite; }\r\n        .co-org-slide-track:hover { animation-play-state: paused; }\r\n        .logo-set { display: flex; align-items: center; gap: 50px; padding-right: 50px; }\r\n        .logo-set img { height: 45px; width: auto; object-fit: contain; flex-shrink: 0; cursor: pointer; transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); }\r\n        .logo-set img:hover { transform: scale(1.15); }\r\n\r\n        @keyframes scrollMarquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }\r\n\r\n        .img-modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.88); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); z-index: 999999; justify-content: center; align-items: center; }\r\n        .img-modal-overlay.active { display: flex; }\r\n        .img-modal-card { position: relative; background: #1e293b; border: 1px solid rgba(255,255,255,0.15); border-radius: 16px; padding: 48px 20px 20px; max-width: 90vw; max-height: 90vh; display: flex; flex-direction: column; align-items: center; gap: 12px; box-shadow: 0 20px 60px rgba(0,0,0,0.6); overflow: hidden; }\r\n        .img-modal-title { font-size: 1rem; font-weight: 700; color: #ffffff; letter-spacing: 1px; text-transform: uppercase; margin: 0; align-self: flex-start; }\r\n        .img-modal-img { max-width: 100%; max-height: 72vh; border-radius: 10px; object-fit: contain; display: block; }\r\n        .img-modal-close { position: absolute; top: 12px; right: 12px; background: var(--accent-orange); color: #ffffff; border: 2px solid var(--accent-orange); border-radius: 50%; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 0.9rem; transition: background 0.3s ease, color 0.3s ease; }\r\n        .img-modal-close:hover { background: var(--accent-yellow); border-color: var(--accent-yellow); color: #0f172a; }\r\n\r\n        @media (max-width: 768px) {\r\n            .hero-section { justify-content: flex-start; padding-top: 130px; padding-bottom: 180px; height: auto; min-height: 100vh; }\r\n            .hero-container { flex-direction: column; text-align: center; gap: 20px; }\r\n            .title { padding: 25px 20px; margin: 20px 0; }\r\n            .hero-title { font-size: 2rem; }\r\n            .sub-hero-title { font-size: 1rem; }\r\n            .recap { flex: unset; width: 100%; height: 320px; margin-bottom: 20px; }\r\n            .co-organizer-box { width: 95%; padding: 20px 15px; border-radius: 15px; transform: translate(-50%, 30%); }\r\n            .logo-set { gap: 30px; padding-right: 30px; }\r\n            .logo-set img { height: 32px; }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n<section class=\"hero-section\" id=\"hero-section\">\r\n\r\n    <div class=\"hero-container\">\r\n\r\n        <div class=\"hero-content\">\r\n            <p class=\"hero-date\">24 SEPTEMBER 2026 - JAKARTA<\/p>\r\n\r\n            <div class=\"title\">\r\n                <h1 class=\"hero-title\">INSEGT 2026<\/h1>\r\n                <h2 class=\"sub-hero-title\">\r\n                    2nd International Conference On Innovation, Sustainability and\r\n                    Engineering For Global Transformation (INSEGT) 2026.\r\n                <\/h2>\r\n            <\/div>\r\n\r\n            <div class=\"countdown-wrapper\">\r\n                <div class=\"countdown-box\">\r\n                    <span id=\"cd-days\" class=\"cd-number\">00<\/span>\r\n                    <span class=\"cd-label\">Days<\/span>\r\n                <\/div>\r\n                <div class=\"cd-separator\">:<\/div>\r\n                <div class=\"countdown-box\">\r\n                    <span id=\"cd-hours\" class=\"cd-number\">00<\/span>\r\n                    <span class=\"cd-label\">Hours<\/span>\r\n                <\/div>\r\n                <div class=\"cd-separator\">:<\/div>\r\n                <div class=\"countdown-box\">\r\n                    <span id=\"cd-minutes\" class=\"cd-number\">00<\/span>\r\n                    <span class=\"cd-label\">Minutes<\/span>\r\n                <\/div>\r\n                <div class=\"cd-separator\">:<\/div>\r\n                <div class=\"countdown-box\">\r\n                    <span id=\"cd-seconds\" class=\"cd-number\">00<\/span>\r\n                    <span class=\"cd-label\">Seconds<\/span>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"recap\">\r\n            <button class=\"recap-nav left\" id=\"recapPrev\">&#8249;<\/button>\r\n            <button class=\"recap-nav right\" id=\"recapNext\">&#8250;<\/button>\r\n\r\n            <div class=\"recap-track\" id=\"recapTrack\">\r\n                <div class=\"recap-card active\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/INSEGT-2025-scaled.jpg\" alt=\"INSEGT 2025\" class=\"recap-img\" \/>\r\n                    <div class=\"recap-overlay\"><\/div>\r\n                    <div class=\"recap-info\">\r\n                        <span class=\"recap-label\">INSEGT 2025<\/span>\r\n                        <a href=\"https:\/\/seminars.unj.ac.id\/insegt\/\" class=\"recap-btn recap-btn-recap\" target=\"_blank\">See More \u2192<\/a>\r\n                        <button class=\"recap-btn recap-btn-gallery\" data-img=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/INSEGT-2025-scaled.jpg\" data-title=\"INSEGT 2025\">Zoom Picture<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"recap-card behind\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/ICTVET-2018.jpg\" alt=\"ICTVET 2018\" class=\"recap-img\" \/>\r\n                    <div class=\"recap-overlay\"><\/div>\r\n                    <div class=\"recap-info\">\r\n                        <span class=\"recap-label\">ICTVET 2018<\/span>\r\n                        <button class=\"recap-btn recap-btn-gallery\" data-img=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/ICTVET-2018.jpg\" data-title=\"ICTVET 2018\">Zoom Picture<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n    <div class=\"co-organizer-box\">\r\n        <p class=\"co-org-title\">Co-Organizers<\/p>\r\n        <div class=\"co-org-slider\">\r\n            <div class=\"co-org-slide-track\">\r\n                <div class=\"logo-set\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 1\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 2\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 3\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 4\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 5\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 6\">\r\n                <\/div>\r\n                <div class=\"logo-set\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 1\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 2\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 3\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 4\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 5\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/unj-logo.png\" alt=\"UNJ 6\">\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n<div class=\"img-modal-overlay\" id=\"imgModal\">\r\n    <div class=\"img-modal-card\">\r\n        <button class=\"img-modal-close\" id=\"imgModalClose\">\u2715<\/button>\r\n        <p class=\"img-modal-title\" id=\"imgModalTitle\"><\/p>\r\n        <img decoding=\"async\" src=\"\" alt=\"\" class=\"img-modal-img\" id=\"imgModalImg\"\/>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function () {\r\n    const countDownDate = new Date(\"Sep 24, 2026 08:00:00\").getTime();\r\n    const cdInterval = setInterval(function () {\r\n        const now = new Date().getTime();\r\n        const distance = countDownDate - now;\r\n        const days    = Math.floor(distance \/ (1000 * 60 * 60 * 24));\r\n        const hours   = Math.floor((distance % (1000 * 60 * 60 * 24)) \/ (1000 * 60 * 60));\r\n        const minutes = Math.floor((distance % (1000 * 60 * 60)) \/ (1000 * 60));\r\n        const seconds = Math.floor((distance % (1000 * 60)) \/ 1000);\r\n        const d = document.getElementById('cd-days');\r\n        const h = document.getElementById('cd-hours');\r\n        const m = document.getElementById('cd-minutes');\r\n        const s = document.getElementById('cd-seconds');\r\n        if (d) d.textContent = days    < 10 ? '0' + days    : days;\r\n        if (h) h.textContent = hours   < 10 ? '0' + hours   : hours;\r\n        if (m) m.textContent = minutes < 10 ? '0' + minutes : minutes;\r\n        if (s) s.textContent = seconds < 10 ? '0' + seconds : seconds;\r\n        if (distance < 0) {\r\n            clearInterval(cdInterval);\r\n            const wrapper = document.querySelector('.countdown-wrapper');\r\n            if (wrapper) wrapper.innerHTML = \"<div style='color:white;font-weight:700;letter-spacing:2px;'>EVENT STARTED<\/div>\";\r\n        }\r\n    }, 1000);\r\n\r\n    const cards  = document.querySelectorAll('.recap-card');\r\n    let current  = 0;\r\n    function updateRecap() {\r\n        cards.forEach(function (card, i) {\r\n            card.classList.remove('active', 'behind');\r\n            card.classList.add(i === current ? 'active' : 'behind');\r\n        });\r\n    }\r\n    const btnNext = document.getElementById('recapNext');\r\n    const btnPrev = document.getElementById('recapPrev');\r\n    if (btnNext) btnNext.addEventListener('click', function (e) { e.preventDefault(); e.stopPropagation(); current = (current + 1) % cards.length; updateRecap(); });\r\n    if (btnPrev) btnPrev.addEventListener('click', function (e) { e.preventDefault(); e.stopPropagation(); current = (current - 1 + cards.length) % cards.length; updateRecap(); });\r\n    updateRecap();\r\n\r\n    const imgModal      = document.getElementById('imgModal');\r\n    const imgModalImg   = document.getElementById('imgModalImg');\r\n    const imgModalTitle = document.getElementById('imgModalTitle');\r\n    const imgModalClose = document.getElementById('imgModalClose');\r\n    function openImgModal(src, title) { imgModalImg.src = src; imgModalImg.alt = title; imgModalTitle.textContent = title; imgModal.classList.add('active'); }\r\n    function closeImgModal() { imgModal.classList.remove('active'); imgModalImg.src = ''; }\r\n    document.addEventListener('click', function (e) { const btn = e.target.closest('.recap-btn-gallery'); if (btn) { e.preventDefault(); e.stopPropagation(); openImgModal(btn.getAttribute('data-img'), btn.getAttribute('data-title')); } });\r\n    if (imgModalClose) imgModalClose.addEventListener('click', closeImgModal);\r\n    if (imgModal) imgModal.addEventListener('click', function (e) { if (e.target === imgModal) closeImgModal(); });\r\n    document.addEventListener('keydown', function (e) { if (e.key === 'Escape') closeImgModal(); });\r\n});\r\n<\/script>\r\n<\/body>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-65c18fe e-con-full e-flex e-con e-parent\" data-id=\"65c18fe\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-28fb0d7 elementor-widget elementor-widget-html\" data-id=\"28fb0d7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;600;700&display=swap');\r\n\r\n:root {\r\n    --accent-orange: #f05228;\r\n    --accent-yellow: #fbbf24;\r\n    --text-dark: #0f172a;\r\n}\r\n\r\n.cta-section {\r\n    font-family: 'Lexend Deca', sans-serif;\r\n    background: linear-gradient(135deg, #fff7ed 0%, #fffbeb 100%);\r\n    backdrop-filter: blur(12px);\r\n    padding: 120px 5% 40px 5%;\r\n    text-align: center;\r\n    position: relative;\r\n    z-index: 1;\r\n    border-top: 1px solid rgba(251, 191, 36, 0.25);\r\n    border-bottom: 1px solid rgba(251, 191, 36, 0.25);\r\n    overflow: hidden;\r\n}\r\n\r\n.cta-section::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0; left: 0; right: 0; bottom: 0;\r\n    background:\r\n        radial-gradient(ellipse at 10% 50%, rgba(251, 191, 36, 0.12) 0%, transparent 60%),\r\n        radial-gradient(ellipse at 90% 50%, rgba(240, 82, 40, 0.08) 0%, transparent 60%);\r\n    pointer-events: none;\r\n    z-index: 0;\r\n}\r\n\r\n.cta-container {\r\n    max-width: 900px;\r\n    margin: 0 auto;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    gap: 15px;\r\n    position: relative;\r\n    z-index: 1;\r\n}\r\n\r\n.cta-text {\r\n    font-size: 1.4rem;\r\n    font-weight: 700;\r\n    margin: 0;\r\n    color: var(--text-dark);\r\n    text-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n.btn-cta-main {\r\n    background: linear-gradient(135deg, var(--accent-orange) 0%, #f97316 100%);\r\n    color: #ffffff;\r\n    padding: 10px 24px;\r\n    border-radius: 6px;\r\n    font-size: 0.95rem;\r\n    font-weight: 700;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 8px;\r\n    border: 2px solid var(--accent-orange);\r\n    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\r\n    text-decoration: none;\r\n}\r\n\r\n.cta-icon {\r\n    font-size: 1.1rem;\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n.btn-cta-main:hover {\r\n    background: transparent;\r\n    color: var(--accent-orange);\r\n    transform: translateY(-2px);\r\n    box-shadow: 0 5px 15px rgba(240, 82, 40, 0.25);\r\n}\r\n\r\n.btn-cta-main:hover .cta-icon {\r\n    transform: translateX(4px);\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .cta-section {\r\n        padding: 100px 5% 30px 5%;\r\n    }\r\n    .cta-text {\r\n        font-size: 1.1rem;\r\n    }\r\n    .btn-cta-main {\r\n        font-size: 0.85rem;\r\n        padding: 8px 20px;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<section class=\"cta-section\">\r\n    <div class=\"cta-container\">\r\n        <h2 class=\"cta-text\">See the best presenters announcement here!<\/h2>\r\n        <a href=\"#\" class=\"btn-cta-main\">\r\n            See Here!\r\n            <span class=\"cta-icon\">&#8594;<\/span>\r\n        <\/a>\r\n    <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5da25aa e-con-full e-flex e-con e-parent\" data-id=\"5da25aa\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-13ad9ee elementor-widget elementor-widget-html\" data-id=\"13ad9ee\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap');\r\n\r\n:root {\r\n    --accent-orange: #f05228;\r\n    --accent-yellow: #fbbf24;\r\n    --accent-amber: #f97316;\r\n    --text-dark: #0f172a;\r\n    --text-muted: #475569;\r\n}\r\n\r\n.about-section {\r\n    font-family: 'Lexend Deca', sans-serif;\r\n    background: linear-gradient(135deg, #fff7ed 0%, #ffffff 100%);\r\n    padding: 100px 5%;\r\n    position: relative;\r\n    overflow: hidden;\r\n    z-index: 1;\r\n    border-top: 1px solid #fde68a;\r\n    border-bottom: 1px solid #fde68a;\r\n}\r\n\r\n.bg-glow {\r\n    position: absolute;\r\n    border-radius: 50%;\r\n    filter: blur(80px);\r\n    z-index: -1;\r\n    opacity: 0.15;\r\n}\r\n.glow-blue  { top: -50px;    right: -50px; width: 300px; height: 300px; background-color: var(--accent-yellow); }\r\n.glow-green { bottom: -100px; left: -50px; width: 250px; height: 250px; background-color: var(--accent-orange); }\r\n\r\n.about-container {\r\n    max-width: 1100px;\r\n    margin: 0 auto;\r\n    display: grid;\r\n    grid-template-columns: 1fr 1fr;\r\n    gap: 50px;\r\n    align-items: center;\r\n}\r\n\r\n.about-title {\r\n    font-size: 1.4rem;\r\n    font-weight: 700;\r\n    color: var(--text-dark);\r\n    margin-top: 0;\r\n    margin-bottom: 25px;\r\n    line-height: 1.3;\r\n    position: relative;\r\n    display: inline-block;\r\n}\r\n.about-title::after {\r\n    content: '';\r\n    position: absolute;\r\n    left: 0;\r\n    bottom: -8px;\r\n    width: 40%;\r\n    height: 3px;\r\n    background: linear-gradient(to right, var(--accent-orange), var(--accent-yellow));\r\n    border-radius: 2px;\r\n}\r\n\r\n.about-text p {\r\n    font-size: 0.95rem;\r\n    line-height: 1.7;\r\n    color: var(--text-muted);\r\n    margin-bottom: 20px;\r\n    text-align: justify;\r\n}\r\n.about-text p:last-child { margin-bottom: 0; }\r\n\r\n.btn-open-modal {\r\n    background: none;\r\n    border: none;\r\n    padding: 0;\r\n    font-size: inherit;\r\n    font-weight: 600;\r\n    font-family: inherit;\r\n    color: var(--accent-orange);\r\n    cursor: pointer;\r\n    text-decoration: none;\r\n    transition: color 0.3s;\r\n}\r\n.btn-open-modal:hover {\r\n    text-decoration: underline;\r\n    color: var(--accent-yellow);\r\n}\r\n\r\n\/* --- CAROUSEL --- *\/\r\n.about-carousel-wrapper { width: 100%; position: relative; }\r\n\r\n.carousel-container {\r\n    width: 100%;\r\n    position: relative;\r\n    border-radius: 12px;\r\n    overflow: hidden;\r\n    border: 1px solid rgba(251, 191, 36, 0.2);\r\n    box-shadow: 0 10px 30px rgba(240, 82, 40, 0.1);\r\n    background: transparent;\r\n    line-height: 0;\r\n}\r\n\r\n.carousel-slide { display: none; width: 100%; }\r\n.carousel-slide img { width: 100%; height: auto; display: block; border-radius: 12px; }\r\n.active-slide { display: block; animation: fadeEffect 0.8s ease-in-out; }\r\n\r\n@keyframes fadeEffect {\r\n    from { opacity: 0.3; }\r\n    to   { opacity: 1; }\r\n}\r\n\r\n.carousel-btn {\r\n    cursor: pointer; position: absolute; top: 50%; transform: translateY(-50%);\r\n    width: 40px; height: 40px; color: #ffffff; font-size: 16px; font-weight: bold;\r\n    display: flex; justify-content: center; align-items: center; border-radius: 50%;\r\n    background-color: rgba(15, 23, 42, 0.4); backdrop-filter: blur(4px);\r\n    transition: all 0.3s ease; user-select: none; text-decoration: none; z-index: 5;\r\n}\r\n.prev-btn { left: 15px; }\r\n.next-btn { right: 15px; }\r\n.carousel-btn:hover { background-color: var(--accent-orange); transform: translateY(-50%) scale(1.1); }\r\n\r\n.carousel-dots { text-align: center; margin-top: 20px; }\r\n.dot {\r\n    cursor: pointer; height: 8px; width: 8px; margin: 0 5px;\r\n    background-color: #fde68a; border-radius: 50%;\r\n    display: inline-block; transition: all 0.3s ease;\r\n}\r\n.dot:hover, .active-dot {\r\n    background-color: var(--accent-orange);\r\n    transform: scale(1.3); width: 16px; border-radius: 10px;\r\n}\r\n\r\n\/* --- MODAL --- *\/\r\n.modal-overlay {\r\n    display: none;\r\n    position: fixed;\r\n    inset: 0;\r\n    background: rgba(15, 23, 42, 0.7);\r\n    backdrop-filter: blur(10px);\r\n    -webkit-backdrop-filter: blur(10px);\r\n    z-index: 999999;\r\n    justify-content: center;\r\n    align-items: center;\r\n    padding: 20px;\r\n    font-family: 'Lexend Deca', sans-serif;\r\n}\r\n.modal-overlay.active { display: flex; animation: fadeIn 0.3s ease-out; }\r\n\r\n.modal-card {\r\n    background: #ffffff;\r\n    border-radius: 20px;\r\n    width: 100%;\r\n    max-width: 850px;\r\n    max-height: 85vh;\r\n    position: relative;\r\n    box-shadow: 0 30px 60px rgba(240, 82, 40, 0.2);\r\n    display: flex;\r\n    flex-direction: column;\r\n    overflow: hidden;\r\n    animation: scaleUp 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n}\r\n\r\n.modal-header-accent {\r\n    height: 8px;\r\n    width: 100%;\r\n    background: linear-gradient(to right, var(--accent-orange), var(--accent-yellow));\r\n}\r\n\r\n.modal-close {\r\n    position: absolute;\r\n    top: 25px; right: 25px;\r\n    background: #fff7ed;\r\n    border: none;\r\n    border-radius: 50%;\r\n    width: 40px; height: 40px;\r\n    font-size: 1.2rem; font-weight: 700;\r\n    cursor: pointer;\r\n    color: var(--text-muted);\r\n    display: flex; justify-content: center; align-items: center;\r\n    transition: all 0.3s ease;\r\n    z-index: 10;\r\n}\r\n.modal-close:hover {\r\n    background-color: #ffedd5;\r\n    color: var(--accent-orange);\r\n    transform: rotate(90deg);\r\n}\r\n\r\n.modal-body { padding: 40px 50px; overflow-y: auto; }\r\n\r\n.modal-body::-webkit-scrollbar { width: 8px; }\r\n.modal-body::-webkit-scrollbar-track { background: #fff7ed; border-radius: 10px; }\r\n.modal-body::-webkit-scrollbar-thumb { background: #fde68a; border-radius: 10px; }\r\n.modal-body::-webkit-scrollbar-thumb:hover { background: var(--accent-orange); }\r\n\r\n.modal-title {\r\n    font-size: 1.8rem;\r\n    font-weight: 700;\r\n    color: var(--text-dark);\r\n    margin-top: 0;\r\n    margin-bottom: 25px;\r\n    border-bottom: 2px solid #fef3c7;\r\n    padding-bottom: 15px;\r\n}\r\n.modal-title span {\r\n    color: var(--accent-orange);\r\n    font-weight: 300;\r\n}\r\n\r\n.modal-text-content p {\r\n    font-size: 1.05rem;\r\n    line-height: 1.8;\r\n    color: var(--text-muted);\r\n    margin-bottom: 20px;\r\n    text-align: justify;\r\n}\r\n.modal-text-content p:last-child { margin-bottom: 0; }\r\n.modal-text-content strong {\r\n    color: var(--text-dark);\r\n    font-weight: 600;\r\n    background: rgba(251, 191, 36, 0.12);\r\n    padding: 2px 6px;\r\n    border-radius: 4px;\r\n}\r\n\r\n@keyframes fadeIn  { from { opacity: 0; } to { opacity: 1; } }\r\n@keyframes scaleUp { from { transform: scale(0.8); opacity: 0; } to { transform: scale(1); opacity: 1; } }\r\n\r\n@media (max-width: 992px) {\r\n    .about-container { grid-template-columns: 1fr; gap: 40px; }\r\n    .about-title { text-align: left; }\r\n}\r\n@media (max-width: 768px) {\r\n    .about-section { padding: 60px 5%; }\r\n    .about-title { font-size: 1.1rem; }\r\n    .about-text p { font-size: 0.9rem; text-align: left; }\r\n    .carousel-btn { width: 32px; height: 32px; font-size: 14px; }\r\n    .modal-card { width: 95%; max-height: 90vh; }\r\n    .modal-body { padding: 30px 20px; }\r\n    .modal-title { font-size: 1.4rem; padding-right: 40px; }\r\n    .modal-close { top: 15px; right: 15px; width: 35px; height: 35px; }\r\n    .modal-text-content p { font-size: 0.95rem; text-align: left; }\r\n}\r\n<\/style>\r\n\r\n<section class=\"about-section\" id=\"about-section\">\r\n    <div class=\"bg-glow glow-blue\"><\/div>\r\n    <div class=\"bg-glow glow-green\"><\/div>\r\n\r\n    <div class=\"about-container\">\r\n        <div class=\"about-content\">\r\n            <h2 class=\"about-title\">24 SEPTEMBER 2026<\/h2>\r\n\r\n            <div class=\"about-text\">\r\n                <p>The International Conference on Innovation, Sustainability and Engineering for Global Transformation (INSEGT) 2026 aims to bring together researchers, academics, engineers, and industry practitioners from around the world to exchange knowledge and discuss recent advances in engineering and technological innovation for sustainable development. The conference provides an international forum for presenting high-quality research, fostering interdisciplinary collaboration, and addressing global challenges related to sustainability and environmental resilience.<\/p>\r\n\r\n                <p>The conference particularly emphasizes Sustainable Engineering and Environmental Innovation, focusing on the development of engineering solutions that support environmentally responsible infrastructure, efficient resource utilization, and sustainable technological systems.\r\n                    <button class=\"btn-open-modal\" onclick=\"openModal()\">Read More...<\/button>\r\n                <\/p>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"about-carousel-wrapper\">\r\n            <div class=\"carousel-container\" id=\"insegt-carousel\">\r\n                <div class=\"carousel-slide active-slide\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/hero-bg.jpg\" alt=\"INSEGT 2026 Slide 1\">\r\n                <\/div>\r\n                <div class=\"carousel-slide\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/Surdurulebilir_Insaat_Yesil_Bina_Trendleri_1.jpg\" alt=\"INSEGT 2026 Slide 2\">\r\n                <\/div>\r\n                <div class=\"carousel-slide\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/nZCQsNYzJ4MXv9OfmNNbsqmpwrvGVBglQ8D4KZ6O.webp\" alt=\"INSEGT 2026 Slide 3\">\r\n                <\/div>\r\n                <div class=\"carousel-slide\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/information-technology-mean.jpg\" alt=\"INSEGT 2026 Slide 4\">\r\n                <\/div>\r\n                <a class=\"carousel-btn prev-btn\" onclick=\"moveSlide(-1)\">&#10094;<\/a>\r\n                <a class=\"carousel-btn next-btn\" onclick=\"moveSlide(1)\">&#10095;<\/a>\r\n            <\/div>\r\n            <div class=\"carousel-dots\">\r\n                <span class=\"dot active-dot\" onclick=\"currentSlide(1)\"><\/span>\r\n                <span class=\"dot\" onclick=\"currentSlide(2)\"><\/span>\r\n                <span class=\"dot\" onclick=\"currentSlide(3)\"><\/span>\r\n                <span class=\"dot\" onclick=\"currentSlide(4)\"><\/span>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<div class=\"modal-overlay\" id=\"myModal\">\r\n    <div class=\"modal-card\">\r\n        <div class=\"modal-header-accent\"><\/div>\r\n        <button class=\"modal-close\" onclick=\"closeModal()\">\u2715<\/button>\r\n        <div class=\"modal-body\">\r\n            <h2 class=\"modal-title\">INSEGT 2026 <span>Overview<\/span><\/h2>\r\n            <div class=\"modal-text-content\">\r\n                <p>The International Conference on Innovation, Sustainability and Engineering for Global Transformation (INSEGT) 2026 aims to bring together researchers, academics, engineers, and industry practitioners from around the world to exchange knowledge and discuss recent advances in engineering and technological innovation for sustainable development. The conference provides an international forum for presenting high-quality research, fostering interdisciplinary collaboration, and addressing global challenges related to sustainability and environmental resilience.<\/p>\r\n                <p>The conference particularly emphasizes <strong>Sustainable Engineering and Environmental Innovation<\/strong>, focusing on the development of engineering solutions that support environmentally responsible infrastructure, efficient resource utilization, and sustainable technological systems. Topics of interest include green construction and sustainable civil engineering, renewable energy technologies, energy storage systems, and waste-to-energy solutions, as well as the integration of digital technologies for sustainability, including Internet of Things (IoT), 5G networks, artificial intelligence, and smart systems.<\/p>\r\n                <p>INSEGT 2026 also welcomes contributions related to environmental management and green technology systems, along with research on circular innovation and sustainable materials that promote resource efficiency and long-term environmental sustainability.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function() {\r\n    let slideIndex = 1;\r\n    let timer;\r\n    const slides = document.querySelectorAll(\"#about-section .carousel-slide\");\r\n    const dots   = document.querySelectorAll(\"#about-section .dot\");\r\n\r\n    if (slides.length > 0) { showSlides(slideIndex); startTimer(); }\r\n\r\n    function showSlides(n) {\r\n        if (n > slides.length) { slideIndex = 1; }\r\n        if (n < 1) { slideIndex = slides.length; }\r\n        slides.forEach(s => { s.style.display = \"none\"; s.classList.remove(\"active-slide\"); });\r\n        dots.forEach(d => d.classList.remove(\"active-dot\"));\r\n        slides[slideIndex - 1].style.display = \"block\";\r\n        setTimeout(() => { slides[slideIndex - 1].classList.add(\"active-slide\"); }, 10);\r\n        dots[slideIndex - 1].classList.add(\"active-dot\");\r\n    }\r\n\r\n    window.moveSlide = function(n) { showSlides(slideIndex += n); resetTimer(); };\r\n    window.currentSlide = function(n) { showSlides(slideIndex = n); resetTimer(); };\r\n\r\n    function startTimer() { timer = setInterval(function() { moveSlide(1); }, 4000); }\r\n    function resetTimer() { clearInterval(timer); startTimer(); }\r\n});\r\n\r\nfunction openModal() {\r\n    document.getElementById('myModal').classList.add('active');\r\n    document.body.style.overflow = 'hidden';\r\n}\r\nfunction closeModal() {\r\n    document.getElementById('myModal').classList.remove('active');\r\n    document.body.style.overflow = '';\r\n}\r\ndocument.getElementById('myModal').addEventListener('click', function(e) {\r\n    if (e.target === this) closeModal();\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-88deed8 e-con-full e-flex e-con e-parent\" data-id=\"88deed8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-169eb77 elementor-widget elementor-widget-html\" data-id=\"169eb77\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;600;700&display=swap');\r\n\r\n:root {\r\n    --accent-orange: #f05228;\r\n    --accent-yellow: #fbbf24;\r\n    --text-dark: #0f172a;\r\n}\r\n\r\n.boa-section {\r\n    font-family: 'Lexend Deca', sans-serif;\r\n    background: linear-gradient(135deg, #fff7ed 0%, #fffbeb 100%);\r\n    backdrop-filter: blur(12px);\r\n    padding: 80px 5%;\r\n    text-align: center;\r\n    position: relative;\r\n    border-top: 1px solid #fde68a;\r\n    border-bottom: 1px solid #fde68a;\r\n    overflow: hidden;\r\n}\r\n\r\n.boa-section::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0; left: 0; right: 0; bottom: 0;\r\n    background:\r\n        radial-gradient(ellipse at 10% 50%, rgba(251, 191, 36, 0.10) 0%, transparent 60%),\r\n        radial-gradient(ellipse at 90% 50%, rgba(240, 82, 40, 0.07) 0%, transparent 60%);\r\n    pointer-events: none;\r\n    z-index: 0;\r\n}\r\n\r\n.boa-container {\r\n    max-width: 900px;\r\n    margin: 0 auto;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    gap: 25px;\r\n    position: relative;\r\n    z-index: 1;\r\n}\r\n\r\n.boa-title {\r\n    font-size: 1.4rem;\r\n    font-weight: 700;\r\n    color: var(--text-dark);\r\n    margin: 0;\r\n    position: relative;\r\n    display: inline-block;\r\n    padding-bottom: 12px;\r\n    letter-spacing: 0.5px;\r\n    text-shadow: 0px 1px 4px rgba(0, 0, 0, 0.05);\r\n}\r\n.boa-title::after {\r\n    content: '';\r\n    position: absolute;\r\n    bottom: 0;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    width: 60%;\r\n    height: 3px;\r\n    background: linear-gradient(to right, var(--accent-orange), var(--accent-yellow));\r\n    border-radius: 2px;\r\n}\r\n\r\n.boa-image-wrapper {\r\n    width: 100%;\r\n    border-radius: 12px;\r\n    overflow: hidden;\r\n    border: 1px solid rgba(251, 191, 36, 0.3);\r\n    box-shadow: 0 10px 30px rgba(240, 82, 40, 0.08);\r\n    line-height: 0;\r\n}\r\n.boa-image-wrapper img {\r\n    width: 100%;\r\n    height: auto;\r\n    display: block;\r\n    object-fit: cover;\r\n    transition: transform 0.5s ease;\r\n}\r\n.boa-image-wrapper:hover img {\r\n    transform: scale(1.03);\r\n}\r\n\r\n.btn-boa {\r\n    background: linear-gradient(135deg, var(--accent-orange) 0%, #f97316 100%);\r\n    color: #ffffff;\r\n    padding: 10px 24px;\r\n    border-radius: 6px;\r\n    font-size: 0.95rem;\r\n    font-weight: 700;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 8px;\r\n    border: 2px solid var(--accent-orange);\r\n    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\r\n    text-decoration: none;\r\n    margin-top: 5px;\r\n}\r\n.boa-icon {\r\n    font-size: 1.1rem;\r\n    transition: transform 0.3s ease;\r\n}\r\n.btn-boa:hover {\r\n    background: transparent;\r\n    color: var(--accent-orange);\r\n    transform: translateY(-2px);\r\n    box-shadow: 0 5px 15px rgba(240, 82, 40, 0.25);\r\n}\r\n.btn-boa:hover .boa-icon {\r\n    transform: translateX(4px);\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .boa-section { padding: 50px 5%; }\r\n    .boa-title { font-size: 1.1rem; }\r\n    .boa-container { gap: 20px; }\r\n    .btn-boa { font-size: 0.85rem; padding: 8px 20px; }\r\n}\r\n<\/style>\r\n\r\n<section class=\"boa-section\" id=\"boa-section\">\r\n    <div class=\"boa-container\">\r\n\r\n        <h2 class=\"boa-title\">INSEGT's Book of Abstract<\/h2>\r\n\r\n        <div class=\"boa-image-wrapper\">\r\n            <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/INSEGTs-Book-of-Abstract-1024x582-1.png\" alt=\"INSEGT Book of Abstract\">\r\n        <\/div>\r\n\r\n        <a href=\"https:\/\/seminars.unj.ac.id\/insegt\/wp-content\/uploads\/2025\/09\/Book-of-Abstract-INSEGT-2025.pdf\" target=\"_blank\" class=\"btn-boa\">\r\n            Read More\r\n            <span class=\"boa-icon\">&#8594;<\/span>\r\n        <\/a>\r\n\r\n    <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4835ac2 e-con-full e-flex e-con e-parent\" data-id=\"4835ac2\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3b4bb48 elementor-widget elementor-widget-html\" data-id=\"3b4bb48\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n\r\n<style>\r\n@import url(\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap\");\r\n\r\n:root {\r\n    --accent-orange: #f05228;\r\n    --accent-yellow: #fbbf24;\r\n    --accent-amber: #f97316;\r\n    --text-dark: #0f172a;\r\n    --text-muted: #475569;\r\n}\r\n\r\n.scopes-section {\r\n    font-family: \"Lexend Deca\", sans-serif !important;\r\n    background: linear-gradient(135deg, #ffffff 0%, #fff7ed 50%, #fffbeb 100%);\r\n    padding: 100px 5%;\r\n    position: relative;\r\n    overflow: hidden;\r\n    z-index: 2;\r\n    border-top: 1px solid #fde68a;\r\n    border-bottom: 1px solid #fde68a;\r\n}\r\n\r\n.scopes-section * {\r\n    font-family: \"Lexend Deca\", sans-serif !important;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.scopes-section .s-orb {\r\n    position: absolute;\r\n    border-radius: 50%;\r\n    filter: blur(100px);\r\n    pointer-events: none;\r\n    z-index: -1;\r\n    opacity: 0.12;\r\n}\r\n.s-orb-1 { width: 400px; height: 400px; top: -100px; left: -100px; background: var(--accent-yellow); }\r\n.s-orb-2 { width: 400px; height: 400px; bottom: -100px; right: -100px; background: var(--accent-orange); }\r\n\r\n.scopes-container {\r\n    max-width: 1050px;\r\n    margin: 0 auto;\r\n    position: relative;\r\n}\r\n\r\n.scopes-header {\r\n    text-align: center;\r\n    margin-bottom: 50px;\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    transition: opacity 0.8s ease, transform 0.8s ease;\r\n}\r\n.scopes-header.is-visible { opacity: 1; transform: translateY(0); }\r\n\r\n.scopes-title {\r\n    font-size: 1.4rem !important;\r\n    font-weight: 700 !important;\r\n    color: var(--text-dark);\r\n    display: inline-block;\r\n    position: relative;\r\n    padding-bottom: 12px;\r\n    margin: 0 0 10px 0;\r\n}\r\n.scopes-title::after {\r\n    content: \"\";\r\n    position: absolute;\r\n    bottom: 0;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    width: 60%;\r\n    height: 3px;\r\n    background: linear-gradient(to right, var(--accent-orange), var(--accent-yellow));\r\n    border-radius: 2px;\r\n}\r\n\r\n.scopes-subtitle {\r\n    font-size: 0.95rem;\r\n    color: var(--text-muted);\r\n    margin-top: 15px;\r\n    line-height: 1.6;\r\n    max-width: 700px;\r\n    margin-left: auto;\r\n    margin-right: auto;\r\n}\r\n\r\n.main-scope-card {\r\n    background: #ffffff;\r\n    border-radius: 20px;\r\n    padding: 40px;\r\n    margin-bottom: 50px;\r\n    box-shadow: 0 24px 64px rgba(240, 82, 40, 0.08);\r\n    border: 1px solid rgba(240, 82, 40, 0.08);\r\n    opacity: 0;\r\n    transform: translateY(40px);\r\n    transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);\r\n    position: relative;\r\n    overflow: hidden;\r\n}\r\n.main-scope-card.is-visible { opacity: 1; transform: translateY(0); }\r\n.main-scope-card::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0; left: 0; width: 4px; height: 100%;\r\n    background: linear-gradient(to bottom, var(--accent-orange), var(--accent-yellow));\r\n}\r\n\r\n.scope-topic-label {\r\n    font-size: 0.75rem;\r\n    font-weight: 700;\r\n    letter-spacing: 1.5px;\r\n    text-transform: uppercase;\r\n    color: var(--accent-orange);\r\n    margin-bottom: 8px;\r\n    display: block;\r\n}\r\n\r\n.scope-topic-title {\r\n    font-size: 1.1rem;\r\n    font-weight: 700;\r\n    color: var(--text-dark);\r\n    margin-bottom: 30px;\r\n}\r\n\r\n.scope-list-2026 {\r\n    list-style: none;\r\n    padding: 0;\r\n    margin: 0;\r\n    display: grid;\r\n    gap: 12px;\r\n}\r\n\r\n.scope-item-link {\r\n    text-decoration: none;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 15px;\r\n    padding: 14px 20px;\r\n    background: #fff7ed;\r\n    border-radius: 12px;\r\n    border: 1px solid transparent;\r\n    transition: all 0.3s ease;\r\n    color: var(--text-muted);\r\n    font-size: 0.9rem;\r\n    font-weight: 500;\r\n}\r\n.scope-item-link:hover {\r\n    background: #ffffff;\r\n    border-color: rgba(240, 82, 40, 0.3);\r\n    transform: translateX(8px);\r\n    color: var(--accent-orange);\r\n    box-shadow: 0 4px 12px rgba(240, 82, 40, 0.08);\r\n}\r\n\r\n.scope-dot {\r\n    width: 8px;\r\n    height: 8px;\r\n    border-radius: 50%;\r\n    background: var(--accent-yellow);\r\n    flex-shrink: 0;\r\n    box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.15);\r\n}\r\n\r\n.categories-wrapper {\r\n    background: #ffffff;\r\n    border-radius: 20px;\r\n    padding: 40px;\r\n    box-shadow: 0 10px 40px rgba(240, 82, 40, 0.06);\r\n    border: 1px solid rgba(240, 82, 40, 0.08);\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    transition: all 0.8s ease;\r\n}\r\n.categories-wrapper.is-visible { opacity: 1; transform: translateY(0); }\r\n\r\n.categories-title {\r\n    font-size: 1.1rem;\r\n    color: var(--text-dark);\r\n    margin: 0 0 35px 0;\r\n    text-align: center;\r\n    font-weight: 700;\r\n}\r\n\r\n.categories-grid {\r\n    display: grid;\r\n    grid-template-columns: 1fr 1fr;\r\n    gap: 30px;\r\n}\r\n\r\n.cat-heading {\r\n    font-size: 0.9rem;\r\n    font-weight: 700;\r\n    margin-bottom: 18px;\r\n    padding-bottom: 8px;\r\n    border-bottom: 2px solid rgba(251, 191, 36, 0.3);\r\n    display: block;\r\n}\r\n\r\n.color-orange { color: #c2410c; }\r\n.color-yellow { color: #b45309; }\r\n\r\n.tags-container { display: flex; flex-wrap: wrap; gap: 8px; }\r\n\r\n.cat-tag {\r\n    font-size: 0.75rem;\r\n    font-weight: 600;\r\n    padding: 6px 14px;\r\n    border-radius: 20px;\r\n    transition: all 0.3s ease;\r\n    border: 1px solid transparent;\r\n    cursor: default;\r\n}\r\n.tag-orange { background: rgba(240, 82, 40, 0.06); color: #c2410c; border-color: rgba(240, 82, 40, 0.18); }\r\n.tag-yellow { background: rgba(251, 191, 36, 0.10); color: #b45309; border-color: rgba(251, 191, 36, 0.25); }\r\n.cat-tag:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.05); }\r\n\r\n\/* Publication *\/\r\n.publication-header {\r\n    text-align: center;\r\n    margin-bottom: 40px;\r\n    margin-top: 60px;\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    transition: opacity 0.8s ease, transform 0.8s ease;\r\n}\r\n.publication-header.is-visible { opacity: 1; transform: translateY(0); }\r\n\r\n.publication-title {\r\n    font-size: 1.4rem !important;\r\n    font-weight: 700 !important;\r\n    color: var(--text-dark);\r\n    display: inline-block;\r\n    position: relative;\r\n    padding-bottom: 12px;\r\n    margin: 0;\r\n}\r\n.publication-title::after {\r\n    content: '';\r\n    position: absolute;\r\n    bottom: 0;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    width: 60px;\r\n    height: 4px;\r\n    background: var(--accent-orange);\r\n    border-radius: 2px;\r\n}\r\n\r\n.publication-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));\r\n    gap: 40px;\r\n    justify-content: center;\r\n}\r\n\r\n.pub-card {\r\n    background: #ffffff;\r\n    border-radius: 16px;\r\n    border: 1px solid #fde68a;\r\n    overflow: hidden;\r\n    box-shadow: 0 4px 6px -1px rgba(240, 82, 40, 0.05), 0 2px 4px -1px rgba(240, 82, 40, 0.03);\r\n    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    display: flex;\r\n    flex-direction: column;\r\n    text-decoration: none;\r\n    cursor: pointer;\r\n    color: inherit;\r\n}\r\n.pub-card.is-visible { opacity: 1; transform: translateY(0); }\r\n.pub-card:hover {\r\n    transform: translateY(-8px);\r\n    border-color: var(--accent-orange);\r\n    box-shadow: 0 15px 30px -5px rgba(240, 82, 40, 0.15), 0 10px 15px -6px rgba(240, 82, 40, 0.1);\r\n}\r\n\r\n.pub-img-wrap {\r\n    width: 100%;\r\n    height: 400px;\r\n    position: relative;\r\n    background: #fff7ed;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    overflow: hidden;\r\n    border-bottom: 1px solid #fde68a;\r\n}\r\n.pub-img-wrap img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    object-position: top center;\r\n    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);\r\n}\r\n.pub-card:hover .pub-img-wrap img { transform: scale(1.05); }\r\n\r\n.pub-content {\r\n    padding: 30px 25px;\r\n    flex-grow: 1;\r\n    display: flex;\r\n    flex-direction: column;\r\n}\r\n\r\n.pub-year-badge {\r\n    display: inline-block;\r\n    background: #fef3c7;\r\n    color: #92400e;\r\n    font-size: 0.85rem !important;\r\n    font-weight: 700 !important;\r\n    padding: 6px 14px;\r\n    border-radius: 20px;\r\n    margin-bottom: 16px;\r\n    align-self: flex-start;\r\n    letter-spacing: 0.5px;\r\n}\r\n\r\n.pub-name {\r\n    font-size: 1.25rem !important;\r\n    font-weight: 700 !important;\r\n    color: #0f172a;\r\n    margin-bottom: 12px;\r\n    line-height: 1.4;\r\n    transition: color 0.3s ease;\r\n}\r\n\r\n.pub-card:hover .pub-name {\r\n    color: var(--accent-orange);\r\n}\r\n\r\n.pub-desc {\r\n    font-size: 0.95rem !important;\r\n    color: #64748b;\r\n    line-height: 1.6;\r\n    margin: 0;\r\n}\r\n\r\n.pub-readmore-wrap {\r\n    text-align: center;\r\n    margin-top: 40px;\r\n}\r\n\r\n.btn-pub-readmore {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    padding: 12px 32px;\r\n    background-color: var(--accent-orange);\r\n    color: #ffffff;\r\n    font-size: 0.95rem;\r\n    font-weight: 700;\r\n    border-radius: 8px;\r\n    border: 2px solid var(--accent-orange);\r\n    text-decoration: none;\r\n    transition: all 0.3s ease;\r\n    font-family: \"Lexend Deca\", sans-serif;\r\n}\r\n\r\n.btn-arrow {\r\n    font-size: 1.1rem;\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n.btn-pub-readmore:hover {\r\n    background-color: transparent;\r\n    color: var(--accent-orange);\r\n}\r\n\r\n.btn-pub-readmore:hover .btn-arrow {\r\n    transform: translateX(5px);\r\n}\r\n\r\n@media (max-width: 900px) { .categories-grid { grid-template-columns: 1fr; gap: 35px; } }\r\n@media (max-width: 768px) {\r\n    .scopes-section { padding: 60px 5%; }\r\n    .scopes-title { font-size: 1.1rem !important; }\r\n    .main-scope-card { padding: 30px 20px; }\r\n    .publication-title { font-size: 1.5rem !important; }\r\n    .pub-img-wrap { height: 350px; }\r\n    .publication-grid { grid-template-columns: 1fr; }\r\n}\r\n<\/style>\r\n\r\n<section class=\"scopes-section\" id=\"conference-scopes\">\r\n    <div class=\"s-orb s-orb-1\"><\/div>\r\n    <div class=\"s-orb s-orb-2\"><\/div>\r\n\r\n    <div class=\"scopes-container\">\r\n\r\n        <div class=\"scopes-header scroll-anim\">\r\n            <h2 class=\"scopes-title\">Conference's Scopes<\/h2>\r\n            <p class=\"scopes-subtitle\">\r\n                INSEGT 2026 is centered around sustainable engineering, technology and\r\n                innovation, including but not limited to these themes:\r\n            <\/p>\r\n        <\/div>\r\n\r\n        <div class=\"main-scope-card scroll-anim\">\r\n            <span class=\"scope-topic-label\">Current Year<\/span>\r\n            <h3 class=\"scope-topic-title\">Sustainable Engineering & Environmental Innovation<\/h3>\r\n            <div class=\"scope-list-2026\">\r\n                <a href=\"#\" class=\"scope-item-link\">\r\n                    <span class=\"scope-dot\"><\/span>Green construction and sustainable civil engineering\r\n                <\/a>\r\n                <a href=\"#\" class=\"scope-item-link\">\r\n                    <span class=\"scope-dot\"><\/span>Renewable energy, energy storage, and waste-to-energy systems\r\n                <\/a>\r\n                <a href=\"#\" class=\"scope-item-link\">\r\n                    <span class=\"scope-dot\"><\/span>Digital technologies for sustainability (IoT, 5G, AI, smart systems)\r\n                <\/a>\r\n                <a href=\"#\" class=\"scope-item-link\">\r\n                    <span class=\"scope-dot\"><\/span>Environmental management and green technology systems\r\n                <\/a>\r\n                <a href=\"#\" class=\"scope-item-link\">\r\n                    <span class=\"scope-dot\"><\/span>Circular innovation and sustainable materials\r\n                <\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"categories-wrapper scroll-anim\">\r\n            <h3 class=\"categories-title\">Specific Categories<\/h3>\r\n            <div class=\"categories-grid\">\r\n                <div class=\"cat-group\">\r\n                    <h4 class=\"cat-heading color-orange\">Engineering & Environment<\/h4>\r\n                    <div class=\"tags-container\">\r\n                        <span class=\"cat-tag tag-orange\">Mechanical<\/span>\r\n                        <span class=\"cat-tag tag-orange\">Civil<\/span>\r\n                        <span class=\"cat-tag tag-orange\">Electrical<\/span>\r\n                        <span class=\"cat-tag tag-orange\">Industrial<\/span>\r\n                        <span class=\"cat-tag tag-orange\">Materials<\/span>\r\n                        <span class=\"cat-tag tag-orange\">Fire Safety<\/span>\r\n                        <span class=\"cat-tag tag-orange\">Environmental<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"cat-group\">\r\n                    <h4 class=\"cat-heading color-yellow\">Information Technology<\/h4>\r\n                    <div class=\"tags-container\">\r\n                        <span class=\"cat-tag tag-yellow\">Information Technology<\/span>\r\n                        <span class=\"cat-tag tag-yellow\">Software Development<\/span>\r\n                        <span class=\"cat-tag tag-yellow\">Information Security<\/span>\r\n                        <span class=\"cat-tag tag-yellow\">Database Management<\/span>\r\n                        <span class=\"cat-tag tag-yellow\">Information Systems<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"publication-header scroll-anim\">\r\n            <h2 class=\"publication-title\">Past Events & Previous Publications<\/h2>\r\n        <\/div>\r\n\r\n        <div class=\"publication-grid\">\r\n            <a href=\"https:\/\/seminars.unj.ac.id\/insegt\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"pub-card scroll-anim\">\r\n                <div class=\"pub-img-wrap\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/INSEGT-2025-scaled.jpg\" alt=\"INSEGT 2025\">\r\n                <\/div>\r\n                <div class=\"pub-content\">\r\n                    <div class=\"pub-year-badge\">2025<\/div>\r\n                    <div class=\"pub-name\">INSEGT<\/div>\r\n                    <p class=\"pub-desc\">International Conference on Innovation, Sustainability and Engineering for Global Transformation.<\/p>\r\n                <\/div>\r\n            <\/a>\r\n            <a href=\"https:\/\/kneopen.com\/issue\/kne-social\/142\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"pub-card scroll-anim\">\r\n                <div class=\"pub-img-wrap\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/ICTVET-2018.jpg\" alt=\"ICTVET 2018\">\r\n                <\/div>\r\n                <div class=\"pub-content\">\r\n                    <div class=\"pub-year-badge\">2018<\/div>\r\n                    <div class=\"pub-name\">ICTVET<\/div>\r\n                    <p class=\"pub-desc\">International Conference of Technical and Vocational Education and Training.<\/p>\r\n                <\/div>\r\n            <\/a>\r\n        <\/div>\r\n        <div class=\"pub-readmore-wrap scroll-anim\">\r\n            <a href=\"https:\/\/seminars.unj.ac.id\/insegt2026\/previous-publication\" class=\"btn-pub-readmore\">\r\n                View All Publications\r\n                <span class=\"btn-arrow\">\u2192<\/span>\r\n            <\/a>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n(function () {\r\n    const observer = new IntersectionObserver((entries, observer) => {\r\n        entries.forEach((entry, index) => {\r\n            if (entry.isIntersecting) {\r\n                setTimeout(() => { entry.target.classList.add(\"is-visible\"); }, index * 150);\r\n                observer.unobserve(entry.target);\r\n            }\r\n        });\r\n    }, { root: null, rootMargin: \"0px\", threshold: 0.15 });\r\n    document.querySelectorAll(\".scroll-anim\").forEach(el => observer.observe(el));\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-97e28c3 e-con-full e-flex e-con e-parent\" data-id=\"97e28c3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4752719 elementor-widget elementor-widget-html\" data-id=\"4752719\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n\r\n<style>\r\n:root {\r\n    --accent-orange: #f05228;\r\n    --accent-yellow: #fbbf24;\r\n    --accent-amber: #f97316;\r\n    --bg-neutral: #fff7ed;\r\n    --card-bg: #ffffff;\r\n    --text-dark: #0f172a;\r\n    --text-muted: #475569;\r\n    --text-light: #94a3b8;\r\n    --border-soft: #fde68a;\r\n}\r\n\r\n*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\r\n\r\n.speakers-section {\r\n    font-family: 'Lexend Deca', system-ui, -apple-system, sans-serif;\r\n    background-color: var(--bg-neutral);\r\n    padding: 100px 5%;\r\n    position: relative;\r\n    border-top: 1px solid var(--border-soft);\r\n    border-bottom: 1px solid var(--border-soft);\r\n    color: var(--text-dark);\r\n}\r\n\r\n.speakers-container { max-width: 1200px; margin: 0 auto; }\r\n\r\n.section-header {\r\n    text-align: center;\r\n    margin-bottom: 60px;\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    transition: opacity 0.8s ease, transform 0.8s ease;\r\n}\r\n.section-header.is-visible { opacity: 1; transform: translateY(0); }\r\n\r\n.section-title {\r\n    font-size: 1.8rem;\r\n    font-weight: 700;\r\n    color: var(--text-dark);\r\n    display: inline-block;\r\n    position: relative;\r\n    padding-bottom: 12px;\r\n    margin-bottom: 15px;\r\n}\r\n.section-title::after {\r\n    content: '';\r\n    position: absolute;\r\n    bottom: 0; left: 50%;\r\n    transform: translateX(-50%);\r\n    width: 60px;\r\n    height: 4px;\r\n    background: var(--accent-orange);\r\n    border-radius: 2px;\r\n}\r\n\r\n.section-subtitle { font-size: 1rem; color: var(--text-muted); }\r\n\r\n.speakers-grid {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    justify-content: center;\r\n    gap: 30px;\r\n}\r\n\r\n.speaker-card {\r\n    background: var(--card-bg);\r\n    border-radius: 16px;\r\n    border: 1px solid var(--border-soft);\r\n    overflow: hidden;\r\n    display: flex;\r\n    flex-direction: column;\r\n    width: calc(33.333% - 20px);\r\n    min-width: 300px;\r\n    max-width: 360px;\r\n    box-shadow: 0 4px 6px -1px rgba(240, 82, 40, 0.05), 0 2px 4px -1px rgba(240, 82, 40, 0.03);\r\n    opacity: 0;\r\n    transform: translateY(40px);\r\n    transition: opacity 0.6s cubic-bezier(0.25, 1, 0.5, 1),\r\n                transform 0.6s cubic-bezier(0.25, 1, 0.5, 1),\r\n                box-shadow 0.3s ease,\r\n                border-color 0.3s ease;\r\n}\r\n.speaker-card.is-visible { opacity: 1; transform: translateY(0); }\r\n\r\n.speaker-card:nth-child(1) { transition-delay: 0.1s; }\r\n.speaker-card:nth-child(2) { transition-delay: 0.2s; }\r\n.speaker-card:nth-child(3) { transition-delay: 0.3s; }\r\n.speaker-card:nth-child(4) { transition-delay: 0.4s; }\r\n.speaker-card:nth-child(5) { transition-delay: 0.5s; }\r\n\r\n.speaker-card:hover {\r\n    transform: translateY(-8px) !important;\r\n    border-color: var(--accent-orange);\r\n    box-shadow: 0 15px 30px -5px rgba(240, 82, 40, 0.15), 0 10px 15px -6px rgba(240, 82, 40, 0.1);\r\n}\r\n\r\n.speaker-img-wrapper {\r\n    position: relative;\r\n    width: 100%;\r\n    height: 300px;\r\n    background-color: #ffffff;\r\n    border-bottom: 3px solid var(--accent-orange);\r\n    overflow: hidden;\r\n}\r\n\r\n.speaker-badge {\r\n    position: absolute;\r\n    top: 15px; right: 15px;\r\n    background: rgba(255, 255, 255, 0.95);\r\n    color: var(--text-dark);\r\n    font-size: 0.75rem;\r\n    font-weight: 600;\r\n    padding: 6px 12px;\r\n    border-radius: 20px;\r\n    box-shadow: 0 4px 10px rgba(240, 82, 40, 0.1);\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 6px;\r\n    z-index: 2;\r\n    backdrop-filter: blur(4px);\r\n}\r\n\r\n.speaker-img-wrapper img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    object-position: top center;\r\n    transition: transform 0.6s ease;\r\n}\r\n.speaker-card:hover .speaker-img-wrapper img { transform: scale(1.05); }\r\n\r\n.speaker-content {\r\n    padding: 25px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    flex-grow: 1;\r\n}\r\n\r\n.speaker-name {\r\n    font-size: 1.25rem;\r\n    font-weight: 700;\r\n    color: var(--text-dark);\r\n    margin-bottom: 6px;\r\n    line-height: 1.3;\r\n}\r\n\r\n.speaker-institution {\r\n    font-size: 0.9rem;\r\n    color: var(--text-muted);\r\n    margin-bottom: 20px;\r\n    line-height: 1.5;\r\n}\r\n\r\n.speaker-top-info {\r\n    min-height: 135px;\r\n    display: flex;\r\n    flex-direction: column;\r\n}\r\n\r\n.speaker-expertise {\r\n    margin-bottom: auto;\r\n    padding-top: 15px;\r\n    border-top: 1px dashed #fde68a;\r\n}\r\n\r\n.expertise-label {\r\n    display: inline-block;\r\n    font-size: 0.7rem;\r\n    font-weight: 700;\r\n    text-transform: uppercase;\r\n    letter-spacing: 1px;\r\n    color: #92400e;\r\n    background: #fef3c7;\r\n    padding: 4px 10px;\r\n    border-radius: 6px;\r\n    margin-bottom: 10px;\r\n}\r\n\r\n.speaker-expertise p { font-size: 0.85rem; color: var(--text-muted); line-height: 1.6; }\r\n\r\n@media (max-width: 1024px) { .speaker-card { width: calc(50% - 15px); } }\r\n@media (max-width: 768px) {\r\n    .speakers-section { padding: 70px 5%; }\r\n    .speaker-top-info { min-height: auto; }\r\n    .section-title { font-size: 1.5rem; }\r\n    .speaker-card { width: 100%; max-width: 400px; }\r\n    .speaker-img-wrapper { height: 280px; }\r\n    .speaker-card:nth-child(n) { transition-delay: 0.1s; }\r\n}\r\n<\/style>\r\n\r\n<section class=\"speakers-section\" id=\"speakers\">\r\n    <div class=\"speakers-container\">\r\n\r\n        <div class=\"section-header scroll-anim\">\r\n            <h2 class=\"section-title\">Invited Speakers<\/h2>\r\n            <p class=\"section-subtitle\">Meet our distinguished experts from around the globe.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"speakers-grid\">\r\n\r\n            <div class=\"speaker-card scroll-anim\">\r\n                <div class=\"speaker-img-wrapper\">\r\n                    <span class=\"speaker-badge\">\ud83c\uddee\ud83c\udde9 Indonesia<\/span>\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/Prof.-Dr.-Neneng-Siti-Silfi-Ambarwati-S.Si-Apt.-M.Si_-scaled-removebg-preview_cropped_processed_by_imagy.png\" alt=\"Prof. Dr. Neneng Siti Silfi Ambarwati\">\r\n                <\/div>\r\n                <div class=\"speaker-content\">\r\n                    <div class=\"speaker-top-info\">\r\n                        <h3 class=\"speaker-name\">Prof. Dr. Neneng Siti Silfi Ambarwati, S.Si, Apt., M.Si<\/h3>\r\n                        <p class=\"speaker-institution\">Faculty of Engineering<br>Universitas Negeri Jakarta (UNJ)<\/p>\r\n                    <\/div>\r\n                    <div class=\"speaker-expertise\">\r\n                        <span class=\"expertise-label\">Expertise<\/span>\r\n                        <p>Natural Ingredient Cosmetics<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"speaker-card scroll-anim\">\r\n                <div class=\"speaker-img-wrapper\">\r\n                    <span class=\"speaker-badge\">\ud83c\uddf2\ud83c\uddfe Malaysia<\/span>\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/Dr.-Mohamed-Thariq-Bin-Haji-Hameed-Sultan_2-fd5e5490_cropped_processed_by_imagy.png\" alt=\"Prof. Ir. Ts. Dr. Mohamed Thariq Hameed Sultan\">\r\n                <\/div>\r\n                <div class=\"speaker-content\">\r\n                    <div class=\"speaker-top-info\">\r\n                        <h3 class=\"speaker-name\">Prof. Ir. Ts. Dr. Mohamed Thariq Hameed Sultan<\/h3>\r\n                        <p class=\"speaker-institution\">Universiti Putra Malaysia (UPM)<\/p>\r\n                    <\/div>\r\n                    <div class=\"speaker-expertise\">\r\n                        <span class=\"expertise-label\">Expertise<\/span>\r\n                        <p>Composite and bio-Composite Materials, Structures Health Monitoring (SHM), Damage Detections and Repair, Non-Destructive Testing<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"speaker-card scroll-anim\">\r\n                <div class=\"speaker-img-wrapper\">\r\n                    <span class=\"speaker-badge\">\ud83c\uddf2\ud83c\uddfe Malaysia<\/span>\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/Prof.-Dr.-Mohd-Ambri-Mohamed-removebg-preview-1.png\" alt=\"Prof. Dr. Mohd Ambri Bin Mohamed\">\r\n                <\/div>\r\n                <div class=\"speaker-content\">\r\n                    <div class=\"speaker-top-info\">\r\n                        <h3 class=\"speaker-name\">Prof. Dr. Mohd Ambri Bin Mohamed<\/h3>\r\n                        <p class=\"speaker-institution\">Institute of Microengineering and Nanoelectronics (IMEN), UKM<\/p>\r\n                    <\/div>\r\n                    <div class=\"speaker-expertise\">\r\n                        <span class=\"expertise-label\">Expertise<\/span>\r\n                        <p>Nanoelectronics and Materials Science<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"speaker-card scroll-anim\">\r\n                <div class=\"speaker-img-wrapper\">\r\n                    <span class=\"speaker-badge\">\ud83c\uddef\ud83c\uddf5 Japan<\/span>\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/Prof.-Yuki-Nagao-removebg-preview_cropped_processed_by_imagy.png\" alt=\"Prof. Yuki Nagao\">\r\n                <\/div>\r\n                <div class=\"speaker-content\">\r\n                    <div class=\"speaker-top-info\">\r\n                        <h3 class=\"speaker-name\">Prof. Yuki Nagao<\/h3>\r\n                        <p class=\"speaker-institution\">Japan Advanced Institute of Science and Technology<\/p>\r\n                    <\/div>\r\n                    <div class=\"speaker-expertise\">\r\n                        <span class=\"expertise-label\">Expertise<\/span>\r\n                        <p>Advance polymer-based ion-conductive materials, electrochemical energy systems, and sustainable energy conversion technologies<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"speaker-card scroll-anim\">\r\n                <div class=\"speaker-img-wrapper\">\r\n                    <span class=\"speaker-badge\">\ud83c\udde9\ud83c\uddea Germany<\/span>\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/Dr-Ulf-Henning-Richter_cropped_processed_by_imagy.png\" alt=\"Dr. Ulf Henning Richter\">\r\n                <\/div>\r\n                <div class=\"speaker-content\">\r\n                    <div class=\"speaker-top-info\">\r\n                        <h3 class=\"speaker-name\">Dr. Ulf Henning Richter<\/h3>\r\n                        <p class=\"speaker-institution\">Richterion Infrastructure Partners Limited<\/p>\r\n                    <\/div>\r\n                    <div class=\"speaker-expertise\">\r\n                        <span class=\"expertise-label\">Expertise<\/span>\r\n                        <p>Global energy and infrastructure systems, international economic sciences, and strategic cross-border corporate leadership.<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function() {\r\n    const observer = new IntersectionObserver((entries, observer) => {\r\n        entries.forEach(entry => {\r\n            if (entry.isIntersecting) {\r\n                entry.target.classList.add('is-visible');\r\n                observer.unobserve(entry.target);\r\n            }\r\n        });\r\n    }, { root: null, rootMargin: '0px', threshold: 0.15 });\r\n    document.querySelectorAll('.scroll-anim').forEach(el => observer.observe(el));\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-0752c6b e-con-full e-flex e-con e-parent\" data-id=\"0752c6b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b447efd elementor-widget elementor-widget-html\" data-id=\"b447efd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap');\r\n\r\n.dates-section {\r\n    font-family: 'Lexend Deca', sans-serif !important;\r\n    background: linear-gradient(135deg, #ffffff 0%, #fff7ed 50%, #fffbeb 100%);\r\n    padding: 100px 5%;\r\n    position: relative;\r\n    overflow: hidden;\r\n    border-top: 1px solid #fde68a;\r\n    border-bottom: 1px solid #fde68a;\r\n}\r\n\r\n.dates-section * {\r\n    font-family: 'Lexend Deca', sans-serif !important;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.dates-section .d-orb {\r\n    position: absolute;\r\n    border-radius: 50%;\r\n    filter: blur(100px);\r\n    pointer-events: none;\r\n    z-index: 0;\r\n}\r\n.dates-section .d-orb-1 { width: 400px; height: 400px; top: -80px;    left: -80px;   background: rgba(251,191,36,0.12); }\r\n.dates-section .d-orb-2 { width: 350px; height: 350px; bottom: -60px; right: -60px;  background: rgba(240,82,40,0.10); }\r\n.dates-section .d-orb-3 { width: 250px; height: 250px; top: 40%;      left: 35%;     background: rgba(249,115,22,0.07); }\r\n\r\n.dates-section .dates-container {\r\n    max-width: 1050px;\r\n    margin: 0 auto;\r\n    position: relative;\r\n    z-index: 1;\r\n}\r\n\r\n.dates-section .dates-header {\r\n    text-align: center;\r\n    margin-bottom: 50px;\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    transition: opacity 0.8s ease, transform 0.8s ease;\r\n}\r\n.dates-section .dates-header.is-visible { opacity: 1; transform: translateY(0); }\r\n\r\n.dates-section .dates-title {\r\n    font-size: 1.4rem !important;\r\n    font-weight: 700 !important;\r\n    color: #0f172a;\r\n    display: inline-block;\r\n    position: relative;\r\n    padding-bottom: 12px;\r\n    margin: 0 0 10px 0;\r\n}\r\n.dates-section .dates-title::after {\r\n    content: '';\r\n    position: absolute;\r\n    bottom: 0;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    width: 60%;\r\n    height: 3px;\r\n    background: linear-gradient(to right, #f05228, #fbbf24);\r\n    border-radius: 2px;\r\n}\r\n\r\n.dates-section .dates-layout {\r\n    display: flex;\r\n    gap: 60px;\r\n    align-items: flex-start;\r\n}\r\n\r\n.dates-section .dates-img-col {\r\n    flex: 0 0 420px;\r\n    position: relative;\r\n    opacity: 0;\r\n    transform: translateY(40px);\r\n    transition: opacity 0.8s cubic-bezier(0.25, 1, 0.5, 1), transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);\r\n}\r\n.dates-section .dates-img-col.is-visible { opacity: 1; transform: translateY(0); }\r\n\r\n.dates-section .dates-img-wrap {\r\n    position: relative;\r\n    border-radius: 20px;\r\n    overflow: hidden;\r\n    box-shadow: 0 24px 64px rgba(240,82,40,0.15), 0 6px 20px rgba(0,0,0,0.08);\r\n    border: 1px solid rgba(251,191,36,0.20);\r\n    transition: box-shadow 0.4s ease, transform 0.4s ease;\r\n}\r\n.dates-section .dates-img-wrap:hover {\r\n    transform: translateY(-6px);\r\n    box-shadow: 0 32px 80px rgba(240,82,40,0.20), 0 8px 28px rgba(0,0,0,0.10);\r\n}\r\n\r\n.dates-section .dates-img-wrap img {\r\n    width: 100%;\r\n    height: auto;\r\n    aspect-ratio: 3 \/ 4;\r\n    object-fit: cover;\r\n    object-position: top center;\r\n    display: block;\r\n    transition: transform 0.6s ease;\r\n}\r\n.dates-section .dates-img-wrap:hover img { transform: scale(1.02); }\r\n\r\n.dates-section .dates-timeline-col { flex: 1; display: flex; flex-direction: column; }\r\n\r\n.dates-section .dates-tabs { display: flex; gap: 8px; margin-bottom: 32px; flex-wrap: wrap; }\r\n\r\n.dates-section .dates-tab {\r\n    padding: 6px 16px;\r\n    border-radius: 20px;\r\n    font-size: 0.70rem !important;\r\n    font-weight: 700 !important;\r\n    letter-spacing: 1px;\r\n    text-transform: uppercase;\r\n    border: 1.5px solid transparent;\r\n}\r\n.dates-section .tab-early    { background: rgba(251,191,36,0.10); color: #b45309; border-color: rgba(251,191,36,0.30); }\r\n.dates-section .tab-regular  { background: rgba(249,115,22,0.10); color: #c2410c; border-color: rgba(249,115,22,0.30); }\r\n.dates-section .tab-extended { background: rgba(240,82,40,0.10);  color: #9a3412; border-color: rgba(240,82,40,0.30); }\r\n\r\n.dates-section .tl-item {\r\n    display: flex;\r\n    gap: 0;\r\n    position: relative;\r\n    opacity: 0;\r\n    transform: translateX(28px);\r\n    transition: opacity 0.5s ease, transform 0.5s ease;\r\n}\r\n.dates-section .tl-item.visible { opacity: 1; transform: translateX(0); }\r\n\r\n.dates-section .tl-spine {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    width: 36px;\r\n    flex-shrink: 0;\r\n}\r\n\r\n.dates-section .tl-dot {\r\n    width: 14px;\r\n    height: 14px;\r\n    border-radius: 50%;\r\n    border: 2.5px solid #f05228;\r\n    background: #ffffff;\r\n    flex-shrink: 0;\r\n    margin-top: 20px;\r\n    position: relative;\r\n    z-index: 1;\r\n    transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;\r\n}\r\n.dates-section .tl-item:hover .tl-dot {\r\n    background: #f05228;\r\n    transform: scale(1.35);\r\n    box-shadow: 0 0 0 4px rgba(240,82,40,0.15);\r\n}\r\n\r\n.dates-section .tl-line {\r\n    width: 2px;\r\n    flex: 1;\r\n    min-height: 24px;\r\n    background: linear-gradient(to bottom, rgba(240,82,40,0.5), rgba(251,191,36,0.05));\r\n}\r\n.dates-section .tl-item:last-child .tl-line { background: transparent; }\r\n\r\n.dates-section .tl-card {\r\n    flex: 1;\r\n    background: #ffffff;\r\n    border-radius: 16px;\r\n    padding: 18px 22px;\r\n    margin: 8px 0 8px 10px;\r\n    border: 1px solid rgba(251,191,36,0.15);\r\n    box-shadow: 0 4px 20px rgba(240,82,40,0.05);\r\n    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;\r\n    position: relative;\r\n    overflow: hidden;\r\n}\r\n.dates-section .tl-card::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0; left: 0; bottom: 0;\r\n    width: 3px;\r\n    background: linear-gradient(to bottom, #f05228, #fbbf24);\r\n    border-radius: 3px 0 0 3px;\r\n    opacity: 0;\r\n    transition: opacity 0.3s ease;\r\n}\r\n.dates-section .tl-item:hover .tl-card {\r\n    transform: translateX(5px);\r\n    box-shadow: 0 8px 32px rgba(240,82,40,0.12);\r\n    border-color: rgba(240,82,40,0.20);\r\n}\r\n.dates-section .tl-item:hover .tl-card::before { opacity: 1; }\r\n\r\n.dates-section .tl-activity {\r\n    font-size: 0.90rem !important;\r\n    font-weight: 700 !important;\r\n    color: #0f172a;\r\n    margin-bottom: 12px;\r\n}\r\n\r\n.dates-section .tl-dates-row { display: flex; gap: 8px; flex-wrap: wrap; }\r\n\r\n.dates-section .tl-date-chip {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 5px;\r\n    padding: 4px 12px;\r\n    border-radius: 20px;\r\n    font-size: 0.72rem !important;\r\n    font-weight: 600 !important;\r\n}\r\n.dates-section .chip-early    { background: rgba(251,191,36,0.10); color: #b45309; border: 1px solid rgba(251,191,36,0.25); }\r\n.dates-section .chip-regular  { background: rgba(249,115,22,0.10); color: #c2410c; border: 1px solid rgba(249,115,22,0.25); }\r\n.dates-section .chip-extended { background: rgba(240,82,40,0.10);  color: #9a3412; border: 1px solid rgba(240,82,40,0.25); }\r\n.dates-section .chip-single   { background: rgba(251,191,36,0.15); color: #92400e; border: 1px solid rgba(251,191,36,0.35); }\r\n\r\n.dates-section .chip-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }\r\n.dates-section .chip-early    .chip-dot { background: #fbbf24; }\r\n.dates-section .chip-regular  .chip-dot { background: #f97316; }\r\n.dates-section .chip-extended .chip-dot { background: #f05228; }\r\n.dates-section .chip-single   .chip-dot { background: #92400e; }\r\n\r\n@media (max-width: 1024px) { .dates-section .dates-img-col { flex: 0 0 340px; } }\r\n@media (max-width: 860px) {\r\n    .dates-section .dates-layout { flex-direction: column; gap: 40px; }\r\n    .dates-section .dates-img-col { flex: unset; width: 100%; max-width: 400px; margin: 0 auto; }\r\n}\r\n@media (max-width: 768px) {\r\n    .dates-section { padding: 60px 5%; }\r\n    .dates-section .dates-title { font-size: 1.1rem !important; }\r\n}\r\n@media (max-width: 480px) {\r\n    .dates-section .dates-tabs { flex-wrap: wrap; }\r\n    .dates-section .tl-dates-row { flex-direction: column; gap: 6px; }\r\n}\r\n<\/style>\r\n\r\n<section class=\"dates-section\" id=\"important-dates\">\r\n    <div class=\"d-orb d-orb-1\"><\/div>\r\n    <div class=\"d-orb d-orb-2\"><\/div>\r\n    <div class=\"d-orb d-orb-3\"><\/div>\r\n\r\n    <div class=\"dates-container\">\r\n\r\n        <div class=\"dates-header scroll-anim\">\r\n            <h2 class=\"dates-title\">Important Dates<\/h2>\r\n        <\/div>\r\n\r\n        <div class=\"dates-layout\">\r\n\r\n            <div class=\"dates-img-col scroll-anim\">\r\n                <div class=\"dates-img-wrap\">\r\n                    <img decoding=\"async\" src=\"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-content\/uploads\/2026\/03\/INSEGT2026_Poster.jpg\" alt=\"INSEGT 2026 Call for Paper Poster\"\/>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"dates-timeline-col\">\r\n\r\n                <div class=\"dates-tabs\">\r\n                    <span class=\"dates-tab tab-early\">Early Bird<\/span>\r\n                    <span class=\"dates-tab tab-regular\">Regular<\/span>\r\n                    <span class=\"dates-tab tab-extended\">Extended<\/span>\r\n                <\/div>\r\n\r\n                <div class=\"tl-item\">\r\n                    <div class=\"tl-spine\"><div class=\"tl-dot\"><\/div><div class=\"tl-line\"><\/div><\/div>\r\n                    <div class=\"tl-card\">\r\n                        <div class=\"tl-activity\">Abstract Submission Deadline<\/div>\r\n                        <div class=\"tl-dates-row\">\r\n                            <span class=\"tl-date-chip chip-early\"><span class=\"chip-dot\"><\/span>8 August 2026<\/span>\r\n                            <span class=\"tl-date-chip chip-regular\"><span class=\"chip-dot\"><\/span>25 August 2026<\/span>\r\n                            <span class=\"tl-date-chip chip-extended\"><span class=\"chip-dot\"><\/span>5 September 2026<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"tl-item\">\r\n                    <div class=\"tl-spine\"><div class=\"tl-dot\"><\/div><div class=\"tl-line\"><\/div><\/div>\r\n                    <div class=\"tl-card\">\r\n                        <div class=\"tl-activity\">Abstract Acceptance Notification<\/div>\r\n                        <div class=\"tl-dates-row\">\r\n                            <span class=\"tl-date-chip chip-early\"><span class=\"chip-dot\"><\/span>11 August 2026<\/span>\r\n                            <span class=\"tl-date-chip chip-regular\"><span class=\"chip-dot\"><\/span>5 September 2026<\/span>\r\n                            <span class=\"tl-date-chip chip-extended\"><span class=\"chip-dot\"><\/span>7 September 2026<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"tl-item\">\r\n                    <div class=\"tl-spine\"><div class=\"tl-dot\"><\/div><div class=\"tl-line\"><\/div><\/div>\r\n                    <div class=\"tl-card\">\r\n                        <div class=\"tl-activity\">Registration Fee Payment Deadline<\/div>\r\n                        <div class=\"tl-dates-row\">\r\n                            <span class=\"tl-date-chip chip-early\"><span class=\"chip-dot\"><\/span>15 August 2026<\/span>\r\n                            <span class=\"tl-date-chip chip-regular\"><span class=\"chip-dot\"><\/span>10 September 2026<\/span>\r\n                            <span class=\"tl-date-chip chip-extended\"><span class=\"chip-dot\"><\/span>12 September 2026<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"tl-item\">\r\n                    <div class=\"tl-spine\"><div class=\"tl-dot\"><\/div><div class=\"tl-line\"><\/div><\/div>\r\n                    <div class=\"tl-card\">\r\n                        <div class=\"tl-activity\">Full Paper Submission Deadline<\/div>\r\n                        <div class=\"tl-dates-row\">\r\n                            <span class=\"tl-date-chip chip-early\"><span class=\"chip-dot\"><\/span>15 September 2026<\/span>\r\n                            <span class=\"tl-date-chip chip-single\"><span class=\"chip-dot\"><\/span>15 September 2026<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n(function () {\r\n    const observer = new IntersectionObserver((entries, observer) => {\r\n        entries.forEach(entry => {\r\n            if (entry.isIntersecting) { entry.target.classList.add('is-visible'); observer.unobserve(entry.target); }\r\n        });\r\n    }, { root: null, rootMargin: '0px', threshold: 0.15 });\r\n    document.querySelectorAll('.scroll-anim').forEach(el => observer.observe(el));\r\n\r\n    var items = document.querySelectorAll('.dates-section .tl-item');\r\n    function checkVisible() {\r\n        items.forEach(function (item, i) {\r\n            var rect = item.getBoundingClientRect();\r\n            if (rect.top < window.innerHeight - 60) {\r\n                setTimeout(function () { item.classList.add('visible'); }, i * 130);\r\n            }\r\n        });\r\n    }\r\n    window.addEventListener('scroll', checkVisible);\r\n    setTimeout(checkVisible, 300);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-190e196 e-con-full e-flex e-con e-parent\" data-id=\"190e196\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a5243d6 elementor-widget elementor-widget-html\" data-id=\"a5243d6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap');\r\n\r\n:root {\r\n    --accent-orange: #f05228;\r\n    --accent-yellow: #fbbf24;\r\n    --accent-amber: #f97316;\r\n    --text-dark: #0f172a;\r\n    --text-muted: #475569;\r\n}\r\n\r\n.registration-section {\r\n    font-family: 'Lexend Deca', sans-serif !important;\r\n    background: linear-gradient(180deg, #ffffff 0%, #fff7ed 100%);\r\n    padding: 100px 5%;\r\n    position: relative;\r\n    z-index: 2;\r\n    overflow: hidden;\r\n    border-top: 1px solid #fde68a;\r\n    border-bottom: 1px solid #fde68a;\r\n}\r\n.registration-section * { font-family: 'Lexend Deca', sans-serif !important; box-sizing: border-box; }\r\n\r\n.registration-section .bg-glow { position: absolute; border-radius: 50%; filter: blur(80px); z-index: 0; opacity: 0.12; }\r\n.registration-section .glow-1 { top: 10%; left: -5%; width: 300px; height: 300px; background: var(--accent-yellow); }\r\n.registration-section .glow-2 { bottom: 10%; right: -5%; width: 300px; height: 300px; background: var(--accent-orange); }\r\n\r\n.reg-container { max-width: 1050px; margin: 0 auto; position: relative; z-index: 1; }\r\n\r\n.reg-header { text-align: center; margin-bottom: 50px; }\r\n\r\n.reg-title {\r\n    font-size: 1.4rem;\r\n    font-weight: 700;\r\n    color: var(--text-dark);\r\n    display: inline-block;\r\n    position: relative;\r\n    padding-bottom: 12px;\r\n    margin: 0 0 10px 0;\r\n}\r\n.reg-title::after {\r\n    content: '';\r\n    position: absolute;\r\n    bottom: 0; left: 50%;\r\n    transform: translateX(-50%);\r\n    width: 60%;\r\n    height: 3px;\r\n    background: linear-gradient(to right, var(--accent-orange), var(--accent-yellow));\r\n    border-radius: 2px;\r\n}\r\n\r\n.reg-subtitle { font-size: 0.95rem; color: var(--text-muted); margin-top: 15px; }\r\n\r\n.pricing-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 40px; margin-bottom: 50px; }\r\n\r\n.pricing-card {\r\n    background: #ffffff;\r\n    border-radius: 20px;\r\n    border: 1px solid rgba(251, 191, 36, 0.2);\r\n    box-shadow: 0 10px 30px rgba(240, 82, 40, 0.04);\r\n    overflow: hidden;\r\n    transition: transform 0.4s ease, box-shadow 0.4s ease;\r\n    position: relative;\r\n}\r\n.pricing-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(240, 82, 40, 0.12); }\r\n\r\n.pricing-card-header {\r\n    padding: 30px 30px 20px 30px;\r\n    text-align: center;\r\n    border-bottom: 1px solid rgba(0, 0, 0, 0.05);\r\n    position: relative;\r\n}\r\n.card-early .pricing-card-header   { background: linear-gradient(to bottom, rgba(251, 191, 36, 0.07), transparent); }\r\n.card-regular .pricing-card-header { background: linear-gradient(to bottom, rgba(240, 82, 40, 0.06), transparent); }\r\n\r\n.pricing-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; }\r\n.card-early::before   { background: var(--accent-yellow); }\r\n.card-regular::before { background: var(--accent-orange); }\r\n\r\n.pricing-phase { font-size: 1.3rem; font-weight: 700; color: var(--text-dark); margin: 0 0 8px 0; }\r\n\r\n.pricing-date { display: inline-block; font-size: 0.85rem; font-weight: 600; padding: 6px 16px; border-radius: 20px; }\r\n.card-early .pricing-date   { background: rgba(251, 191, 36, 0.12); color: #92400e; }\r\n.card-regular .pricing-date { background: rgba(240, 82, 40, 0.10); color: #9a3412; }\r\n\r\n.pricing-card-body { padding: 30px; display: flex; flex-direction: column; gap: 20px; }\r\n\r\n.price-row { display: flex; flex-direction: column; padding-bottom: 15px; border-bottom: 1px dashed rgba(251, 191, 36, 0.3); }\r\n.price-row:last-child { border-bottom: none; padding-bottom: 0; }\r\n\r\n.price-amount { font-size: 1.5rem; font-weight: 700; color: var(--text-dark); margin-bottom: 4px; }\r\n.price-currency { font-size: 1rem; font-weight: 600; color: var(--text-muted); margin-right: 4px; }\r\n.price-desc { font-size: 0.9rem; color: var(--text-muted); line-height: 1.4; }\r\n\r\n.reg-notes-box {\r\n    background: rgba(251, 191, 36, 0.04);\r\n    border: 1px solid rgba(251, 191, 36, 0.2);\r\n    border-left: 4px solid var(--accent-yellow);\r\n    border-radius: 12px;\r\n    padding: 25px 30px;\r\n    display: flex;\r\n    gap: 20px;\r\n    align-items: flex-start;\r\n}\r\n.notes-icon { font-size: 1.5rem; flex-shrink: 0; margin-top: 2px; }\r\n.notes-content h4 { font-size: 1.05rem; font-weight: 700; color: var(--text-dark); margin: 0 0 10px 0; }\r\n.notes-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }\r\n.notes-list li { font-size: 0.9rem; color: var(--text-muted); line-height: 1.6; position: relative; padding-left: 20px; }\r\n.notes-list li::before { content: '\u2022'; color: var(--accent-orange); font-weight: bold; position: absolute; left: 0; top: 0; }\r\n\r\n.scroll-anim { opacity: 0; transform: translateY(30px); transition: opacity 0.8s cubic-bezier(0.25, 1, 0.5, 1), transform 0.8s cubic-bezier(0.25, 1, 0.5, 1); }\r\n.scroll-anim.is-visible { opacity: 1; transform: translateY(0); }\r\n.delay-1 { transition-delay: 0.1s; }\r\n.delay-2 { transition-delay: 0.3s; }\r\n\r\n@media (max-width: 900px) { .pricing-grid { grid-template-columns: 1fr; max-width: 500px; margin: 0 auto 50px auto; } }\r\n@media (max-width: 768px) {\r\n    .registration-section { padding: 60px 5%; scroll-margin-top: 80px; }\r\n    .reg-title { font-size: 1.1rem; }\r\n    .pricing-phase { font-size: 1.15rem; }\r\n    .price-amount { font-size: 1.3rem; }\r\n    .reg-notes-box { flex-direction: column; gap: 15px; padding: 20px; }\r\n    .notes-icon { margin-top: 0; }\r\n}\r\n<\/style>\r\n\r\n<section class=\"registration-section\" id=\"registration\">\r\n    <div class=\"bg-glow glow-1\"><\/div>\r\n    <div class=\"bg-glow glow-2\"><\/div>\r\n\r\n    <div class=\"reg-container\">\r\n\r\n        <div class=\"reg-header scroll-anim\">\r\n            <h2 class=\"reg-title\">Registration Fees<\/h2>\r\n            <p class=\"reg-subtitle\">Lorem ipsum dolor sit amet, consectetur adipiscing elit sed do eiusmod.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"pricing-grid\">\r\n            <div class=\"pricing-card card-early scroll-anim delay-1\">\r\n                <div class=\"pricing-card-header\">\r\n                    <h3 class=\"pricing-phase\">Phase 1 Title<\/h3>\r\n                    <span class=\"pricing-date\">Until DD MM YYYY<\/span>\r\n                <\/div>\r\n                <div class=\"pricing-card-body\">\r\n                    <div class=\"price-row\"><div class=\"price-amount\"><span class=\"price-currency\">IDR<\/span>X.XXX.XXX<\/div><div class=\"price-desc\">Lorem ipsum presenter category 1<\/div><\/div>\r\n                    <div class=\"price-row\"><div class=\"price-amount\"><span class=\"price-currency\">IDR<\/span>X.XXX.XXX<\/div><div class=\"price-desc\">Lorem ipsum presenter category 2<\/div><\/div>\r\n                    <div class=\"price-row\"><div class=\"price-amount\"><span class=\"price-currency\">USD<\/span>XX<\/div><div class=\"price-desc\">Lorem ipsum presenter category 3<\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"pricing-card card-regular scroll-anim delay-2\">\r\n                <div class=\"pricing-card-header\">\r\n                    <h3 class=\"pricing-phase\">Phase 2 Title<\/h3>\r\n                    <span class=\"pricing-date\">After DD MM YYYY<\/span>\r\n                <\/div>\r\n                <div class=\"pricing-card-body\">\r\n                    <div class=\"price-row\"><div class=\"price-amount\"><span class=\"price-currency\">IDR<\/span>X.XXX.XXX<\/div><div class=\"price-desc\">Lorem ipsum presenter category 1<\/div><\/div>\r\n                    <div class=\"price-row\"><div class=\"price-amount\"><span class=\"price-currency\">IDR<\/span>X.XXX.XXX<\/div><div class=\"price-desc\">Lorem ipsum presenter category 2<\/div><\/div>\r\n                    <div class=\"price-row\"><div class=\"price-amount\"><span class=\"price-currency\">USD<\/span>XX<\/div><div class=\"price-desc\">Lorem ipsum presenter category 3<\/div><\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"reg-notes-box scroll-anim delay-1\">\r\n            <div class=\"notes-icon\">\u2139\ufe0f<\/div>\r\n            <div class=\"notes-content\">\r\n                <h4>Important Notes<\/h4>\r\n                <ul class=\"notes-list\">\r\n                    <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.<\/li>\r\n                    <li>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.<\/li>\r\n                    <li>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.<\/li>\r\n                    <li>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<\/li>\r\n                <\/ul>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function() {\r\n    const observer = new IntersectionObserver((entries, observer) => {\r\n        entries.forEach(entry => { if (entry.isIntersecting) { entry.target.classList.add('is-visible'); observer.unobserve(entry.target); } });\r\n    }, { root: null, rootMargin: '0px', threshold: 0.15 });\r\n    document.querySelectorAll('.registration-section .scroll-anim').forEach(el => observer.observe(el));\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9812fc7 e-con-full e-flex e-con e-parent\" data-id=\"9812fc7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0e74f99 elementor-widget elementor-widget-html\" data-id=\"0e74f99\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap');\r\n\r\n:root {\r\n    --accent-orange: #f05228;\r\n    --accent-yellow: #fbbf24;\r\n    --accent-amber: #f97316;\r\n    --text-dark: #0f172a;\r\n    --text-muted: #475569;\r\n}\r\n\r\n.venue-section {\r\n    font-family: 'Lexend Deca', sans-serif;\r\n    background: linear-gradient(135deg, #ffffff 0%, #fff7ed 100%);\r\n    padding: 100px 5%;\r\n    position: relative;\r\n    z-index: 2;\r\n    border-top: 1px solid #fde68a;\r\n    border-bottom: 1px solid #fde68a;\r\n}\r\n\r\n.venue-container { max-width: 1100px; margin: 0 auto; }\r\n\r\n.venue-content {\r\n    display: grid;\r\n    grid-template-columns: 350px 1fr;\r\n    gap: 30px;\r\n    align-items: stretch;\r\n}\r\n\r\n.venue-info-card {\r\n    background: linear-gradient(135deg, #ffffff 0%, #fff7ed 100%);\r\n    padding: 40px 30px;\r\n    border-radius: 16px;\r\n    border: 1px solid rgba(251, 191, 36, 0.2);\r\n    box-shadow: 0 15px 35px rgba(240, 82, 40, 0.06);\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: flex-start;\r\n    transition: transform 0.3s ease, box-shadow 0.3s ease;\r\n}\r\n.venue-info-card:hover {\r\n    transform: translateY(-5px);\r\n    box-shadow: 0 20px 40px rgba(240, 82, 40, 0.10);\r\n}\r\n\r\n.icon-wrapper {\r\n    background: rgba(240, 82, 40, 0.10);\r\n    padding: 15px;\r\n    border-radius: 50%;\r\n    margin-bottom: 20px;\r\n}\r\n\r\n.venue-icon { color: var(--accent-orange); }\r\n\r\n.building-name {\r\n    font-size: 1.25rem;\r\n    font-weight: 700;\r\n    color: var(--text-dark);\r\n    margin: 0 0 15px 0;\r\n    line-height: 1.3;\r\n}\r\n\r\n.building-address {\r\n    font-size: 0.95rem;\r\n    color: var(--text-muted);\r\n    line-height: 1.6;\r\n    margin: 0 0 30px 0;\r\n}\r\n\r\n.btn-direction {\r\n    background: linear-gradient(135deg, var(--accent-orange) 0%, var(--accent-amber) 100%);\r\n    color: #ffffff;\r\n    padding: 10px 24px;\r\n    border-radius: 8px;\r\n    font-size: 0.95rem;\r\n    font-weight: 700;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 8px;\r\n    border: 2px solid var(--accent-orange);\r\n    transition: all 0.3s ease;\r\n    text-decoration: none;\r\n    width: 100%;\r\n}\r\n.dir-icon { font-size: 1.1rem; transition: transform 0.3s ease; }\r\n.btn-direction:hover {\r\n    background: transparent;\r\n    color: var(--accent-orange);\r\n    box-shadow: 0 5px 15px rgba(240, 82, 40, 0.2);\r\n}\r\n.btn-direction:hover .dir-icon { transform: translateX(5px); }\r\n\r\n.venue-map-wrapper {\r\n    width: 100%;\r\n    min-height: 400px;\r\n    border-radius: 16px;\r\n    overflow: hidden;\r\n    border: 1px solid rgba(251, 191, 36, 0.2);\r\n    box-shadow: 0 10px 25px rgba(240, 82, 40, 0.05);\r\n}\r\n\r\n@media (max-width: 992px) {\r\n    .venue-content { grid-template-columns: 1fr; gap: 40px; }\r\n    .venue-info-card { align-items: center; text-align: center; padding: 30px; }\r\n    .btn-direction { width: auto; }\r\n    .venue-map-wrapper { min-height: 350px; }\r\n}\r\n@media (max-width: 768px) {\r\n    .venue-section { padding: 60px 5%; scroll-margin-top: 80px; }\r\n    .building-name { font-size: 1.15rem; }\r\n    .building-address { font-size: 0.9rem; }\r\n    .venue-map-wrapper { min-height: 300px; border-radius: 12px; }\r\n}\r\n<\/style>\r\n\r\n<section class=\"venue-section\" id=\"venue\">\r\n    <div class=\"venue-container\">\r\n        <div class=\"venue-content\">\r\n\r\n            <div class=\"venue-info-card\">\r\n                <div class=\"icon-wrapper\">\r\n                    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"35\" height=\"35\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"venue-icon\">\r\n                        <path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\"><\/path>\r\n                        <circle cx=\"12\" cy=\"10\" r=\"3\"><\/circle>\r\n                    <\/svg>\r\n                <\/div>\r\n                <h3 class=\"building-name\">TOWER A UNJ<\/h3>\r\n                <p class=\"building-address\">\r\n                    Jl. Pemuda No.18, Rawamangun, Kec. Pulo Gadung, <br>\r\n                    Kota Jakarta Timur, Daerah Khusus Ibukota Jakarta 13220\r\n                <\/p>\r\n                <a href=\"https:\/\/maps.app.goo.gl\/wgj2ity7bQYxW9fb9\" target=\"_blank\" class=\"btn-direction\">\r\n                    Get Directions\r\n                    <span class=\"dir-icon\">\u2192<\/span>\r\n                <\/a>\r\n            <\/div>\r\n\r\n            <div class=\"venue-map-wrapper\">\r\n                <iframe\r\n                    src=\"https:\/\/www.google.com\/maps\/embed?pb=!1m18!1m12!1m3!1d769.2288954107976!2d106.87787936861262!3d-6.194816179537471!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2e69f4ea9eb058c3%3A0x44f1984e008e105b!2sUNJ%20Kampus%20A!5e0!3m2!1sid!2sid!4v1774517966781!5m2!1sid!2sid\"\r\n                    width=\"100%\"\r\n                    height=\"100%\"\r\n                    style=\"border:0;\"\r\n                    allowfullscreen=\"\"\r\n                    loading=\"lazy\"\r\n                    referrerpolicy=\"no-referrer-when-downgrade\">\r\n                <\/iframe>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6bc39ce e-con-full e-flex e-con e-parent\" data-id=\"6bc39ce\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-be1e58a elementor-widget elementor-widget-html\" data-id=\"be1e58a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Lexend+Deca:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n\r\n<style>\r\n:root {\r\n    --pub-bg-dark: #c2410c;\r\n    --pub-bg-darker: #7c2d12;\r\n    --pub-accent: #fbbf24;\r\n    --pub-text-main: #ffffff;\r\n    --pub-text-muted: rgba(255, 255, 255, 0.75);\r\n}\r\n\r\n.publisher-section {\r\n    font-family: 'Lexend Deca', system-ui, -apple-system, sans-serif;\r\n    background: linear-gradient(135deg, var(--pub-bg-dark) 0%, var(--pub-bg-darker) 100%);\r\n    padding: 100px 5%;\r\n    position: relative;\r\n    color: var(--pub-text-main);\r\n    overflow: hidden;\r\n}\r\n\r\n.pub-bg-stars {\r\n    position: absolute;\r\n    top: 0; left: 0; right: 0; bottom: 0;\r\n    background-image: radial-gradient(circle, rgba(255,255,255,0.12) 1px, transparent 1px);\r\n    background-size: 50px 50px;\r\n    z-index: 0;\r\n    animation: panBg 100s linear infinite;\r\n    pointer-events: none;\r\n}\r\n\r\n.pub-bg-nodes {\r\n    position: absolute;\r\n    top: 0; left: 0; right: 0; bottom: 0;\r\n    background-image: url(\"data:image\/svg+xml,%3Csvg width='200' height='200' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Ccircle cx='50' cy='50' r='2' fill='rgba(255,255,255,0.3)'\/%3E%3Ccircle cx='150' cy='80' r='3' fill='rgba(255,255,255,0.2)'\/%3E%3Ccircle cx='90' cy='160' r='2' fill='rgba(255,255,255,0.4)'\/%3E%3Ccircle cx='10' cy='120' r='1.5' fill='rgba(255,255,255,0.2)'\/%3E%3Ccircle cx='180' cy='180' r='2' fill='rgba(255,255,255,0.3)'\/%3E%3Cpath d='M50 50 L150 80 L90 160 Z' fill='none' stroke='rgba(255,255,255,0.06)' stroke-width='1'\/%3E%3Cpath d='M50 50 L10 120 L90 160' fill='none' stroke='rgba(255,255,255,0.04)' stroke-width='1'\/%3E%3Cpath d='M150 80 L180 180 L90 160' fill='none' stroke='rgba(255,255,255,0.05)' stroke-width='1'\/%3E%3C\/svg%3E\");\r\n    background-size: 250px 250px;\r\n    z-index: 0;\r\n    animation: panBg 60s linear infinite reverse;\r\n    pointer-events: none;\r\n}\r\n\r\n.pub-glow {\r\n    position: absolute;\r\n    border-radius: 50%;\r\n    filter: blur(80px);\r\n    z-index: 0;\r\n    opacity: 0.6;\r\n    animation: pulseGlow 8s ease-in-out infinite alternate;\r\n    pointer-events: none;\r\n}\r\n.pub-glow-1 { top: -10%; left: -10%; width: 400px; height: 400px; background: rgba(251, 191, 36, 0.20); }\r\n.pub-glow-2 { bottom: -20%; right: -10%; width: 500px; height: 500px; background: rgba(240, 82, 40, 0.25); }\r\n\r\n@keyframes panBg {\r\n    0%   { background-position: 0 0; }\r\n    100% { background-position: -500px -500px; }\r\n}\r\n\r\n@keyframes pulseGlow {\r\n    0%   { transform: scale(1) translate(0, 0); opacity: 0.4; }\r\n    100% { transform: scale(1.1) translate(30px, 30px); opacity: 0.7; }\r\n}\r\n\r\n.publisher-container {\r\n    max-width: 900px;\r\n    margin: 0 auto;\r\n    position: relative;\r\n    z-index: 1;\r\n}\r\n\r\n.pub-header {\r\n    margin-bottom: 30px;\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    transition: opacity 0.8s ease, transform 0.8s ease;\r\n}\r\n.pub-header.is-visible { opacity: 1; transform: translateY(0); }\r\n\r\n.pub-title {\r\n    font-size: 1.6rem;\r\n    font-weight: 700;\r\n    color: var(--pub-accent);\r\n    text-transform: uppercase;\r\n    letter-spacing: 1px;\r\n    margin-bottom: 25px;\r\n}\r\n\r\n.pub-intro {\r\n    font-size: 1rem;\r\n    line-height: 1.7;\r\n    color: var(--pub-text-main);\r\n    margin-bottom: 40px;\r\n    opacity: 0.9;\r\n}\r\n\r\n.pub-list-wrap {\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    transition: opacity 0.8s ease 0.2s, transform 0.8s ease 0.2s;\r\n}\r\n.pub-list-wrap.is-visible { opacity: 1; transform: translateY(0); }\r\n\r\n.pub-list { list-style: none; padding: 0; margin: 0 0 40px 0; }\r\n\r\n.pub-item { position: relative; padding-left: 24px; margin-bottom: 20px; }\r\n.pub-item::before {\r\n    content: '\u2022';\r\n    position: absolute;\r\n    left: 0; top: -2px;\r\n    color: var(--pub-accent);\r\n    font-size: 1.5rem;\r\n}\r\n\r\n.pub-name {\r\n    display: block;\r\n    font-size: 1.1rem;\r\n    font-weight: 700;\r\n    color: var(--pub-text-main);\r\n    margin-bottom: 4px;\r\n    line-height: 1.4;\r\n}\r\n\r\n.pub-category {\r\n    display: block;\r\n    font-size: 0.9rem;\r\n    color: var(--pub-text-muted);\r\n    font-weight: 400;\r\n}\r\n\r\n.pub-footer-note {\r\n    font-size: 0.95rem;\r\n    color: var(--pub-text-main);\r\n    line-height: 1.6;\r\n    border-top: 1px solid rgba(255, 255, 255, 0.15);\r\n    padding-top: 25px;\r\n    opacity: 0;\r\n    transform: translateY(30px);\r\n    transition: opacity 0.8s ease 0.4s, transform 0.8s ease 0.4s;\r\n}\r\n.pub-footer-note.is-visible { opacity: 1; transform: translateY(0); }\r\n\r\n.pub-highlight {\r\n    color: var(--pub-accent);\r\n    font-weight: 700;\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .publisher-section { padding: 70px 5%; }\r\n    .pub-title { font-size: 1.4rem; }\r\n    .pub-intro { font-size: 0.95rem; }\r\n    .pub-name { font-size: 1.05rem; }\r\n}\r\n<\/style>\r\n\r\n<section class=\"publisher-section\" id=\"publishers\">\r\n    <div class=\"pub-bg-stars\"><\/div>\r\n    <div class=\"pub-bg-nodes\"><\/div>\r\n    <div class=\"pub-glow pub-glow-1\"><\/div>\r\n    <div class=\"pub-glow pub-glow-2\"><\/div>\r\n\r\n    <div class=\"publisher-container\">\r\n\r\n        <div class=\"pub-header scroll-anim-pub\">\r\n            <h2 class=\"pub-title\">Proposed Publishers<\/h2>\r\n            <p class=\"pub-intro\">\r\n                Papers presented at the 2026 INSEGT conference that demonstrate high scientific quality and are selected by the committee will be recommended to submit an extended version of the manuscript to the following reputable indexed publishers.\r\n            <\/p>\r\n        <\/div>\r\n\r\n        <div class=\"pub-list-wrap scroll-anim-pub\">\r\n            <ul class=\"pub-list\">\r\n                <li class=\"pub-item\">\r\n                    <strong class=\"pub-name\">Pertanika Journal of Social Sciences and Humanities (PJJSH)<\/strong>\r\n                    <span class=\"pub-category\">Category: Journal Q1<\/span>\r\n                <\/li>\r\n                <li class=\"pub-item\">\r\n                    <strong class=\"pub-name\">UPM Press<\/strong>\r\n                    <span class=\"pub-category\">Category: Book Chapter\/Q4<\/span>\r\n                <\/li>\r\n                <li class=\"pub-item\">\r\n                    <strong class=\"pub-name\">Advances in Science, Technology & Innovation<\/strong>\r\n                    <span class=\"pub-category\">Category: Book Chapter\/Q4<\/span>\r\n                <\/li>\r\n                <li class=\"pub-item\">\r\n                    <strong class=\"pub-name\">IOP Publishing<\/strong>\r\n                    <span class=\"pub-category\">Category: Proceedings<\/span>\r\n                <\/li>\r\n                <li class=\"pub-item\">\r\n                    <strong class=\"pub-name\">Web of Conferences<\/strong>\r\n                    <span class=\"pub-category\">Category: Proceedings<\/span>\r\n                <\/li>\r\n                <li class=\"pub-item\">\r\n                    <strong class=\"pub-name\">AIP Publishing<\/strong>\r\n                    <span class=\"pub-category\">Category: Proceedings<\/span>\r\n                <\/li>\r\n                <li class=\"pub-item\">\r\n                    <strong class=\"pub-name\">Journal Sains Malaysiana<\/strong>\r\n                    <span class=\"pub-category\">Category: WOS Q3<\/span>\r\n                <\/li>\r\n                <li class=\"pub-item\">\r\n                    <strong class=\"pub-name\">Jurnal Kejuruteraan<\/strong>\r\n                    <span class=\"pub-category\">Category: ESCI WOS<\/span>\r\n                <\/li>\r\n            <\/ul>\r\n        <\/div>\r\n\r\n        <div class=\"pub-footer-note scroll-anim-pub\">\r\n            The above publishers and journals are indexed by reputable databases including:\r\n            <span class=\"pub-highlight\">SCOPUS<\/span>,\r\n            <span class=\"pub-highlight\">WOS<\/span>,\r\n            <span class=\"pub-highlight\">SINTA<\/span>, and\r\n            <span class=\"pub-highlight\">GOOGLE SCHOLAR<\/span>.\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", function() {\r\n    const pubObserver = new IntersectionObserver((entries, observer) => {\r\n        entries.forEach(entry => {\r\n            if (entry.isIntersecting) {\r\n                entry.target.classList.add('is-visible');\r\n                observer.unobserve(entry.target);\r\n            }\r\n        });\r\n    }, { root: null, rootMargin: '0px', threshold: 0.15 });\r\n    document.querySelectorAll('.scroll-anim-pub').forEach(el => pubObserver.observe(el));\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>INSEGT 2026 24 SEPTEMBER 2026 &#8211; JAKARTA INSEGT 2026 2nd International Conference On Innovation, Sustainability and Engineering For Global Transformation (INSEGT) 2026. 00 Days : 00 Hours : 00 Minutes : 00 Seconds &#8249; &#8250; INSEGT 2025 See More \u2192 Zoom Picture ICTVET 2018 Zoom Picture Co-Organizers \u2715 See the best presenters announcement here! See [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-11","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-json\/wp\/v2\/pages\/11","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-json\/wp\/v2\/comments?post=11"}],"version-history":[{"count":336,"href":"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-json\/wp\/v2\/pages\/11\/revisions"}],"predecessor-version":[{"id":838,"href":"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-json\/wp\/v2\/pages\/11\/revisions\/838"}],"wp:attachment":[{"href":"https:\/\/seminars.unj.ac.id\/insegt2026\/wp-json\/wp\/v2\/media?parent=11"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}