/* =========================================================
   Template Voltrex · Mu Voltrex
   Tema oscuro azul real + dorado + energía eléctrica.
   Se carga después de style.css y redefine sus variables.
   ========================================================= */
:root {
	--vx-ink: #05070f;
	--vx-navy: #0a1230;
	--vx-panel: #0b1433;
	--vx-line: #233370;
	--vx-line2: #1a2656;
	--vx-gold: #e8b85a;
	--vx-gold2: #ffe3a1;
	--vx-golddk: #8a6420;
	--vx-volt: #2f8dff;
	--vx-volt2: #8fd4ff;
	--vx-txt: #b4c0de;
	--vx-head: #f3e6c4;
	--vx-muted: #6c7ba3;

	--webenginebg1: var(--vx-ink);
	--webenginebg2: transparent;
	--webenginebg3: transparent;
	--webenginecolor1: var(--vx-gold);
	--webenginecolor2: var(--vx-txt);
	--webenginecolor3: var(--vx-volt2);
	--webenginecolor4: #ffffff;
	--webenginecolor5: var(--vx-navy);
	--webenginecolor6: var(--vx-gold2);
	--webenginecolor7: var(--vx-gold);
	--webenginecolor8: #13235e;
	--webenginecolor9: var(--vx-gold2);
	--webenginecolor10: var(--vx-gold);
	--webenginecolor11: var(--vx-gold);
	--webenginecolor12: #1a1100;
	--webenginecolor13: var(--vx-gold2);
	--webenginecolor14: var(--vx-muted);
	--webenginecolor63: var(--vx-line2);
	--webenginecolor15: #070d24;
	--webenginecolor16: var(--vx-line);
	--webenginecolor17: #e6ecff;
	--webenginecolor18: var(--vx-volt);
	--webenginecolor19: #d9cfb6;
	--webenginecolor20: var(--vx-gold2);
	--webenginecolor21: var(--vx-line2);
	--webenginecolor22: var(--vx-panel);
	--webenginecolor23: var(--vx-muted);
	--webenginecolor24: var(--vx-navy);
	--webenginecolor25: var(--vx-txt);
	--webenginecolor26: var(--vx-gold);
	--webenginecolor27: var(--vx-panel);
	--webenginecolor28: #0d1840;
	--webenginecolor33: var(--vx-txt);
	--webenginecolor39: var(--vx-navy);
	--webenginecolor40: var(--vx-txt);
	--webenginecolor41: #ffffff;
	--webenginecolor49: #6dffb0;
	--webenginecolor52: var(--vx-volt);
	--webenginecolor54: var(--vx-navy);
	--webenginecolor57: var(--vx-volt2);
	--webenginecolor59: #ffffff;
	--webenginecolor60: var(--vx-head);
	--webenginecolor61: var(--vx-txt);
}

html { min-width: 1100px; }
body {
	background: var(--vx-ink) !important;
	color: var(--vx-txt);
	font-family: 'Rajdhani', 'PT Sans', sans-serif;
	font-size: 16px;
	font-weight: 500;
}
a { color: var(--vx-volt2); }
a:hover, a:focus { color: #ffffff !important; }
h1, h2, h3, h4, .panel-title, .page-title { font-family: 'Cinzel', Georgia, serif; }

.vx-gold {
	background: linear-gradient(180deg, #fff2c6 0%, #f0c062 45%, #a0721f 62%, #f6d488 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ---------- barra superior ---------- */
.vx-top {
	position: absolute; top: 0; left: 0; right: 0; z-index: 20;
	display: flex; align-items: center; justify-content: space-between; gap: 20px;
	padding: 12px 40px;
	background: linear-gradient(#03050cee, #03050c00);
}
.vx-brand { display: flex; align-items: center; gap: 10px; text-decoration: none !important; }
.vx-brand img { width: 64px; height: auto; }
.vx-brand span { font-family: 'Cinzel', serif; font-weight: 900; font-size: 20px; letter-spacing: 2px; }

#navbar { width: auto; flex: 1; backdrop-filter: none; border: 0; }
#navbar ul { text-align: center; }
#navbar ul li { font-size: 13px; }
#navbar ul li a {
	padding: 10px 16px;
	font-family: 'Cinzel', serif; font-weight: 700; letter-spacing: 2px;
	position: relative;
}
#navbar ul li a:after {
	content: ""; position: absolute; left: 16px; right: 16px; bottom: 2px; height: 2px;
	background: linear-gradient(90deg, transparent, var(--vx-gold), transparent);
	opacity: 0; transition: opacity .25s;
}
#navbar ul li a:hover:after { opacity: 1; }

.vx-acct { display: flex; align-items: center; gap: 10px; }
.vx-btn {
	display: inline-block;
	font-family: 'Cinzel', serif; font-weight: 700; font-size: 12px; letter-spacing: 2px; text-transform: uppercase;
	padding: 9px 18px;
	color: var(--vx-gold2) !important;
	border: 1px solid var(--vx-gold);
	background: rgba(10,18,48,.7);
	text-decoration: none !important;
	transition: box-shadow .2s, background .2s;
}
.vx-btn:hover { box-shadow: 0 0 16px rgba(232,184,90,.45); background: rgba(19,35,94,.9); }
.vx-btn-fill { color: #1a1100 !important; background: linear-gradient(#ffe3a1, #e8b85a 55%, #b88426); border-color: #ffe3a1; box-shadow: 0 0 14px rgba(232,184,90,.35); }
.vx-btn-fill:hover { background: linear-gradient(#fff0c8, #f0c46a 55%, #c8952e); color: #1a1100 !important; }
.vx-btn-lg { font-size: 15px; padding: 15px 30px; }

/* selector de idioma compacto */
.vx-lang .webengine-language-switcher { margin: 0; padding: 0; background: rgba(10,18,48,.7); border: 1px solid var(--vx-line); }
.vx-lang .webengine-language-switcher li a { color: var(--vx-txt); font-size: 12px; }

/* ---------- portada ---------- */
.vx-hero {
	position: relative; overflow: hidden;
	height: 720px;
	background: #060b1e url('../img/voltrex-hero.webp') center / cover no-repeat;
}
.vx-hero:before {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background:
		radial-gradient(ellipse 55% 65% at 30% 55%, rgba(27,63,160,.35), transparent 70%),
		linear-gradient(90deg, #03050c 0%, rgba(3,5,12,.35) 42%, rgba(3,5,12,0) 60%, rgba(3,5,12,.85) 100%),
		linear-gradient(0deg, var(--vx-ink) 0%, transparent 32%);
}
#vx-storm { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; mix-blend-mode: screen; }
.vx-hero-inner {
	position: relative; z-index: 3;
	width: 1180px; max-width: calc(100% - 40px); height: 100%; margin: 0 auto;
	display: flex; align-items: center; justify-content: space-between; gap: 40px;
	padding-top: 40px;
}
.vx-crest img { width: 560px; max-width: 100%; height: auto; filter: drop-shadow(0 0 50px rgba(47,141,255,.55)) drop-shadow(0 0 16px rgba(232,184,90,.3)); transition: transform .4s; }
.vx-crest:hover img { transform: scale(1.02); }
.vx-pitch { max-width: 520px; }
.vx-eyebrow { display: flex; align-items: center; gap: 12px; font-weight: 700; font-size: 14px; letter-spacing: 6px; text-transform: uppercase; color: var(--vx-volt2); }
.vx-eyebrow:before { content: ""; width: 40px; height: 2px; background: var(--vx-volt); }
.vx-pitch h1 { font-family: 'Cinzel', serif; font-weight: 900; font-size: 60px; line-height: 1.04; margin: 14px 0 18px; text-shadow: 0 0 30px rgba(47,141,255,.35); }
.vx-pitch p { font-size: 19px; line-height: 1.5; color: #c9d3ee; margin: 0 0 28px; }
.vx-cta { display: flex; gap: 14px; flex-wrap: wrap; }

/* banner de páginas internas */
.vx-banner {
	height: 300px; padding-top: 80px; text-align: center;
	background: #060b1e url('../img/voltrex-hero.webp') center 40% / cover no-repeat;
	position: relative;
}
.vx-banner:before { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, var(--vx-ink) 0%, rgba(3,5,12,.55) 60%, rgba(3,5,12,.8) 100%); }
.vx-banner a { position: relative; display: inline-block; }
.vx-banner img { width: 300px; height: auto; filter: drop-shadow(0 0 30px rgba(47,141,255,.5)); }

/* ---------- franja de datos ---------- */
.vx-strip {
	position: relative; z-index: 5;
	width: 1180px; margin: -50px auto 0;
	display: grid; grid-template-columns: repeat(5, 1fr);
	background: linear-gradient(#0d1840, #081029);
	border: 1px solid var(--vx-line);
	box-shadow: 0 20px 40px rgba(0,0,0,.6);
}
.vx-strip:before, .vx-strip:after { content: ""; position: absolute; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--vx-gold), transparent); }
.vx-strip:before { top: -1px; } .vx-strip:after { bottom: -1px; }
.vx-strip > div { padding: 18px 8px; text-align: center; border-right: 1px solid var(--vx-line2); }
.vx-strip > div:last-child { border-right: 0; }
.vx-strip b { display: block; font-family: 'Cinzel', serif; font-weight: 900; font-size: 26px; color: var(--vx-head); font-variant-numeric: tabular-nums; min-height: 34px; }
.vx-strip small { font-size: 12px; letter-spacing: 3px; text-transform: uppercase; color: #8fa0c8; }
.vx-strip .vx-live b { color: #6dffb0; text-shadow: 0 0 12px rgba(109,255,176,.4); }
.vx-strip #tServerDate, .vx-strip #tLocalDate { display: none; }

/* ---------- accesos rápidos ---------- */
.vx-quick { width: 1180px; margin: 36px auto 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.vx-card {
	position: relative; display: block; padding: 22px 22px 22px 92px; min-height: 96px;
	background: linear-gradient(160deg, #101c48, #080f28);
	border: 1px solid var(--vx-line);
	text-decoration: none !important;
	transition: border-color .2s, transform .2s, box-shadow .2s;
}
.vx-card:before { content: ""; position: absolute; inset: 5px; border: 1px solid rgba(232,184,90,.2); pointer-events: none; }
.vx-card:hover { border-color: var(--vx-gold); transform: translateY(-3px); box-shadow: 0 10px 30px rgba(47,141,255,.25); }
.vx-ic {
	position: absolute; left: 24px; top: 50%; width: 46px; height: 46px; margin-top: -23px;
	transform: rotate(45deg); border: 1px solid var(--vx-gold); background: var(--vx-navy);
	box-shadow: 0 0 16px rgba(47,141,255,.4);
	display: flex; align-items: center; justify-content: center;
	font-size: 20px; color: var(--vx-volt2);
}
.vx-ic { line-height: 1; }
.vx-card b { display: block; font-family: 'Cinzel', serif; font-size: 18px; color: var(--vx-head); }
.vx-card small { display: block; color: var(--vx-txt); font-size: 14px; margin-top: 2px; }

/* ---------- contenedor principal ---------- */
#container { width: 1180px; background: transparent; padding: 30px 0 10px; margin: 0 auto; }
#content { overflow: visible; padding: 10px 0 0; min-height: 300px; }
#content:after { content: ""; display: table; clear: both; }

.page-title { color: var(--vx-gold2); font-size: 34px; font-weight: 900; letter-spacing: 2px; margin: 10px 0 24px; text-shadow: 0 0 20px rgba(232,184,90,.25); }

/* paneles */
.panel, .panel-sidebar, .panel-general, .panel-news, .panel-downloads, .panel-addstats {
	background: var(--vx-panel) !important;
	border: 1px solid var(--vx-line) !important;
	border-top: 2px solid var(--vx-gold) !important;
	border-radius: 0 !important;
	box-shadow: 0 10px 30px rgba(0,0,0,.45) !important;
	color: var(--vx-txt);
}
.panel > .panel-heading, .panel-sidebar > .panel-heading {
	background: transparent !important;
	border-bottom: 1px solid var(--vx-line2) !important;
	color: var(--vx-gold2) !important;
	border-radius: 0 !important;
}
.panel-title { color: var(--vx-gold2) !important; font-weight: 700; letter-spacing: 1px; font-size: 15px; }
.panel-news .panel-title { font-size: 22px; color: var(--vx-head) !important; }
.panel-body { color: var(--vx-txt); }
.panel-footer { background: transparent !important; border-top: 1px solid var(--vx-line2) !important; color: var(--vx-muted) !important; }

/* tablas */
.table, .table > tbody > tr > td, .table > thead > tr > th, .table > tbody > tr > th { background: transparent !important; color: var(--vx-txt); border-color: var(--vx-line2) !important; }
.table > tbody > tr > td { border-bottom: 1px solid #141f47 !important; }
.table > thead > tr > th { color: var(--vx-gold2); font-family: 'Cinzel', serif; font-size: 13px; letter-spacing: 1px; }
.table-striped > tbody > tr:nth-of-type(odd), .table-hover > tbody > tr:hover { background: rgba(47,141,255,.06) !important; }
.general-table-ui tr:first-child td, .rankings-table tr:first-child td { color: var(--vx-gold2) !important; border-bottom: 2px solid var(--vx-gold) !important; font-family: 'Cinzel', serif; font-size: 14px; }
.general-table-ui tr td, .rankings-table tr td { border-bottom: 1px solid #141f47 !important; color: var(--vx-txt); }
.general-table-ui tr:nth-child(2n+2) td { background: rgba(47,141,255,.04) !important; }
.rankings-table-place { color: var(--vx-gold) !important; font-family: 'Cinzel', serif; }
.rankings-class-image { box-shadow: 0 0 8px rgba(47,141,255,.6); border: 1px solid var(--vx-volt); }
.rankings_menu a { background: var(--vx-navy); border: 1px solid var(--vx-line) !important; color: var(--vx-txt) !important; border-radius: 0; font-family: 'Cinzel', serif; font-size: 13px; }
.rankings_menu a.active, .rankings_menu a:hover { background: var(--vx-gold) !important; color: #1a1100 !important; border-color: var(--vx-gold) !important; }
.rankings-update-time { color: var(--vx-muted); }

/* formularios y botones */
.form-control, input[type=text], input[type=password], input[type=number], input[type=email], select, textarea {
	background: #070d24 !important; border: 1px solid var(--vx-line) !important; color: #e6ecff !important; border-radius: 0 !important; box-shadow: none !important;
}
.form-control:focus, input:focus, select:focus, textarea:focus { border-color: var(--vx-volt) !important; box-shadow: 0 0 10px rgba(47,141,255,.35) !important; }
.control-label, label { color: var(--vx-txt); font-weight: 600; }
.btn-primary, .btn-castlewidget, input[type=submit] {
	font-family: 'Cinzel', serif; font-weight: 700; letter-spacing: 1px;
	color: #1a1100 !important; background: linear-gradient(#ffe3a1, #e8b85a 55%, #b88426) !important;
	border: 1px solid #ffe3a1 !important; border-radius: 0 !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-castlewidget:hover { box-shadow: 0 0 14px rgba(232,184,90,.5) !important; color: #1a1100 !important; }
.btn-default { background: var(--vx-navy); border-color: var(--vx-line); color: var(--vx-txt); border-radius: 0; }
.alert { border-radius: 0; }
.alert-danger { background: rgba(160,30,40,.2); border-color: #7a2030; color: #ffb3bd; }
.alert-success { background: rgba(30,160,90,.15); border-color: #1f7a4a; color: #a6ffcf; }
.alert-info, .alert-warning { background: rgba(47,141,255,.12); border-color: var(--vx-line); color: var(--vx-volt2); }
.module-requirements { color: var(--vx-muted); }

/* portada: noticias */
.home-news-block { background: var(--vx-panel); border: 1px solid var(--vx-line); border-top: 2px solid var(--vx-gold); padding: 0 20px 10px; box-shadow: 0 10px 30px rgba(0,0,0,.45); }
.home-news-block .home-news-block-header { border-bottom: 1px solid var(--vx-line2); margin: 0 -20px 6px; padding: 0 20px; }
.home-news-block .home-news-block-header h2 { font-family: 'Cinzel', serif; font-weight: 900; color: var(--vx-gold2); font-size: 24px; letter-spacing: 2px; }
.home-news-block .home-news-block-header a { color: var(--vx-volt2); line-height: 60px; }
.home-news-block-article { padding: 12px 0; border-bottom: 1px solid #141f47; margin: 0 !important; }
.home-news-block-article:last-child { border-bottom: 0; }
.home-news-block-article .home-news-block-article-type { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; padding: 3px 8px; background: var(--vx-gold); color: #1a1100; }
.home-news-block-article .home-news-block-article-title a { color: #e6ecff; font-weight: 700; font-size: 17px; }
.home-news-block-article .home-news-block-article-title a:hover { color: var(--vx-gold2) !important; }
.home-news-block-article .home-news-block-article-date { color: var(--vx-muted); }

/* barra lateral */
.sidebar-banner { margin-bottom: 18px; border: 1px solid var(--vx-line); }
.sidebar-banner img { width: 100%; display: block; filter: saturate(1.1); }
.panel-usercp ul li { border-bottom: 1px solid #141f47; }
.panel-usercp ul li a { color: var(--vx-txt) !important; }
.panel-usercp ul li a:hover { color: var(--vx-gold2) !important; }
.panel-sidebar-events .smalltext { color: var(--vx-muted); }
.event-schedule-open { color: #6dffb0 !important; }
.event-schedule-inprogress { color: var(--vx-gold2) !important; }
.castle-owner-widget .alt, span.alt { color: var(--vx-muted); }

/* perfiles, cuenta y descargas */
.myaccount-table tr td { border-color: var(--vx-line2) !important; color: var(--vx-txt); }
.myaccount-table tr td:first-child { color: var(--vx-gold2); }
.myaccount-character-block { background: var(--vx-navy); border: 1px solid var(--vx-line); }
.download-description { color: var(--vx-muted); }
.thumbnail { background: var(--vx-panel); border-color: var(--vx-line); }
.webengine-online-bar { background: #070d24; border-color: var(--vx-line); }
.webengine-online-bar .webengine-online-bar-progress { background: linear-gradient(90deg, #0b74c9, var(--vx-volt)); box-shadow: 0 0 8px var(--vx-volt); }
.paypal-gateway-container { background: var(--vx-panel); border-color: var(--vx-line); }

/* ---------- pie de página ---------- */
.footer { width: 100%; margin: 60px 0 0; padding: 40px 0 30px; background: linear-gradient(var(--vx-ink), var(--vx-navy)) !important; border-top: 1px solid var(--vx-line2); color: var(--vx-muted); font-family: 'Rajdhani', sans-serif; font-size: 14px; border-radius: 0; }
.footer > .footer-container { width: 1180px; text-align: center; }
.vx-foot-logo img { width: 230px; height: auto; filter: drop-shadow(0 0 20px rgba(47,141,255,.4)); }
.vx-foot-links { margin: 18px 0 8px; display: flex; justify-content: center; gap: 28px; flex-wrap: wrap; }
.vx-foot-links a { font-family: 'Cinzel', serif; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: #b9ad8f !important; }
.vx-foot-links a:hover { color: var(--vx-gold2) !important; }
.vx-foot-social { display: flex; justify-content: center; gap: 18px; margin: 16px 0; }
.vx-foot-social a { display: inline-flex; width: 42px; height: 42px; align-items: center; justify-content: center; border: 1px solid var(--vx-line); background: var(--vx-navy); transition: border-color .2s; }
.vx-foot-social a:hover { border-color: var(--vx-gold); }
.vx-foot-social img { width: 22px; height: 22px; filter: grayscale(30%) brightness(1.3); }
.footer hr { border-top: 1px solid var(--vx-line2); width: 60%; margin: 18px auto; }
.webengine-powered { color: var(--vx-muted) !important; }

.admincp-button { z-index: 30; background: var(--vx-gold) !important; border-color: var(--vx-gold2) !important; color: #1a1100 !important; }

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; }
}

/* alinear el bloque de noticias con los paneles de abajo */
.home-news-block.col-xs-8 { margin: 0 15px; width: calc(66.6667% - 30px); }
.home-news-block .home-news-block-header h2 { font-style: normal; }
.vx-banner { height: 330px; padding-top: 70px; }
.vx-banner img { width: 250px; }

/* =========================================================
   Responsive y menú · MU VOLTREX · 2026-10-19
   (bloque añadido; para deshacer, borrar desde aquí hasta el final)
   ========================================================= */
.vx-menu-btn { display: none; }
#navbar ul li { white-space: nowrap; }

/* escritorio mediano: menú en una sola línea */
@media (max-width: 1500px) {
	.vx-top { padding: 12px 24px; gap: 14px; }
	#navbar ul li a { padding: 10px 10px; letter-spacing: 1px; }
	#navbar ul li a:after { left: 10px; right: 10px; }
	.vx-btn { padding: 9px 12px; letter-spacing: 1px; }
}
@media (max-width: 1280px) {
	.vx-brand span { display: none; }
}

/* tablet y menor: sin ancho mínimo fijo */
@media (max-width: 1199px) {
	html { min-width: 0; }
	.vx-strip, .vx-quick, #container, .footer > .footer-container { width: auto; max-width: calc(100% - 32px); }
	#container { margin: 0 auto; }
	.footer > .footer-container { margin: 0 auto; }
	.vx-quick { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
	.vx-hero { height: auto; min-height: 640px; padding-bottom: 90px; }
	.vx-hero-inner { flex-direction: column; justify-content: center; text-align: center; gap: 16px; padding-top: 110px; }
	.vx-crest img { width: 340px; }
	.vx-pitch { max-width: 640px; }
	.vx-eyebrow, .vx-cta { justify-content: center; }
}

/* celular y tablet vertical: menú hamburguesa y una columna */
@media (max-width: 991px) {
	.vx-top { flex-wrap: wrap; padding: 10px 16px; background: rgba(3,5,12,.92); }
	.vx-brand { order: 1; flex: 1; }
	.vx-acct { order: 2; }
	.vx-menu-btn {
		order: 3; display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
		width: 44px; height: 44px; padding: 0 11px; cursor: pointer;
		background: rgba(10,18,48,.7); border: 1px solid var(--vx-gold);
	}
	.vx-menu-btn span { display: block; height: 2px; background: var(--vx-gold2); }
	#navbar { order: 4; flex: 1 1 100%; display: none; }
	.vx-top.vx-open #navbar { display: block; }
	#navbar ul { text-align: left; margin: 6px 0 4px; padding: 0; }
	#navbar ul li { display: block; float: none; border-top: 1px solid var(--vx-line2); }
	#navbar ul li a { display: block; padding: 14px 6px; font-size: 14px; }
	#navbar ul li a:after { display: none; }

	#content .col-xs-8, #content .col-xs-4, #content .col-xs-6,
	.home-news-block.col-xs-8 { width: 100%; float: none; }
	.home-news-block.col-xs-8 { margin: 0 0 20px; }
	.home-news-block-header .col-xs-8, .home-news-block-header .col-xs-4 { width: 50%; float: left; }
	#content .table, #content .rankings-table, #content .general-table-ui { display: block; overflow-x: auto; }

	.vx-strip { grid-template-columns: repeat(3, 1fr); }
	.vx-strip > div { border-bottom: 1px solid var(--vx-line2); }
}

@media (max-width: 600px) {
	.vx-brand img { width: 48px; }
	.vx-acct { gap: 6px; }
	.vx-acct .vx-btn { padding: 8px 9px; font-size: 11px; }
	.vx-lang { display: none; }
	.vx-hero { min-height: 0; padding-bottom: 70px; }
	.vx-hero-inner { padding-top: 120px; }
	.vx-crest img { width: 240px; }
	.vx-pitch h1 { font-size: 36px; }
	.vx-pitch p { font-size: 17px; }
	.vx-btn-lg { padding: 13px 18px; font-size: 13px; }
	.vx-strip { grid-template-columns: repeat(2, 1fr); margin-top: -30px; }
	.vx-strip b { font-size: 20px; }
	.vx-card { padding: 18px 16px 18px 80px; }
	.vx-banner { height: 230px; padding-top: 110px; }
	.vx-banner img { width: 170px; }
	.page-title { font-size: 26px; }
	.vx-foot-logo img { width: 170px; }
}


/* =========================================================
   Efectos y logo · MU VOLTREX · 2026-10-19
   (bloque añadido; para deshacer, borrar desde aquí hasta el final)
   ========================================================= */

/* logo: sin agrandar mas que su tamano real y con brillo mas limpio */
.vx-crest { position: relative; display: inline-block; isolation: isolate; }
.vx-crest img { width: 460px; filter: drop-shadow(0 0 18px rgba(47,141,255,.45)); }
.vx-crest:before {
	content: ""; position: absolute; inset: 12% 8%; z-index: -1; border-radius: 50%;
	background: radial-gradient(circle, rgba(47,141,255,.42) 0%, rgba(47,141,255,.12) 45%, transparent 70%);
	animation: vxPulse 3.4s ease-in-out infinite;
}
@keyframes vxPulse { 0%,100% { opacity: .55; transform: scale(.94); } 50% { opacity: 1; transform: scale(1.04); } }

/* destello azul cuando cae un rayo */
.vx-hero:after {
	content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0;
	background: radial-gradient(ellipse 70% 55% at 50% 15%, rgba(110,180,255,.22), transparent 70%);
	transition: opacity .35s;
}
.vx-hero.vx-flash:after { opacity: 1; transition: opacity .05s; }

/* chispas */
#vx-sparks { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }

/* brillo dorado que recorre el titulo */
.vx-pitch h1.vx-gold {
	background-image:
		linear-gradient(110deg, transparent 42%, rgba(255,255,255,.85) 50%, transparent 58%),
		linear-gradient(180deg, #fff2c6 0%, #f0c062 45%, #a0721f 62%, #f6d488 100%);
	background-size: 250% 100%, 100% 100%;
	background-repeat: no-repeat;
	background-position: 150% 0, 0 0;
	-webkit-background-clip: text; background-clip: text;
	animation: vxShine 6s ease-in-out infinite;
}
@keyframes vxShine { 0%, 55% { background-position: 150% 0, 0 0; } 100% { background-position: -60% 0, 0 0; } }

/* borde electrico al pasar el mouse */
.vx-card { overflow: hidden; }
.vx-card:after {
	content: ""; position: absolute; top: 0; left: -45%; width: 45%; height: 2px; opacity: 0;
	background: linear-gradient(90deg, transparent, #8fd4ff, #ffffff, #8fd4ff, transparent);
	box-shadow: 0 0 10px #2f8dff;
}
.vx-card:hover:after { opacity: 1; animation: vxSweep 1.1s linear infinite; }
@keyframes vxSweep { from { left: -45%; } to { left: 100%; } }
.vx-btn { position: relative; overflow: hidden; }
.vx-btn:after {
	content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; pointer-events: none;
	background: linear-gradient(110deg, transparent, rgba(255,255,255,.45), transparent);
	transform: skewX(-20deg); opacity: 0;
}
.vx-btn:hover:after { opacity: 1; animation: vxBtn .7s ease-out; }
@keyframes vxBtn { from { left: -60%; } to { left: 130%; } }

/* aparicion suave al bajar */
.vx-reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
.vx-reveal.vx-in { opacity: 1; transform: none; }

@media (max-width: 1199px) { .vx-crest img { width: 340px; } }
@media (max-width: 600px) { .vx-crest img { width: 240px; } }

@media (prefers-reduced-motion: reduce) {
	.vx-crest:before, .vx-pitch h1.vx-gold, .vx-card:hover:after, .vx-btn:hover:after { animation: none !important; }
	.vx-reveal { opacity: 1; transform: none; }
	#vx-sparks { display: none; }
}


/* =========================================================
   Redes sociales arriba y en portada · MU VOLTREX · 2026-10-19
   (bloque añadido; para deshacer, borrar desde aquí hasta el final)
   ========================================================= */
.vx-social-top { display: flex; gap: 6px; }
.vx-social-top a { display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border: 1px solid var(--vx-line); background: rgba(10,18,48,.7); transition: border-color .2s, box-shadow .2s; }
.vx-social-top a:hover { border-color: var(--vx-gold); box-shadow: 0 0 12px rgba(47,141,255,.5); }
.vx-social-top img { width: 18px; height: 18px; filter: brightness(1.3); }
.vx-social-hero { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 22px; }
.vx-social-hero span { font-size: 13px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: var(--vx-volt2); margin-right: 4px; }
.vx-soc { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border: 1px solid var(--vx-line); background: rgba(10,18,48,.75); color: #e6ecff !important; font-weight: 700; font-size: 15px; text-decoration: none !important; transition: border-color .2s, box-shadow .2s, transform .2s; }
.vx-soc img { width: 18px; height: 18px; }
.vx-soc:hover { transform: translateY(-2px); }
.vx-soc-dc:hover { border-color: #5865F2; box-shadow: 0 0 14px rgba(88,101,242,.6); }
.vx-soc-tt:hover { border-color: #25F4EE; box-shadow: 0 0 14px rgba(254,44,85,.5); }
.vx-soc-wa:hover { border-color: #25D366; box-shadow: 0 0 14px rgba(37,211,102,.5); }
@media (max-width: 1199px) { .vx-social-hero { justify-content: center; } }
@media (max-width: 600px) { .vx-social-top { display: none; } .vx-social-hero span { flex-basis: 100%; text-align: center; } }
@media (prefers-reduced-motion: reduce) { .vx-soc:hover { transform: none; } }


/* =========================================================
   Selector de idioma como lista desplegable · MU VOLTREX · 2026-10-19
   (bloque añadido; para deshacer, borrar desde aquí hasta el final)
   ========================================================= */
.vx-lang { position: relative; width: 74px; height: 36px; z-index: 40; }
.vx-lang .webengine-language-switcher,
.vx-lang .webengine-language-switcher:hover {
	position: absolute; top: 0; right: 0; display: block;
	width: 74px !important; height: auto !important; overflow: hidden; transition: none;
	background: rgba(10,18,48,.95) !important; border: 1px solid var(--vx-gold) !important;
}
.vx-lang .webengine-language-switcher li { display: none; background: transparent; border-radius: 0; padding: 0; }
.vx-lang .webengine-language-switcher li:first-child { display: block; }
.vx-lang .webengine-language-switcher li a { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px; font-size: 13px; font-weight: 700; color: var(--vx-gold2); text-decoration: none !important; white-space: nowrap; }
.vx-lang .webengine-language-switcher li:first-child a:after { content: ""; margin-left: auto; border: 4px solid transparent; border-top-color: var(--vx-gold2); transform: translateY(2px); }
.vx-lang .webengine-language-switcher li a img { width: 16px; height: auto; }
.vx-lang:hover .webengine-language-switcher li,
.vx-lang:focus-within .webengine-language-switcher li { display: block; }
.vx-lang .webengine-language-switcher li + li { border-top: 1px solid var(--vx-line2); }
.vx-lang .webengine-language-switcher li + li a:hover { background: rgba(47,141,255,.18); }


/* Ajuste 2026-10-19: idioma alineado con ENTRAR y redes de portada mas chicas */
.vx-lang { height: 37px; }
.vx-lang .webengine-language-switcher, .vx-lang .webengine-language-switcher:hover { font-size: 0; line-height: 0; }
.vx-lang .webengine-language-switcher li a { height: 35px; font-size: 12px; line-height: 35px; letter-spacing: 1px; }
.vx-social-hero { gap: 8px; margin-top: 18px; }
.vx-social-hero span { font-size: 11px; letter-spacing: 2px; margin-right: 2px; }
.vx-soc { gap: 6px; padding: 6px 11px; font-size: 13px; }
.vx-soc img { width: 15px; height: 15px; }


/* Firma The King Team en el pie · 2026-10-19 (para quitarla, borrar este bloque) */
.vx-sign { width: 150px; margin: 14px auto 0; opacity: .55; transition: opacity .3s; }
.vx-sign:hover { opacity: .95; }
.vx-sign img { display: block; width: 100%; height: auto; mix-blend-mode: screen; }

/* Firma sin fondo negro (2026-10-19): el modo 'screen' hace invisible el negro; la transparencia va en la imagen */
.vx-sign { opacity: 1; isolation: auto; }
.vx-sign img { mix-blend-mode: screen; opacity: .45; filter: saturate(.8); transition: opacity .3s; }
.vx-sign:hover img { opacity: .85; }
