/* ===== UnRealMU Responsive CSS ===== */
/* Separate file for all media queries and responsive behavior */

/* ===== HAMBURGER MENU (Mobile) ===== */
.wz-hamburger {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
	padding: 10px;
	z-index: 1001;
}
.wz-hamburger span {
	display: block;
	width: 24px;
	height: 2px;
	background: #fff;
	margin: 5px 0;
	transition: 0.3s;
}
.wz-hamburger.active span:nth-child(1) {
	transform: rotate(45deg) translate(5px, 5px);
}
.wz-hamburger.active span:nth-child(2) {
	opacity: 0;
}
.wz-hamburger.active span:nth-child(3) {
	transform: rotate(-45deg) translate(5px, -5px);
}



/* ===== RESPONSIVE: Tablet (769px - 1024px) ===== */
@media (max-width: 1024px) {
	.wz-nav-content {
		padding: 0 15px !important;
	}
	.wz-gnb__text {
		font-size: 12px !important;
	}
	.wz__bi--nav {
		height: 45px !important;
	}
	.mz-promotion, .mz-slider {
		height: 400px !important;
	}
	.mz-paging-wrapper {
		display: none !important;
	}
	.mz-slider-info {
		width: 90% !important;
		margin-left: -45% !important;
		bottom: 40px !important;
	}
	.mz-slider-info h3 {
		font-size: 24px !important;
	}
	.main__info__box {
		flex-direction: column !important;
		padding: 0 15px !important;
	}
	.main_ranking, .main_hall_of_fame {
		width: 100% !important;
	}
	.main__info-guide {
		width: 100% !important;
	}
	.main__info {
		height: auto !important;
	}
	.unreal-global-header menu {
		display: none !important;
	}
}

/* ===== RESPONSIVE: Mobile (<=768px) ===== */
@media (max-width: 768px) {
	/* Show hamburger */
	.wz-hamburger {
		display: block !important;
	}

	/* Hide desktop nav */
	.wz-gnb__list {
		display: none !important;
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		width: 100% !important;
		height: 100vh !important;
		background: rgba(0, 0, 0, 0.95) !important;
		z-index: 9999 !important;
		flex-direction: column !important;
		justify-content: center !important;
		align-items: center !important;
		gap: 0 !important;
		padding-top: 60px !important;
		overflow-y: auto !important;
	}

	.wz-gnb__list.mobile-open {
		display: flex !important;
	}

	.wz-gnb__item {
		width: 100% !important;
		text-align: center !important;
		border-bottom: 1px solid #333 !important;
	}

	.wz-gnb__link {
		padding: 18px 0 !important;
		display: block !important;
	}

	.wz-gnb__text {
		font-size: 18px !important;
	}

	.wz-lnb__list {
		position: static !important;
		background: rgba(255, 255, 255, 0.05) !important;
		padding: 10px 0 !important;
	}

	.wz-lnb__item {
		padding: 10px 0 !important;
	}

	.wz-lnb__text {
		font-size: 14px !important;
	}

	/* Nav bar */
	.wz-nav, .wz-nav--fixed {
		height: 60px !important;
	}
	.wz-nav-content {
		height: 60px !important;
	}
	.wz__bi--nav {
		height: 40px !important;
	}
	.wz-nav--download {
		display: none !important;
	}

	/* Global header */
	.unreal-global-header {
		padding: 0 10px !important;
	}
	.unreal-global-header h1 a {
		font-size: 14px !important;
	}
	.unreal-global-header article a {
		font-size: 10px !important;
	}

	/* Slider */
	.mz-promotion, .mz-slider {
		height: 300px !important;
	}
	.mz-paging-wrapper {
		display: none !important;
	}
	.mz-slider-info {
		width: 90% !important;
		margin-left: -45% !important;
		bottom: 20px !important;
	}
	.mz-slider-info h3 {
		font-size: 20px !important;
	}
	.mz-slider-info span {
		font-size: 13px !important;
	}

	/* Content */
	.wz-container {
		padding: 0 15px !important;
	}
	.main__info__box {
		flex-direction: column !important;
		padding: 0 10px !important;
	}
	.main_ranking, .main_hall_of_fame {
		width: 100% !important;
	}
	.main__info-guide {
		width: 100% !important;
		margin-top: 30px !important;
	}
	.main__info {
		height: auto !important;
	}
	.main__intro {
		height: auto !important;
		padding: 30px 15px !important;
	}

	/* My Account dropdown for mobile */
	.nickname.selected {
		font-size: 11px !important;
		height: 44px !important;
		line-height: 44px !important;
	}
	.my-contents.list {
		top: 44px !important;
	}
}