html, body {
	max-width: 100%;
	overflow-x: hidden;
	position: relative;
}
body { 
	font-family: 'Space Grotesk', sans-serif; 
	background-color: #080808; 
	color: #ffffff;
	background-image: radial-gradient(at 0% 0%, hsla(161, 81%, 35%, 0.05) 0px, transparent 50%);
}

.outline-text {
	-webkit-text-stroke: 1px rgba(255,255,255,0.2);
	color: transparent;
}

.fadeLeft, .efek_masuk_dari_kiri {
    animation: slideFromLeft 0.8s ease-out forwards;
    will-change: transform, opacity;
}

.fadeRight, .efek_masuk_dari_kanan {
    animation: slideFromRight 0.8s ease-out forwards;
    will-change: transform, opacity;
}

@keyframes slideFromLeft {
    0% { 
        transform: translateX(-40px); 
        opacity: 0; 
    }
    100% { 
        transform: translateX(0); 
        opacity: 1; 
    }
}

@keyframes slideFromRight {
    0% { 
        transform: translateX(40px); 
        opacity: 0; 
    }
    100% { 
        transform: translateX(0); 
        opacity: 1; 
    }
}

/* Custom Scrollbar Kuning Amber-500 */
#mobile-menu::-webkit-scrollbar {
	width: 5px;
	display: block;
}
#mobile-menu::-webkit-scrollbar-thumb {
	background: #f59e0b; 
	border-radius: 10px;
}
/* Animasi buka tutup sub-menu agar smooth */
.submenu-active {
	display: flex !important;
	animation: fadeIn 0.3s ease;
}
@keyframes fadeIn {
	from { opacity: 0; transform: translateY(-10px); }
	to { opacity: 1; transform: translateY(0); }
}