{"id":8,"date":"2026-08-11T18:19:30","date_gmt":"2026-08-11T18:19:30","guid":{"rendered":"https:\/\/safetoad.xyz\/?page_id=8"},"modified":"2026-08-11T19:14:47","modified_gmt":"2026-08-11T19:14:47","slug":"elementor-8","status":"publish","type":"page","link":"https:\/\/safetoad.xyz\/","title":{"rendered":"Elementor #8"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"8\" class=\"elementor elementor-8\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9fbb80f e-flex e-con-boxed e-con e-parent\" data-id=\"9fbb80f\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;video&quot;,&quot;background_video_link&quot;:&quot;https:\\\/\\\/safetoad.xyz\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/HERO-SAFETOAD.mp4&quot;,&quot;background_play_on_mobile&quot;:&quot;yes&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-background-video-container\">\n\t\t\t\t\t\t\t<video class=\"elementor-background-video-hosted elementor-html5-video\" autoplay muted playsinline loop><\/video>\n\t\t\t\t\t<\/div><div class=\"elementor-element elementor-element-def7b15 e-con-full e-flex e-con e-child\" data-id=\"def7b15\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-03f0a62 elementor-widget elementor-widget-html\" data-id=\"03f0a62\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<!-- SAFETOAD NAVIGATION BAR - PREMIUM GALAXY EDITION (REFINED PADDING) -->\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Dela+Gothic+One&family=Space+Grotesk:wght@500;600;700&display=swap\" rel=\"stylesheet\">\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\r\n\r\n<style>\r\n    \/* Reset Scope WordPress *\/\r\n    #st-nav-root *, #st-nav-root *::before, #st-nav-root *::after {\r\n        box-sizing: border-box;\r\n        margin: 0;\r\n        padding: 0;\r\n    }\r\n\r\n    #st-nav-root {\r\n        width: 100%;\r\n        max-width: 1240px;\r\n        margin: 0 auto;\r\n        padding: 20px 20px;\r\n        position: sticky;\r\n        top: 15px;\r\n        z-index: 9999;\r\n        background: transparent;\r\n        font-family: 'Space Grotesk', sans-serif;\r\n    }\r\n\r\n    \/* Galaxy Outline Animated Border Card Wrapper *\/\r\n    .st-navbar-wrapper {\r\n        position: relative;\r\n        border-radius: 100px;\r\n        padding: 2px; \/* Border thickness *\/\r\n        background: linear-gradient(90deg, #F59E0B, #10B981, #8B5CF6, #F59E0B);\r\n        background-size: 300% 300%;\r\n        animation: stGalaxyOutline 6s linear infinite;\r\n        box-shadow: 0 12px 35px rgba(0, 0, 0, 0.6), 0 0 20px rgba(245, 158, 11, 0.2);\r\n    }\r\n\r\n    @keyframes stGalaxyOutline {\r\n        0% { background-position: 0% 50%; }\r\n        50% { background-position: 100% 50%; }\r\n        100% { background-position: 0% 50%; }\r\n    }\r\n\r\n    \/* Glassmorphism Navbar Main Card *\/\r\n    .st-navbar {\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: space-between;\r\n        padding: 14px 28px;\r\n        background: rgba(5, 8, 17, 0.88);\r\n        backdrop-filter: blur(25px);\r\n        -webkit-backdrop-filter: blur(25px);\r\n        border-radius: 98px;\r\n        width: 100%;\r\n    }\r\n\r\n    \/* Brand Logo & Title Card Wrapper *\/\r\n    .st-brand {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 12px;\r\n        text-decoration: none !important;\r\n        padding: 6px 20px 6px 8px; \/* Proper padding for text breathe room *\/\r\n        background: rgba(255, 255, 255, 0.04);\r\n        border: 1px solid rgba(245, 158, 11, 0.2);\r\n        border-radius: 50px;\r\n        transition: all 0.3s ease;\r\n        shrink: 0;\r\n    }\r\n\r\n    .st-brand:hover {\r\n        background: rgba(245, 158, 11, 0.1);\r\n        border-color: rgba(245, 158, 11, 0.5);\r\n        box-shadow: 0 0 15px rgba(245, 158, 11, 0.3);\r\n    }\r\n\r\n    \/* ICON LOGO DENGAN BORDER GRADIEN GERAK MELINGKAR SMOOTH *\/\r\n    .st-logo-ring-wrapper {\r\n        position: relative;\r\n        width: 44px;\r\n        height: 44px;\r\n        border-radius: 50%;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        overflow: hidden;\r\n        padding: 2px;\r\n        shrink: 0;\r\n    }\r\n\r\n    .st-logo-ring-wrapper::before {\r\n        content: '';\r\n        position: absolute;\r\n        width: 150%;\r\n        height: 150%;\r\n        background: conic-gradient(#F59E0B, #10B981, #8B5CF6, #F59E0B);\r\n        animation: rotateRing 4s linear infinite;\r\n    }\r\n\r\n    @keyframes rotateRing {\r\n        0% { transform: rotate(0deg); }\r\n        100% { transform: rotate(360deg); }\r\n    }\r\n\r\n    .st-brand-logo {\r\n        position: relative;\r\n        width: 100%;\r\n        height: 100%;\r\n        border-radius: 50%;\r\n        object-fit: cover;\r\n        z-index: 1;\r\n        background: #050811;\r\n    }\r\n\r\n    .st-brand-title {\r\n        font-family: 'Dela Gothic One', cursive, sans-serif !important;\r\n        font-size: 1.25rem;\r\n        background: linear-gradient(135deg, #FFF3B0 0%, #F59E0B 50%, #D97706 100%);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        letter-spacing: 0.5px;\r\n        text-transform: uppercase;\r\n        white-space: nowrap;\r\n    }\r\n\r\n    \/* Desktop Navigation Links - Encased in Individual Cards *\/\r\n    .st-nav-menu {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 12px;\r\n        list-style: none !important;\r\n    }\r\n\r\n    .st-menu-card {\r\n        padding: 10px 24px; \/* Generous internal padding *\/\r\n        background: rgba(255, 255, 255, 0.03);\r\n        border: 1px solid rgba(255, 255, 255, 0.08);\r\n        border-radius: 50px;\r\n        transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n    }\r\n\r\n    .st-menu-card:hover {\r\n        background: rgba(245, 158, 11, 0.12);\r\n        border-color: rgba(245, 158, 11, 0.5);\r\n        transform: translateY(-2px);\r\n        box-shadow: 0 5px 15px rgba(245, 158, 11, 0.2);\r\n    }\r\n\r\n    .st-nav-link {\r\n        color: #e2e8f0 !important;\r\n        text-decoration: none !important;\r\n        font-family: 'Space Grotesk', sans-serif !important;\r\n        font-size: 0.95rem;\r\n        font-weight: 600;\r\n        transition: color 0.3s ease;\r\n        display: block;\r\n        white-space: nowrap;\r\n    }\r\n\r\n    .st-menu-card:hover .st-nav-link {\r\n        color: #FCD34D !important;\r\n    }\r\n\r\n    \/* ACTION BUTTON CONTAINER *\/\r\n    .st-action-container {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 12px;\r\n        margin-left: 8px;\r\n    }\r\n\r\n    \/* Buy Button Card - Balanced Padding & Breathing Room *\/\r\n    .st-btn-buy {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        gap: 10px;\r\n        padding: 12px 32px; \/* Ditingkatkan agar teks tidak terlalu mepet *\/\r\n        border-radius: 50px;\r\n        background: linear-gradient(135deg, #F59E0B 0%, #D97706 100%);\r\n        color: #04070f !important;\r\n        font-family: 'Space Grotesk', sans-serif !important;\r\n        font-weight: 700;\r\n        font-size: 0.95rem;\r\n        text-decoration: none !important;\r\n        box-shadow: 0 0 20px rgba(245, 158, 11, 0.4);\r\n        transition: all 0.3s ease;\r\n        border: none;\r\n        white-space: nowrap;\r\n        line-height: 1;\r\n    }\r\n\r\n    .st-btn-buy:hover {\r\n        transform: translateY(-2px) scale(1.02);\r\n        box-shadow: 0 0 30px rgba(245, 158, 11, 0.7);\r\n        filter: brightness(1.1);\r\n    }\r\n\r\n    \/* Mobile Hamburger Button Card *\/\r\n    .st-hamburger {\r\n        display: none;\r\n        background: rgba(255, 255, 255, 0.05);\r\n        border: 1px solid rgba(245, 158, 11, 0.3);\r\n        border-radius: 14px;\r\n        color: #F59E0B;\r\n        font-size: 1.3rem;\r\n        cursor: pointer;\r\n        padding: 10px 14px;\r\n        transition: all 0.3s ease;\r\n    }\r\n\r\n    .st-hamburger:hover {\r\n        background: rgba(245, 158, 11, 0.2);\r\n    }\r\n\r\n    \/* Mobile Drawer Overlay *\/\r\n    .st-mobile-overlay {\r\n        display: none;\r\n        position: fixed;\r\n        top: 95px;\r\n        left: 20px;\r\n        right: 20px;\r\n        background: rgba(5, 8, 17, 0.96);\r\n        backdrop-filter: blur(25px);\r\n        -webkit-backdrop-filter: blur(25px);\r\n        border: 1px solid rgba(245, 158, 11, 0.4);\r\n        border-radius: 24px;\r\n        padding: 20px;\r\n        flex-direction: column;\r\n        gap: 12px;\r\n        box-shadow: 0 20px 50px rgba(0, 0, 0, 0.9);\r\n        z-index: 9998;\r\n    }\r\n\r\n    .st-mobile-overlay.active {\r\n        display: flex;\r\n    }\r\n\r\n    .st-mobile-card {\r\n        padding: 16px 24px;\r\n        background: rgba(255, 255, 255, 0.03);\r\n        border: 1px solid rgba(255, 255, 255, 0.08);\r\n        border-radius: 16px;\r\n        text-align: center;\r\n        text-decoration: none !important;\r\n    }\r\n\r\n    .st-mobile-card .st-nav-link {\r\n        font-size: 1.05rem;\r\n    }\r\n\r\n    \/* Responsive Rules *\/\r\n    @media (max-width: 980px) {\r\n        .st-nav-menu {\r\n            display: none;\r\n        }\r\n\r\n        .st-hamburger {\r\n            display: block;\r\n        }\r\n\r\n        .st-navbar {\r\n            padding: 12px 20px;\r\n        }\r\n\r\n        .st-btn-buy {\r\n            padding: 10px 22px;\r\n            font-size: 0.88rem;\r\n        }\r\n\r\n        .st-brand {\r\n            padding: 4px 14px 4px 6px;\r\n        }\r\n\r\n        .st-brand-title {\r\n            font-size: 1.1rem;\r\n        }\r\n\r\n        .st-logo-ring-wrapper {\r\n            width: 38px;\r\n            height: 38px;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<!-- NAV BAR HTML -->\r\n<div id=\"st-nav-root\">\r\n    <div class=\"st-navbar-wrapper\">\r\n        <nav class=\"st-navbar\">\r\n            \r\n            <!-- Logo Brand (Dengan Border Gradien Berputar) -->\r\n            <a href=\"#\" class=\"st-brand\">\r\n                <div class=\"st-logo-ring-wrapper\">\r\n                    <img decoding=\"async\" src=\"https:\/\/safetoad.xyz\/wp-content\/uploads\/2026\/08\/ICON-WEB-SAFETOAD.png\" alt=\"SAFETOAD Logo\" class=\"st-brand-logo\">\r\n                <\/div>\r\n                <span class=\"st-brand-title\">SAFETOAD<\/span>\r\n            <\/a>\r\n\r\n            <!-- Desktop Menu Links -->\r\n            <ul class=\"st-nav-menu\">\r\n                <li class=\"st-menu-card\"><a href=\"#concept\" class=\"st-nav-link\">Concept<\/a><\/li>\r\n                <li class=\"st-menu-card\"><a href=\"#structure\" class=\"st-nav-link\">Structure<\/a><\/li>\r\n                <li class=\"st-menu-card\"><a href=\"#execution\" class=\"st-nav-link\">Execution<\/a><\/li>\r\n                <li class=\"st-menu-card\"><a href=\"#community\" class=\"st-nav-link\">Community<\/a><\/li>\r\n            <\/ul>\r\n\r\n            <!-- Action Button Container -->\r\n            <div class=\"st-action-container\">\r\n                <a href=\"YOUR-LINK\" class=\"st-btn-buy\" target=\"_blank\">\r\n                    Buy $SAFETOAD\r\n                <\/a>\r\n                <button class=\"st-hamburger\" id=\"stHamburgerBtn\" aria-label=\"Toggle Menu\">\r\n                    <i class=\"fa-solid fa-bars\"><\/i>\r\n                <\/button>\r\n            <\/div>\r\n        <\/nav>\r\n    <\/div>\r\n\r\n    <!-- Mobile Dropdown Menu -->\r\n    <div class=\"st-mobile-overlay\" id=\"stMobileOverlay\">\r\n        <a href=\"#concept\" class=\"st-mobile-card st-mobile-close\">\r\n            <span class=\"st-nav-link\">Concept<\/span>\r\n        <\/a>\r\n        <a href=\"#structure\" class=\"st-mobile-card st-mobile-close\">\r\n            <span class=\"st-nav-link\">Structure<\/span>\r\n        <\/a>\r\n        <a href=\"#execution\" class=\"st-mobile-card st-mobile-close\">\r\n            <span class=\"st-nav-link\">Execution<\/span>\r\n        <\/a>\r\n        <a href=\"#community\" class=\"st-mobile-card st-mobile-close\">\r\n            <span class=\"st-nav-link\">Community<\/span>\r\n        <\/a>\r\n    <\/div>\r\n<\/div>\r\n\r\n<!-- NAV BAR JAVASCRIPT -->\r\n<script>\r\n    document.addEventListener('DOMContentLoaded', function() {\r\n        var burgerBtn = document.getElementById('stHamburgerBtn');\r\n        var mobileOverlay = document.getElementById('stMobileOverlay');\r\n        var mobileLinks = document.querySelectorAll('.st-mobile-close');\r\n\r\n        \/\/ Toggle Mobile Menu\r\n        burgerBtn.addEventListener('click', function(e) {\r\n            e.stopPropagation();\r\n            mobileOverlay.classList.toggle('active');\r\n            var icon = burgerBtn.querySelector('i');\r\n            if(mobileOverlay.classList.contains('active')) {\r\n                icon.classList.remove('fa-bars');\r\n                icon.classList.add('fa-xmark');\r\n            } else {\r\n                icon.classList.remove('fa-xmark');\r\n                icon.classList.add('fa-bars');\r\n            }\r\n        });\r\n\r\n        \/\/ Close mobile menu on click\r\n        mobileLinks.forEach(function(link) {\r\n            link.addEventListener('click', function() {\r\n                mobileOverlay.classList.remove('active');\r\n                var icon = burgerBtn.querySelector('i');\r\n                icon.classList.remove('fa-xmark');\r\n                icon.classList.add('fa-bars');\r\n            });\r\n        });\r\n\r\n        \/\/ Close on click outside\r\n        document.addEventListener('click', function(e) {\r\n            if (!mobileOverlay.contains(e.target) && !burgerBtn.contains(e.target)) {\r\n                mobileOverlay.classList.remove('active');\r\n                var icon = burgerBtn.querySelector('i');\r\n                icon.classList.remove('fa-xmark');\r\n                icon.classList.add('fa-bars');\r\n            }\r\n        });\r\n    });\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-97572cb e-con-full e-flex e-con e-child\" data-id=\"97572cb\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b9a3193 e-flex e-con-boxed e-con e-parent\" data-id=\"b9a3193\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-beb4a4a e-con-full e-flex e-con e-child\" data-id=\"beb4a4a\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a0c63d1 elementor-widget elementor-widget-heading\" data-id=\"a0c63d1\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\/*! elementor - v3.23.0 - 05-08-2024 *\/\n.elementor-heading-title{padding:0;margin:0;line-height:1}.elementor-widget-heading .elementor-heading-title[class*=elementor-size-]>a{color:inherit;font-size:inherit;line-height:inherit}.elementor-widget-heading .elementor-heading-title.elementor-size-small{font-size:15px}.elementor-widget-heading .elementor-heading-title.elementor-size-medium{font-size:19px}.elementor-widget-heading .elementor-heading-title.elementor-size-large{font-size:29px}.elementor-widget-heading .elementor-heading-title.elementor-size-xl{font-size:39px}.elementor-widget-heading .elementor-heading-title.elementor-size-xxl{font-size:59px}<\/style><h2 class=\"elementor-heading-title elementor-size-default\">Add Your Heading Text Here<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a4fda4a elementor-widget elementor-widget-heading\" data-id=\"a4fda4a\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Add Your Heading Text Here<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6b21bc9 e-flex e-con-boxed e-con e-parent\" data-id=\"6b21bc9\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;video&quot;,&quot;background_video_link&quot;:&quot;https:\\\/\\\/safetoad.xyz\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/HERO-SAFETOAD1.mp4&quot;,&quot;background_play_on_mobile&quot;:&quot;yes&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-background-video-container\">\n\t\t\t\t\t\t\t<video class=\"elementor-background-video-hosted elementor-html5-video\" autoplay muted playsinline loop><\/video>\n\t\t\t\t\t<\/div><div class=\"elementor-element elementor-element-2928d8e e-con-full e-flex e-con e-child\" data-id=\"2928d8e\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f01d489 e-flex e-con-boxed e-con e-parent\" data-id=\"f01d489\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>SAFETOAD Concept Structure Execution Community Buy $SAFETOAD Concept Structure Execution Community Add Your Heading Text Here Add Your Heading Text Here<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/safetoad.xyz\/index.php?rest_route=\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/safetoad.xyz\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/safetoad.xyz\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/safetoad.xyz\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/safetoad.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8"}],"version-history":[{"count":8,"href":"https:\/\/safetoad.xyz\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":27,"href":"https:\/\/safetoad.xyz\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions\/27"}],"wp:attachment":[{"href":"https:\/\/safetoad.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}