/* 
 * MU Wizard - Rebuilt Visual Theme (Strict Parity with referencia.png)
 * Version 1.4.0
 */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&family=PT+Sans:wght@400;700&display=swap');

:root {
	/* Palette */
	--navy-950: #010610;
	--navy-900: #041226;
	--blue-800: #0b3b7c;
	--blue-600: #0088cc;
	--cyan-400: #00d2ff;
	--ice-100: #edf7ff;
	--silver-100: #ffffff;
	--silver-300: #c8d5e3;
	--gold-400: #d9b55a;
	--gold-500: #ffae00;
	--fire-500: #ff6a00;
	--fire-700: #c62c10;
	--success: #2ecc71;

	/* Fonts */
	--font-heading: 'Cinzel', Georgia, serif;
	--font-body: 'PT Sans', Helvetica, Arial, sans-serif;
}

/* Global Reset & Centered MMORPG Page Frame */
body.wizard-theme {
	background-color: var(--navy-950);
	background-image: radial-gradient(circle at center, #0b2246 0%, var(--navy-950) 80%);
	font-family: var(--font-body);
	color: #e2e8f0;
	margin: 0;
	padding: 20px 0;
	line-height: 1.5;
}

/* Metallic Portal Container with corner decorations */
.wizard-container {
	max-width: 1400px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background: #020915;
	border: 1px solid var(--blue-800);
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.9), 0 0 0 4px #041226, 0 0 0 5px var(--blue-800);
	box-sizing: border-box;
}

/* Corner decorations */
.wizard-corner {
	position: absolute;
	width: 14px;
	height: 14px;
	z-index: 150;
	pointer-events: none;
}
.wizard-corner.tl {
	top: -5px; left: -5px;
	border-top: 3px solid var(--gold-400);
	border-left: 3px solid var(--gold-400);
}
.wizard-corner.tr {
	top: -5px; right: -5px;
	border-top: 3px solid var(--gold-400);
	border-right: 3px solid var(--gold-400);
}
.wizard-corner.bl {
	bottom: -5px; left: -5px;
	border-bottom: 3px solid var(--gold-400);
	border-left: 3px solid var(--gold-400);
}
.wizard-corner.br {
	bottom: -5px; right: -5px;
	border-bottom: 3px solid var(--gold-400);
	border-right: 3px solid var(--gold-400);
}

/* Compact Header */
.wizard-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 80px;
	background: linear-gradient(180deg, #030e20 0%, #010610 100%);
	border-bottom: 2px solid var(--blue-800);
	padding: 0 40px;
	position: relative;
	z-index: 120;
}
.wizard-logo {
	position: absolute;
	left: 40px;
	top: -10px;
	z-index: 130;
}
.wizard-logo img {
	height: 105px;
	width: auto;
	filter: drop-shadow(0 0 15px rgba(0, 168, 255, 0.5));
}

/* Horizontal menu items aligned exactly */
.wizard-nav {
	margin-left: auto;
}
.wizard-nav-menu ul {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	align-items: center;
}
.wizard-nav-menu li.menu {
	display: flex;
	align-items: center;
	position: relative;
}
.wizard-nav-menu li.menu a {
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 1px;
	color: #94a3b8;
	text-decoration: none;
	padding: 6px 12px;
	transition: all 0.2s ease;
	text-transform: uppercase;
}
.wizard-nav-menu li.menu a:hover,
.wizard-nav-menu li.menu.active a {
	color: #ffffff;
	text-shadow: 0 0 8px rgba(0, 210, 255, 0.8);
}
.wizard-nav-menu li.menu.active a::after {
	content: '';
	position: absolute;
	bottom: -12px;
	left: 12px;
	right: 12px;
	height: 2px;
	background: var(--cyan-400);
	box-shadow: 0 0 8px var(--cyan-400);
}
.wizard-nav-menu li.menu:not(:last-child)::after {
	content: '♦';
	color: var(--cyan-400);
	text-shadow: 0 0 5px var(--cyan-400);
	font-size: 8px;
	margin: 0 4px;
	pointer-events: none;
}

/* Mobile Menu Toggle */
.we-nav-toggle {
	display: none;
	background: var(--blue-800);
	border: 1px solid var(--cyan-400);
	color: #fff;
	padding: 6px 12px;
	font-family: var(--font-heading);
	font-size: 12px;
	cursor: pointer;
	border-radius: 4px;
}

/* ==================================================== */
/* HERO SECTION                                         */
/* ==================================================== */
.wizard-hero {
	height: 460px;
	background-size: cover;
	background-position: center;
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	border-bottom: 1px solid rgba(11, 59, 124, 0.3);
}
.wizard-hero-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(90deg, rgba(2, 9, 21, 0.95) 0%, rgba(2, 9, 21, 0.7) 45%, rgba(2, 9, 21, 0.1) 100%);
	z-index: 1;
}
.wizard-hero-content {
	position: relative;
	z-index: 2;
	width: 100%;
	display: flex;
	padding: 0 80px;
	box-sizing: border-box;
}
.wizard-hero-left {
	flex: 0 0 55%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.wizard-hero-right {
	flex: 0 0 45%;
	position: relative;
	height: 440px;
}

/* Hero Typography */
.wizard-hero-title {
	font-family: var(--font-heading);
	font-size: 38px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
	margin: 0 0 10px 0;
	text-shadow: 0 4px 10px rgba(0,0,0,0.9), 0 0 15px rgba(0, 168, 255, 0.4);
}
.wizard-hero-title span {
	color: var(--cyan-400);
	text-shadow: 0 0 15px rgba(0, 210, 255, 0.8);
}
.wizard-hero-subtitle {
	font-size: 14px;
	color: #94a3b8;
	margin: 0 0 25px 0;
	max-width: 440px;
	text-shadow: 0 2px 4px rgba(0,0,0,0.6);
}

/* Stacked CTA actions */
.wizard-hero-actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: flex-start;
}
.wizard-btn-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-heading);
	font-weight: 700;
	text-decoration: none;
	border-radius: 3px;
	transition: all 0.2s ease;
	cursor: pointer;
}
.wizard-btn-play {
	width: 250px;
	height: 48px;
	font-size: 15px;
	letter-spacing: 1px;
	color: #ffffff;
	background: linear-gradient(180deg, #104c96 0%, #051c3b 100%);
	border: 2px solid var(--gold-400);
	box-shadow: 0 0 15px rgba(0, 210, 255, 0.4), inset 0 1px 3px rgba(255,255,255,0.2);
}
.wizard-btn-play:hover {
	background: linear-gradient(180deg, #176dc4 0%, #0a3161 100%);
	box-shadow: 0 0 20px rgba(0, 210, 255, 0.6);
	color: #ffffff;
}
.wizard-btn-register {
	width: 200px;
	height: 38px;
	font-size: 12px;
	color: #94a3b8;
	background: linear-gradient(180deg, #0e1726 0%, #030814 100%);
	border: 1px solid rgba(148, 163, 184, 0.4);
}
.wizard-btn-register:hover {
	border-color: var(--cyan-400);
	color: #ffffff;
	box-shadow: 0 0 10px rgba(0, 210, 255, 0.2);
}

/* Wizard Screen Blended Character */
.wizard-hero-character {
	position: absolute;
	right: 0px;
	bottom: 0px;
	width: 440px;
	height: 440px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: bottom right;
	mix-blend-mode: screen;
	z-index: 10;
	pointer-events: none;
}
.wizard-hero-aura {
	position: absolute;
	right: 140px;
	bottom: 180px;
	width: 170px;
	height: 170px;
	z-index: 5;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}
.wizard-hero-aura-inner {
	width: 100%;
	height: 100%;
	border: 2px dashed rgba(0, 210, 255, 0.4);
	border-radius: 50%;
	animation: rotateCircle 25s linear infinite;
	box-shadow: 0 0 25px rgba(0, 210, 255, 0.3), inset 0 0 15px rgba(0, 210, 255, 0.2);
}

@keyframes rotateCircle {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

/* ==================================================== */
/* EVENT BANNERS SECTION                                */
/* ==================================================== */
.wizard-events-section {
	padding: 12px 25px;
	background: #020915;
}
.wizard-events-grid {
	display: flex;
	gap: 15px;
}
.wizard-event-card {
	flex: 0 0 calc(50% - 7.5px);
	height: 250px;
	overflow: hidden;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	box-sizing: border-box;
}
.wizard-event-banner-art {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-size: cover;
	background-position: center;
}
.wizard-event-card-overlay {
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	background: linear-gradient(180deg, rgba(0,0,0,0.1) 0%, rgba(2, 9, 21, 0.9) 100%);
	z-index: 2;
}

/* Gold/Orange Faction Card (Castle Siege) */
.wizard-event-castle {
	border: 1px solid var(--gold-400);
	box-shadow: 0 0 20px rgba(255, 106, 0, 0.3), inset 0 0 15px rgba(255, 68, 0, 0.2);
}
.wizard-event-castle::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	border: 1px solid var(--gold-400);
	pointer-events: none;
	z-index: 4;
}

/* Silver/Blue Faction Card (War Devias) */
.wizard-event-devias {
	border: 1px solid var(--cyan-400);
	box-shadow: 0 0 20px rgba(0, 210, 255, 0.3), inset 0 0 15px rgba(0, 210, 255, 0.2);
}
.wizard-event-devias::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	border: 1px solid var(--cyan-400);
	pointer-events: none;
	z-index: 4;
}

.wizard-event-card-body {
	position: relative;
	z-index: 3;
	padding: 20px 25px;
	color: #fff;
}
.wizard-event-header-row {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 6px;
}
.wizard-event-emblem {
	width: 32px;
	height: 32px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.wizard-event-title {
	font-family: var(--font-heading);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 0.5px;
	margin: 0;
}
.wizard-event-castle .wizard-event-title {
	color: var(--gold-400);
}
.wizard-event-devias .wizard-event-title {
	color: var(--cyan-400);
}
.wizard-event-desc {
	font-size: 12px;
	color: #94a3b8;
	margin: 0 0 15px 0;
	line-height: 1.4;
	max-width: 85%;
}
.wizard-event-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 32px;
	padding: 0 20px;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 11px;
	text-decoration: none;
	border-radius: 3px;
	transition: all 0.2s;
}
.wizard-event-castle .wizard-event-btn {
	background: linear-gradient(180deg, #7c1a0a 0%, #4a0f05 100%);
	border: 1px solid var(--fire-700);
	color: #fff;
}
.wizard-event-castle .wizard-event-btn:hover {
	background: linear-gradient(180deg, #9c2310 0%, #5e1509 100%);
}
.wizard-event-devias .wizard-event-btn {
	background: linear-gradient(180deg, #0c3972 0%, #051c3b 100%);
	border: 1px solid var(--blue-800);
	color: #fff;
}
.wizard-event-devias .wizard-event-btn:hover:not(.disabled) {
	background: linear-gradient(180deg, #104c96 0%, #0b3b7c 100%);
}

/* ==================================================== */
/* LOWER GRID CONTENT AREA (70% / 30%)                  */
/* ==================================================== */
.wizard-home-content {
	padding: 15px 25px 30px 25px;
	background: #020915;
}
.wizard-content-grid {
	display: flex;
	gap: 20px;
}

/* Left content section (70%) */
.wizard-content-grid .we-content {
	flex: 0 0 70%;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* Right sidebar section (30%) */
.wizard-content-grid .we-sidebar {
	flex: 0 0 30%;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* 3-Column Panels inside Left Content Area */
.wizard-info-grid {
	display: flex;
	gap: 15px;
}
.wizard-info-grid .wizard-panel {
	flex: 0 0 calc(33.33% - 10px);
	display: flex;
	flex-direction: column;
	height: 330px;
}

/* Reusable Panels System */
.wizard-panel {
	background: #f8fafc;
	border: 1px solid var(--silver-300);
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
	border-radius: 4px;
	overflow: hidden;
}
.wizard-panel-header {
	background: linear-gradient(180deg, #082146 0%, #030c1d 100%);
	border-bottom: 2px solid var(--cyan-400);
	color: #ffffff;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.5px;
	padding: 10px 15px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.wizard-panel-header span {
	text-shadow: 0 0 8px rgba(0, 210, 255, 0.4);
}
.wizard-panel-header a {
	color: var(--cyan-400);
	font-size: 10px;
	text-decoration: none;
	font-weight: 700;
}
.wizard-panel-header a:hover {
	text-decoration: underline;
}
.wizard-panel-body {
	padding: 12px;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;
}

/* News rows */
.wizard-news-container {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.wizard-news-row {
	display: flex;
	gap: 10px;
	align-items: center;
}
.wizard-news-thumb {
	width: 44px;
	height: 44px;
	border-radius: 3px;
	border: 1px solid var(--silver-300);
	background-size: cover;
	background-position: center;
	flex-shrink: 0;
}
.wizard-news-details {
	display: flex;
	flex-direction: column;
}
.wizard-news-row-title {
	font-size: 12px;
	font-weight: 700;
	color: var(--blue-800);
	margin: 0;
	text-decoration: none;
	line-height: 1.3;
}
.wizard-news-row-title:hover {
	color: var(--blue-600);
}
.wizard-news-row-excerpt {
	font-size: 10px;
	color: #64748b;
	margin-top: 1px;
}
.wizard-news-row-date {
	font-size: 9px;
	color: #94a3b8;
	margin-top: 1px;
}

/* Event List rows */
.wizard-events-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.wizard-event-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 5px 8px;
	background: #f1f5f9;
	border: 1px solid #edf2f7;
	border-radius: 3px;
}
.wizard-event-info {
	display: flex;
	align-items: center;
	gap: 6px;
}
.wizard-event-icon {
	width: 20px;
	height: 20px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	flex-shrink: 0;
}
.wizard-event-row-title {
	font-size: 11px;
	font-weight: 700;
	color: var(--navy-900);
}
.wizard-event-row-time {
	font-size: 9px;
	color: #64748b;
}
.wizard-event-state {
	font-size: 9px;
	font-weight: 700;
	padding: 1px 6px;
	border-radius: 2px;
}
.wizard-event-state.active {
	background: rgba(46, 204, 113, 0.15);
	color: var(--success);
}
.wizard-event-state.waiting {
	background: rgba(11, 59, 124, 0.1);
	color: var(--blue-800);
}

/* Download widget with crystal */
.wizard-download-layout {
	display: flex;
	gap: 10px;
	height: 100%;
}
.wizard-download-left-card {
	flex: 0 0 35%;
	background: var(--navy-900);
	border: 1px solid var(--blue-800);
	border-radius: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: inset 0 0 10px rgba(0, 210, 255, 0.2);
}
.wizard-blue-crystal {
	width: 32px;
	height: 48px;
	background: radial-gradient(ellipse at center, #00d2ff 0%, rgba(11, 59, 124, 0) 70%);
	position: relative;
	animation: floatCrystal 4s ease-in-out infinite;
}
.wizard-blue-crystal::after {
	content: '';
	position: absolute;
	top: 8px; left: 8px; width: 16px; height: 32px;
	background: #00d2ff;
	clip-path: polygon(50% 0%, 100% 35%, 100% 70%, 50% 100%, 0% 70%, 0% 35%);
	box-shadow: 0 0 12px #00d2ff;
}
.wizard-download-right-info {
	flex: 0 0 65%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.wizard-download-title {
	font-size: 13px;
	font-weight: 700;
	color: var(--blue-800);
	margin: 0;
}
.wizard-download-specs {
	list-style: none;
	padding: 0;
	margin: 5px 0;
	font-size: 10px;
	color: #64748b;
}
.wizard-download-specs li {
	margin-bottom: 2px;
}
.wizard-download-button {
	background: linear-gradient(180deg, #104c96 0%, #051c3b 100%);
	border: 2px solid var(--gold-400);
	color: #fff;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 11px;
	height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	border-radius: 3px;
	transition: all 0.2s;
	width: 100%;
}
.wizard-download-button:hover {
	background: linear-gradient(180deg, #176dc4 0%, #0a3161 100%);
}
.wizard-download-link-small {
	text-align: center;
	font-size: 9px;
	color: #94a3b8;
	text-decoration: none;
	display: block;
	margin-top: 3px;
}

/* Rankings & Highlights row */
.wizard-ranking-row-container {
	display: flex;
	gap: 15px;
}
.wizard-ranking-column-left {
	flex: 0 0 68%;
}
.wizard-ranking-column-right {
	flex: 0 0 32%;
}

.wizard-ranking-column-left .wizard-panel,
.wizard-ranking-column-right .wizard-panel {
	height: 160px;
}

.wizard-ranking-horizontal {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 100%;
	padding: 0 15px;
}
.wizard-ranking-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	flex: 1;
	gap: 6px;
}
.wizard-ranking-badge {
	width: 22px;
	height: 22px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 11px;
	border-radius: 50%;
}
.wizard-ranking-item:nth-child(1) .wizard-ranking-badge {
	background: linear-gradient(180deg, #ffd700 0%, #b8860b 100%);
	color: #000;
	border: 1px solid #fff;
}
.wizard-ranking-item:nth-child(2) .wizard-ranking-badge {
	background: linear-gradient(180deg, #e6e6e6 0%, #909090 100%);
	color: #000;
	border: 1px solid #fff;
}
.wizard-ranking-item:nth-child(3) .wizard-ranking-badge {
	background: linear-gradient(180deg, #cd7f32 0%, #8b4513 100%);
	color: #fff;
	border: 1px solid #fff;
}
.wizard-ranking-item:nth-child(4) .wizard-ranking-badge,
.wizard-ranking-item:nth-child(5) .wizard-ranking-badge {
	background: #f1f5f9;
	color: var(--blue-800);
	border: 1px solid var(--silver-300);
}

.wizard-ranking-avatar {
	width: 38px;
	height: 38px;
	border-radius: 4px;
	border: 1px solid var(--silver-300);
	object-fit: cover;
}
.wizard-ranking-item-info {
	display: flex;
	flex-direction: column;
}
.wizard-ranking-charname {
	font-size: 11px;
	font-weight: 700;
	color: var(--blue-800);
	text-decoration: none;
}
.wizard-ranking-chardetails {
	font-size: 9px;
	color: #64748b;
}

.wizard-highlights-vertical {
	display: flex;
	flex-direction: column;
	gap: 5px;
	justify-content: center;
	height: 100%;
}
.wizard-highlight-row {
	display: flex;
	justify-content: space-between;
	font-size: 11px;
	border-bottom: 1px dashed #e2e8f0;
	padding-bottom: 2px;
}
.wizard-highlight-label {
	color: #64748b;
}
.wizard-highlight-value {
	font-weight: 700;
	color: var(--blue-800);
}

/* ==================================================== */
/* SIDEBAR / AUXILIARY MODULES DESIGN SYSTEM            */
/* ==================================================== */
.we-sidebar .wizard-panel {
	background: #020b18;
	border: 1px solid var(--blue-800);
	box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}
.we-sidebar .wizard-panel-header {
	background: linear-gradient(180deg, #0b3b7c 0%, #030e20 100%);
	border-bottom: 2px solid var(--gold-400);
}
.we-sidebar .we-card-body {
	padding: 15px;
	background: #020915;
}

/* Input Fields restyled to match dark portal */
.we-field {
	margin-bottom: 12px;
}
.we-label {
	display: block;
	font-family: var(--font-heading);
	font-size: 10px;
	letter-spacing: 0.5px;
	color: var(--gold-400);
	margin-bottom: 4px;
	text-transform: uppercase;
}
.we-input {
	width: 100%;
	height: 34px;
	background: #041226;
	border: 1px solid var(--blue-800);
	border-radius: 3px;
	padding: 0 10px;
	box-sizing: border-box;
	font-family: var(--font-body);
	color: #fff;
	font-size: 12px;
	transition: all 0.2s;
}
.we-input:focus {
	outline: none;
	border-color: var(--cyan-400);
	box-shadow: 0 0 5px rgba(0, 210, 255, 0.4);
}
.we-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 34px;
	padding: 0 15px;
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 11px;
	border-radius: 3px;
	cursor: pointer;
	transition: all 0.2s;
	border: none;
}
.we-btn-primary {
	background: linear-gradient(180deg, #104c96 0%, #051c3b 100%);
	border: 1px solid var(--cyan-400);
	color: #fff;
	width: 100%;
}
.we-btn-primary:hover {
	background: linear-gradient(180deg, #176dc4 0%, #0a3161 100%);
	box-shadow: 0 0 10px rgba(0, 210, 255, 0.4);
}
.we-links {
	display: flex;
	justify-content: space-between;
	margin-top: 10px;
	font-size: 10px;
}
.we-links a {
	color: var(--cyan-400);
	text-decoration: none;
}
.we-links a:hover {
	text-decoration: underline;
}

/* Sidebar List */
.we-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.we-list li {
	display: flex;
	justify-content: space-between;
	padding: 6px 0;
	border-bottom: 1px solid rgba(11, 59, 124, 0.3);
	font-size: 11px;
	color: #a0b0c5;
}
.we-list li strong {
	color: #ffffff;
}

/* Social Buttons */
.we-social {
	display: flex;
	gap: 10px;
}
.we-social-btn {
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	height: 32px;
	background: #041226;
	border: 1px solid var(--blue-800);
	border-radius: 3px;
	font-size: 10px;
	font-weight: 700;
	color: #94a3b8;
	text-decoration: none;
	transition: all 0.2s;
}
.we-social-btn:hover {
	border-color: var(--cyan-400);
	color: #fff;
}
.we-social-btn svg {
	width: 12px;
	height: 12px;
	fill: currentColor;
}

/* Collapsible sidebar behaviors */
.we-card-body {
	display: block;
}
.we-card[data-collapsible="1"]:not(.is-open) .we-card-body {
	display: none;
}

/* ==================================================== */
/* COMPACT FOOTER                                       */
/* ==================================================== */
.wizard-footer {
	background: #010611;
	border-top: 2px solid var(--blue-800);
	padding: 40px 0 20px 0;
	position: relative;
	z-index: 50;
	color: #64748b;
}
.wizard-footer-emblem {
	position: absolute;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
	width: 60px;
	height: 60px;
	background: #010611;
	border: 2px solid var(--blue-800);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 0 20px rgba(0, 168, 255, 0.5);
	z-index: 60;
}
.wizard-footer-emblem-icon {
	width: 38px;
	height: 38px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.wizard-footer-grid {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	padding: 0 40px;
}
.wizard-footer-col {
	flex: 1;
}
.wizard-footer-col h4 {
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 12px;
	color: #ffffff;
	margin: 0 0 10px 0;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
.wizard-footer-col ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.wizard-footer-col ul li {
	margin-bottom: 6px;
	font-size: 11px;
}
.wizard-footer-col ul li a {
	color: #64748b;
	text-decoration: none;
	transition: color 0.2s;
}
.wizard-footer-col ul li a:hover {
	color: var(--cyan-400);
}

/* Double sub-column layout for Links Rapidos */
.wizard-footer-links-double {
	display: flex;
	gap: 15px;
}
.wizard-footer-links-double ul {
	flex: 1;
}

/* ==================================================== */
/* RESPONSIVE MEDIA QUERIES                             */
/* ==================================================== */
@media (max-width: 1024px) {
	.wizard-logo {
		left: 20px;
	}
	.wizard-logo img {
		height: 90px;
	}
	.wizard-hero-content {
		padding: 0 30px;
	}
	.wizard-hero-title {
		font-size: 32px;
	}
	.wizard-events-grid {
		flex-direction: column;
	}
	.wizard-event-card {
		flex: 0 0 100%;
	}
	.wizard-content-grid {
		flex-direction: column;
	}
	.we-content, .we-sidebar {
		flex: 0 0 100% !important;
	}
	.wizard-info-grid {
		flex-direction: column;
	}
	.wizard-info-grid .wizard-panel {
		flex: 0 0 100%;
		height: auto;
	}
	.wizard-ranking-row-container {
		flex-direction: column;
	}
	.wizard-ranking-column-left,
	.wizard-ranking-column-right {
		flex: 0 0 100%;
	}
	.wizard-ranking-horizontal {
		flex-direction: column;
		height: auto;
		gap: 12px;
		align-items: flex-start;
		padding: 15px;
	}
	.wizard-ranking-item {
		flex-direction: row;
		text-align: left;
		width: 100%;
	}
	.wizard-footer-grid {
		flex-wrap: wrap;
	}
	.wizard-footer-col {
		flex: 0 0 calc(50% - 10px);
	}
}

@media (max-width: 979px) {
	.we-nav-toggle {
		display: block;
	}
	.wizard-nav-menu {
		display: none;
		position: absolute;
		top: 80px;
		left: 0;
		right: 0;
		background: #041226;
		border-bottom: 2px solid var(--blue-800);
		box-shadow: 0 10px 20px rgba(0,0,0,0.8);
		z-index: 100;
	}
	.wizard-nav-menu.is-open {
		display: block;
	}
	.wizard-nav-menu ul {
		flex-direction: column;
		align-items: stretch;
		padding: 10px 0;
	}
	.wizard-nav-menu li.menu:not(:last-child)::after {
		display: none;
	}
	.wizard-nav-menu li.menu a {
		padding: 12px 30px;
		width: 100%;
		box-sizing: border-box;
	}
	.wizard-hero-character {
		display: none;
	}
	.wizard-hero-aura {
		display: none;
	}
	.wizard-hero-left {
		flex: 0 0 100%;
	}
}