/* CASTLE SIEGE BANNER */
.castle-siege-banner {
	width: 1040px;
	background: #000 url('../img/castle_siege_banner_bg.jpg') no-repeat center center;
	background-size: cover;
	margin: 0px auto;
	padding: 20px;
	-moz-box-shadow: 0 0 10px #000;
	-webkit-box-shadow: 0 0 10px #000;
	box-shadow: 0 0 10px #000;
	overflow: auto;
	font-family: 'Fredoka One', cursive;
	color: #74beff;
	-webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
    -khtml-border-radius: 5px 5px 0px 0px;
	text-shadow: 1px 1px 3px #000000;
}
	.castle-siege-banner img {
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		-khtml-border-radius: 5px;
		-moz-box-shadow: 0 0 10px #000;
		-webkit-box-shadow: 0 0 10px #000;
		box-shadow: 0 0 10px #000;
	}
	.castle-siege-banner .guild_owner, .castle-siege-banner .guild_owner a {
		color: #ffffff;
		font-size: 45px;
	}
	.castle-siege-banner .guild_master, .castle-siege-banner .guild_master a {
		color: #ffffff;
		font-size: 45px;
	}
	.castle-siege-banner .guild_countdown {
		color: #ffffff;
		font-size: 45px;
	}
		.castle-siege-banner .guild_countdown span {
			color: #ffcc00;
			font-size: 24px;
		}

.admincp-button {
	position:absolute;
	top:10px;
	right:10px;
	z-index: 9999;
}

.page-title {
	color: #344b72;
	font-family: 'PT Sans', sans-serif;
	font-size: 32px;
	margin-bottom: 10px;
	font-weight: bold;
}

/* NEWS */
.news-article {
	position: relative;
	padding: 15px 15px;
	transition: all 0.3s ease;
	-moz-box-shadow: 0 0 10px #e8e8e8;
	-webkit-box-shadow: 0 0 10px #e8e8e8;
	box-shadow: 0 0 10px #e8e8e8;
	margin-bottom: 30px;
}
	.news-article .news-image {
		padding: 10px;
	}
	.news-article .news-image img {
		width: 100%;
		height: auto;
		box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.2);
	}
	.news-article .news-content {
		padding: 10px;
	}
		.news-article .news-content h3 {
			margin: 0px 0px 15px 0px;
			padding: 0px 0px 5px 0px;
			text-transform: uppercase;
			font-size: 18px;
			font-weight: bold;
			border-bottom: 1px solid #d4d4d4;
		}
		.news-article .news-content h3 a {
			color: #000;
		}
		.news-article .news-content .news-date {
			font-size: 12px;
			font-style: italic;
			color: #aaa;
		}
	.news-article:hover {
		background: #e1e1e1;
	}

/* RANKINGS MODULE */
.rankings-table {
	width: 100%;
	border-spacing: 0;
	border-collapse: collapse;
	-moz-box-shadow: 0 0 10px #e8e8e8;
	-webkit-box-shadow: 0 0 10px #e8e8e8;
	box-shadow: 0 0 10px #e8e8e8;
}

.rankings-class-image {
	width: 30px;
	height: auto;
	-moz-box-shadow: 0 0 5px #666;
	-webkit-box-shadow: 0 0 5px #666;
	box-shadow: 0 0 5px #666;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.rankings-table tr td {
	border-bottom: 1px solid #e3e3e3;
	padding: 10px;
	font-size: 18px;
	vertical-align: middle !important;
	text-align: center;
}
.rankings-table-place {
	color: #666;
	font-weight: bold;
	font-size: 24px;
	text-align: center;
}
.rankings-table tr:first-child td {
	color: #344b72;
	border-bottom: 3px solid #344b72;
}
.rankings-update-time {
	text-align: right;
	font-size: 11px;
	color: #ccc;
	padding: 10px 0px;
}
.rankings_menu {
	width: 100%;
	overflow: auto;
	text-align: center;
	margin-bottom: 50px;
}
.rankings_menu span {
	width: 100%;
	display: inline-block;
	padding: 10px 0px;
	color: #ccc;
	font-size: 24px;
}
.rankings_menu a {
	display: inline-block;
	width: 160px;
	border: 1px solid #e3e3e3;
	text-align: center;
	padding: 10px 0px;
	margin: 5px;
	background: #f1f1f1;
	-moz-border-radius: 2px;
	border-radius: 2px;
	color: #ccc;
}
.rankings_menu a.active {
	color: #fff;
	border-color: #333;
	background: #344b72;
}
.rankings_menu a:hover.active {
	color: #fff !important;
}
.rankings_guild_logo tr td {
	border: 0px !important;
	padding: 0px !important;
	margin: 0px !important;
}
.rankings-gens-img {
	width: auto !important;
	height: 30px !important;
	border: 0 !important;
	-moz-box-shadow: 0 0 0px #000 !important;
	-webkit-box-shadow: 0 0 0px #000 !important;
	box-shadow: 0 0 0px #000 !important;
	-moz-border-radius: 0px !important;
	border-radius: 0px !important;
}

/* MY ACCOUNT MODULE */
.myaccount-table {
	width: 100%;
	background: #f9f9f9;
	border: 1px solid #e3e3e3;
}
.myaccount-table tr td:first-child {
	color: #666;
	font-weight: bold;
}
.myaccount-table tr td {
	border-bottom: 1px solid #e3e3e3;
	padding: 25px !important;
}
.myaccount-table tr:last-child td {
	border: 0px;
}
.myaccount-table tr td {
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.myaccount-table tr:hover td {
	background: #fefefe;
}


/* GENERAL TABLE UI */
.general-table-ui {
	width: 100%;
	table-layout: fixed;
	background: #f9f9f9;
	border: 1px solid #e3e3e3;
	padding: 10px;
}
.general-table-ui tr td {
	padding: 15px 5px !important;
	vertical-align: middle !important;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.general-table-ui tr:hover td {
	background: #fefefe;
}
.general-table-ui tr:first-child td {
	color: #344b72;
	font-weight: bold;
}
.general-table-ui tr:nth-child(2n+2) td {
	background: #fafafa;
}
.general-table-ui tr td {
	text-align: center;
}
.general-table-ui img {
	width: 50px;
	height: auto;
	-moz-box-shadow: 0 0 5px #666;
	-webkit-box-shadow: 0 0 5px #666;
	box-shadow: 0 0 5px #666;
	-moz-border-radius: 0px;
	border-radius: 0px;
}

/* TERMS OF SERVICE PAGE */
.tos_list li {
	color: #0000aa;
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 40px;
}
.tos_list li p {
	color: #444;
	text-align: justify;
	text-justify: inter-word;
	text-transform: none;
	padding-right: 35px;
	font-size: 14px;
	font-weight: normal;
}

/* PAYPAL */
.paypal-gateway-container {
	width: 100%;
}

.paypal-gateway-content {
	background: #fef2da;
	border: 3px solid #f79433;
	padding: 15px;
	overflow: auto;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	font-weight: bold;
}

.paypal-gateway-logo {
	width: 100%;
	height: 100px;
	background: #fff9ec url('../img/paypal-logo-200-68.png') no-repeat center;
	background-size: contain;
	margin-bottom: 15px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.paypal-gateway-conversion-rate {
	margin: 0px auto;
	text-align: center;
	color: #000;
	font-size: 18px;
	padding: 10px 0px;
}

.paypal-gateway-form {
	width: 100%;
	margin: 20px auto;
	text-align: center;
}

.paypal-gateway-form div {
	display: inline-block;
	padding: 0px 10px;
	color: #000;
	font-size: 24px;
}

.paypal-gateway-form input[type=text] {
	width: 60px;
	font-size: 24px;
	border: 3px solid #f79433;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	color: #f79433;
}

.paypal-gateway-continue {
	margin: 0px auto;
	text-align: center;
}

.paypal-gateway-continue input[type=submit] {
	background: url('../img/paypal-submit.jpg') no-repeat;
	width: 200px;
	height: 40px;
	border: 0px;
}

.module-requirements {
	font-size: 12px;
	margin-top: 20px;
}

/* SIDEBAR */
.panel-sidebar {
	background: #fefefe;
	border: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	-moz-box-shadow: 0 0 10px #ececec;
	-webkit-box-shadow: 0 0 10px #ececec;
	box-shadow: 0 0 10px #ececec;
	border-radius: 5px;
}

.panel-sidebar > .panel-heading {
	color: #344b72;
	font-family: 'PT Sans', sans-serif;
	border: 0px;
	padding: 20px 15px;
}

.panel-sidebar > .panel-heading > .panel-title {
	font-weight: bold;
}

.panel-usercp {
	background: url('../img/usercp_bg.jpg') no-repeat top center;
	background-size: cover;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
	-webkit-filter: grayscale(80%) brightness(90%);
	filter: grayscale(80%) brightness(90%);
}

.panel-usercp:hover {
	-webkit-filter: grayscale(0%) brightness(110%);
	filter: grayscale(0%) brightness(110%);
}

.panel-usercp > .panel-heading > .panel-title {
	color: #fff;
}

.panel-usercp ul {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}

.panel-usercp ul li {
	display: table;
	width: 100%;
	vertical-align: middle;
	line-height: 30px;
}

.panel-usercp ul li a {
	color: #87909f !important;
	text-shadow: 1px 1px 3px #000;
}
.panel-usercp ul li a:active, .panel-usercp ul li a:hover {
	color: #fff !important;
}

.panel-usercp ul li img {
	position: relative;
	/*top: -2px;*/
	bottom: -5px;
	padding-right: 10px;
}

.sidebar-banner {
	margin: 20px 0px;
	border: 0px;
}

.sidebar-banner img {
	width: 100%;
	height: auto;
	-moz-box-shadow: 0 0 10px #e3e3e3;
	-webkit-box-shadow: 0 0 10px #e3e3e3;
	box-shadow: 0 0 10px #e3e3e3;
	border: 0px;
	-moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -khtml-border-radius: 5px;
}

/* GENERAL PANEL STYLING */
.panel-general {
	margin-bottom: 30px;
	background: #f1f1f1;
	border: 1px solid #e3e3e3;
	-moz-border-radius: 0px;
	border-radius: 0px;
	color: #333;
}

.panel-body .panel-title {
	color: #666;
	font-family: 'PT Sans', sans-serif;
	font-size: 14px;
	border-bottom: 1px solid #e3e3e3;
	margin-bottom: 20px !important;
	font-weight: bold;
}

/* ADD STATS MODULE */
.panel-addstats {
	margin-bottom: 30px;
	background: #f9f9f9;
	border: 1px solid #e3e3e3;
	-moz-border-radius: 0px;
	border-radius: 0px;
	color: #333;
	padding: 30px 0px;
}
.panel-addstats .character-avatar img {
	width: 100px;
	height: auto;
	-moz-box-shadow: 0 0 5px #666;
	-webkit-box-shadow: 0 0 5px #666;
	box-shadow: 0 0 5px #666;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.panel-addstats .character-name {
	color: #666;
	font-family: 'PT Sans', sans-serif;
	font-size: 18px;
	border-bottom: 1px solid #e3e3e3;
	padding: 20px 0px;
	margin-bottom: 20px !important;
	font-weight: bold;
}

/* DOWNLOADS */
.panel-downloads {
	margin-bottom: 30px;
	background: #f9f9f9;
	border: 1px solid #e3e3e3;
	-moz-border-radius: 5px;
	border-radius: 5px;
	color: #333;
	padding: 20px;
}
	.download-description {
		font-size: 11px;
		position: relative;
		top: -7px;
		color: #777;
	}

.panel-downloads > .panel-body > .panel-title {
	font-size: 20px;
	padding-bottom: 8px;
}

.online-status-indicator {
	margin-left: 5px;
}

/* WEBENGINE CMS */
.webengine-powered { color: #777 !important; }
.webengine-powered:active, .webengine-powered:hover { color: #ff3214 !important; }

.webengine-countdown {
	position: relative;
	top: 375px;
	width: 700px;
	background: rgba(255,255,255,0.4);
	text-align: center;
	margin: 0px auto;
	padding: 10px;
	color: #fff;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid rgba(255,255,255,0.4);
}
.webengine-countdown h1 {
	color: #000000;
	font-size: 40px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 30px;
}

/* LANGUAGE PICKER */
.webengine-language-switcher {
	display: inline-block;
	list-style: none;
	padding: 0px !important;
	margin: 0px  auto !important;
	width: 100%;
	overflow: hidden;
	transition: all .3s ease;
	text-align: center;
}
	.webengine-language-switcher li {
		display: inline-block;
		list-style-type: none;
		background: #f1f1f1;
		padding: 0px 5px 2px 5px;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		-khtml-border-radius: 3px;
		transition: all .3s ease;
		margin-bottom: 5px;
	}
	.webengine-language-switcher li:hover {
		background: #e0f8ff;
	}
	.webengine-language-switcher li a {
		color: #666;
	}
	.webengine-language-switcher li a:hover {
		color: #000 !important;
	}

/* MY ACCOUNT CHARACTER LIST */
.myaccount-character-block {
	background: #333;
	border: 1px solid #666;
	padding: 5px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	display: inline-block;
	margin: 0px auto;
	-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
	.myaccount-character-block img {
		width: 100px;
		height: auto;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		-moz-box-shadow: 0 0 5px #000;
		-webkit-box-shadow: 0 0 5px #000;
		box-shadow: 0 0 5px #000;
		-moz-transition: all 0.3s ease;
		-o-transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
		.myaccount-character-block img:hover {
			-webkit-filter: brightness(120%);
			filter: brightness(120%);
		}
.myaccount-character-block-location {
	font-size: 12px;
	color: #000;
	margin-bottom: 20px;
	margin-top: 2px;
	line-height: 1.2;
}
.myaccount-character-block-level {
	position: relative;
	top: -77px;
	display: inline-block;
	background: rgba(0,0,0,0.5);
	padding: 0px 5px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	color: #fff;
	font-size: 10px;
}
.myaccount-character-name a {
	font-weight: bold;
	color: #000;
	font-size: 16px;
}

/* PANEL SIDEBAR EVENT TIMERS */
.panel-sidebar-events > .panel-body {
	color: #000000;
}
	.panel-sidebar-events > .panel-body > .table {
		margin-bottom: 0px !important;
	}

.event-schedule-open {
	color: #00ba00;
}

.event-schedule-inprogress {
	color: #ff8c00;
}

.panel-sidebar-events .smalltext {
	font-size: 11px;
	position: relative;
	top: -5px;
	color: #666;
}












/* ============================
   MU IMPERIO - ROOT SCROLL ONLY
   ============================ */
html {
    height: auto;
    min-height: 0;
    overflow-y: scroll;
}

body {
    height: auto;
    min-height: 0;
    overflow: visible !important;
}
body {
    background: url('../img/fondo.jpg') no-repeat center center fixed;
    background-size: cover;
}


/* ============================
   MU IMPERIO - GLOBAL BACKGROUND OVERLAY
   ============================ */
body {
    position: relative;
}

body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.55);
    pointer-events: none;
}


/* ======================================
   MU IMPERIO - Social Floating Buttons
   ====================================== */

.social-floating {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-family: 'PT Sans', Arial, sans-serif;
}

/* Tarjeta base */
.social-card {
    display: flex;
    align-items: center;
    min-width: 230px;
    padding: 8px 12px;
    border-radius: 10px;
    background: rgba(10, 10, 10, 0.96);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.8);
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.social-card-icon {
    margin-right: 10px;
}

.social-card-icon img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
}

.social-card-text {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.social-title {
    font-size: 13px;
    font-weight: 600;
    color: #f5f5f5;
}

.social-subtitle {
    font-size: 11px;
    color: #c0c0c0;
}

/* Badge lateral (ej: Online) */
.social-card-badge {
    font-size: 10px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Específicos */
.discord-card {
    border-left: 3px solid #5865f2;
}

.whatsapp-card {
    border-left: 3px solid #25d366;
}

/* Hover */
.social-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.95);
    background: rgba(20, 20, 20, 1);
}

/* Responsive */
@media (max-width: 768px) {
    .social-floating {
        right: 10px;
        bottom: 10px;
        transform: scale(0.9);
    }
}
/* =============================
   MU IMPERIO – GAME CENTER
   Negro + dorado manteniendo el hover con imagen
   ============================= */

/* Bloques del Game Center */
.gameCenterBlock .gameBlock {
    background: #000000;                 /* fondo negro por defecto */
    border-top: 1px solid #d4af37;
    border-bottom: 1px solid #d4af37;
    border-left: 1px solid #d4af37;
    padding-left: 40px;
    border-radius: 4px;
    transition: 0.3s;
}

.gameCenterBlock .gameBlock:last-child {
    border-right: 1px solid #d4af37;
}

/* Títulos dentro de los bloques */
.gameCenterBlock .gameBlock .game-title_1,
.gameCenterBlock .gameBlock .game-title_2 {
    color: #d4af37;                       /* dorado */
}

/* Botón GO > */
.gameCenterBlock .gameBlock a {
    background: #d4af37;
    color: #000;
    border-radius: 2px;
    padding: 4px 11px;
    font-size: 11px;
}

/* HOVER – NO toco el background para no tapar la imagen original */
.gameCenterBlock .gameBlock:hover {
    /* no setear background acá */
    box-shadow: 0 0 15px rgba(212, 175, 55, 0.4);
    border-color: #f5d46b;
}

.gameCenterBlock .gameBlock:hover .game-title_1,
.gameCenterBlock .gameBlock:hover .game-title_2 {
    color: #ffffff;
}

.gameCenterBlock .gameBlock:hover a {
    background: #f5d46b;
    color: #000;
}
/* =============================
   TABLAS – Informacion del servidor y similares
   ============================= */

/* Todas las tablas del contenido */
body table {
    background-color: #000000 !important;      /* fondo negro */
    border-collapse: collapse;
}

/* Celdas y cabeceras */
body table td,
body table th {
    background-color: #000000 !important;
    color: #d4af37 !important;                 /* texto dorado */
    border: 1px solid #333333 !important;      /* borde oscuro */
    padding: 8px 10px;
}

/* Rayado sutil en filas pares (excepto encabezados) */
body table tr:nth-child(even) td {
    background-color: #0d0d0d !important;
}

/* Encabezados un poco más claros y marcados */
body table th {
    background-color: #111111 !important;
    font-weight: 600;
}

/* Inputs / selects dentro de tablas */
body table input,
body table select {
    background-color: #111111 !important;
    color: #d4af37 !important;
    border: 1px solid #d4af37 !important;
}
.hall-title {
  text-align: center;
  font-size: 26px;
  color: #d4af37;
  margin-bottom: 40px;
  letter-spacing: 2px;
}

.hall-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  justify-items: center;
}

.hall-card {
  width: 260px;
  text-align: center;
  color: #d4af37;
}

.hall-card img {
  width: 100%;
  border-radius: 14px;
  box-shadow: 0 0 25px rgba(212,175,55,.6);
}

.hall-card .race {
  display: block;
  font-size: 18px;
  margin-bottom: 10px;
}

.hall-card .player {
  display: block;
  margin-top: 10px;
  font-weight: bold;
}
/* ================================
   SALÓN DE LA FAMA – GRID FINAL
   ================================ */

.hall-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 40px;
  justify-items: center;
  max-width: 100%;
}

/* Cards */
.hall-card {
  max-width: 240px;
  text-align: center;
}

/* Centrar las 2 de abajo */
.hall-offset {
  grid-column: span 1;
}

.hall-card:nth-child(4) {
  grid-column: 2;
}

.hall-card:nth-child(5) {
  grid-column: 3;
}

/* Responsive: cuando no entra, baja solo */
@media (max-width: 1100px) {
  .hall-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .hall-card:nth-child(4),
  .hall-card:nth-child(5) {
    grid-column: auto;
  }
}

@media (max-width: 768px) {
  .hall-grid {
    grid-template-columns: 1fr;
  }
}

/* ================================
   ESTILO DORADO + CORONA
   ================================ */

.hall-race {
  position: relative;
  color: #d4af37;
  font-family: 'Cinzel', serif;
  letter-spacing: 2px;
  text-shadow: 0 0 8px rgba(212,175,55,.45);
  margin-bottom: 10px;
}

/* Corona dorada */
.hall-race::before {
  content: "";
  display: block;
  width: 22px;
  height: 22px;
  margin: 0 auto 6px;
  background: url('../img/ui/crown.png') no-repeat center;
  background-size: contain;
}

.hall-name {
  margin-top: 10px;
  color: #c9a44c;
  font-weight: 600;
  text-shadow: 0 0 4px rgba(201,164,76,.5);
}

.hall-card img {
  width: 100%;
  box-shadow: 0 0 25px rgba(212,175,55,.5);
  border-radius: 14px;
}
/* ===== SALON HERO ===== */
.hall-hero{
  background: linear-gradient(180deg,#d4af37,#8b6b1f);
  padding:18px 0;
  text-align:center;
  margin-bottom:40px;
}

.hall-title{
  color:#000;
  font-size:22px;
  font-weight:700;
  letter-spacing:3px;
}

/* ===== CONTENEDOR ===== */
.hall-container{
  padding:40px 0;
}

/* ===== FILAS ===== */
.hall-row{
  display:flex;
  justify-content:center;
  gap:40px;
  margin-bottom:60px;
}

.hall-row-bottom{
  justify-content:center;
}

/* ===== CARD ===== */
.hall-card{
  position:relative;
  text-align:center;
  width:260px;
}

/* ===== CORONA ===== */
.hall-card .crown{
  width:40px;
  position:absolute;
  top:-28px;
  left:50%;
  transform:translateX(-50%);
}

/* ===== RAZA ===== */
.hall-race{
  color:#d4af37;
  font-weight:700;
  margin-bottom:10px;
}

/* ===== IMAGEN ===== */
.hall-card img{
  max-width:100%;
  border-radius:8px;
  box-shadow:0 0 25px rgba(212,175,55,.4);
}

/* ===== NOMBRE PJ ===== */
.hall-name{
  margin-top:12px;
  color:#d4af37;
  font-weight:600;
}
.hall-race::before,
.hall-race::after {
  content: none !important;
  display: none !important;
}
/* Ocultar hero / espacio negro fuera de la home */
body:not(.bodyHomePage) .hall-hero,
body:not(.bodyHomePage) .pageTitle,
body:not(.bodyHomePage) .content > .row:before {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* BOTONES RANKING */
.rankings_menu button,
.rankings_menu .btn {
    background: #0b0b0b !important;
    color: #d4af37 !important; /* dorado */
    border: 1px solid #d4af37 !important;
    font-weight: 600;
    box-shadow: 0 0 8px rgba(212,175,55,.25);
}

/* Botón activo */
.rankings_menu button.active,
.rankings_menu .btn.active {
    background: linear-gradient(180deg, #d4af37, #a8842a) !important;
    color: #000 !important;
    border-color: #d4af37 !important;
}

/* =========================
   INFO PAGE - PANEL GLOW
========================= */

.info-glow-panel{
  position: relative;
  padding: 18px;
  border-radius: 10px;

  background: rgba(0,0,0,.45);
  border: 1px solid rgba(212,175,55,.18);

  box-shadow:
    0 0 0 1px rgba(255,215,90,.06) inset,
    0 18px 45px rgba(0,0,0,.75);
}

/* glow detrás del panel, estilo “brillo” */
.info-glow-panel::before{
  content:"";
  position:absolute;
  inset:-28px;              /* agranda el glow */
  border-radius: 14px;
  z-index:-1;

  background:
    radial-gradient(circle at 30% 20%, rgba(212,175,55,.18), transparent 60%),
    radial-gradient(circle at 70% 80%, rgba(212,175,55,.12), transparent 55%);

  filter: blur(18px);
  opacity: .95;
}

/* opcional: un poco de aire entre secciones */
.info-glow-panel .table{
  margin-bottom: 18px;
}
/* Titulos de secciones (Maquina Chaos / Party Bonus / Comandos) */
.info-glow-panel h2,
.info-glow-panel h3,
.info-glow-panel .info-section-title{
  margin: 14px 0 10px;
  padding: 10px 12px;

  color: #d4af37;                 /* dorado */
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 700;

  background: rgba(0,0,0,.55);
  border: 1px solid rgba(212,175,55,.18);
  border-left: 3px solid rgba(212,175,55,.65);

  box-shadow: 0 0 0 1px rgba(255,215,90,.05) inset;
  border-radius: 6px;
}
/* ===== TITULOS DE SECCIONES COMO "INFORMACIÓN GENERAL" ===== */

/* Estilo base del header de tabla */
.info-glow-panel table thead th,
.info-glow-panel table tr:first-child th {
    background: linear-gradient(
        180deg,
        rgba(212,175,55,0.25),
        rgba(0,0,0,0.85)
    ) !important;

    color: #d4af37 !important;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1px;

    border: 1px solid rgba(212,175,55,0.35) !important;
    border-radius: 6px;

    box-shadow:
        inset 0 1px 0 rgba(255,215,90,0.25),
        0 0 12px rgba(212,175,55,0.15);
}

/* ===== FORZAMOS LOS OTROS TITULOS A SER IGUALES ===== */
.info-glow-panel h2,
.info-glow-panel h3,
.info-glow-panel .info-section-title {
    margin: 12px 0 6px;
    padding: 10px 12px;

    background: linear-gradient(
        180deg,
        rgba(212,175,55,0.25),
        rgba(0,0,0,0.85)
    );

    color: #d4af37;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1px;

    border: 1px solid rgba(212,175,55,0.35);
    border-radius: 6px;

    box-shadow:
        inset 0 1px 0 rgba(255,215,90,0.25),
        0 0 12px rgba(212,175,55,0.15);
}
.info-glow-panel h2,
.info-glow-panel h3,
.info-glow-panel .info-section-title,
.info-glow-panel table thead th {
    min-height: 44px;
    display: flex;
    align-items: center;
}
.home-top-wrapper {
  background: linear-gradient(
    180deg,
    rgba(212,175,55,0.08),
    rgba(0,0,0,0.85)
  );
  border: 1px solid rgba(212,175,55,0.45);
  box-shadow:
    0 0 25px rgba(212,175,55,0.25),
    inset 0 0 25px rgba(212,175,55,0.15);
  border-radius: 10px;
  padding: 25px;
  margin: 30px 0;
}
.home-top-wrapper .table {
  background: rgba(0,0,0,0.55);
  border: 1px solid rgba(212,175,55,0.25);
  box-shadow: inset 0 0 15px rgba(212,175,55,0.12);
}
.hall-page{
  width: 100%;
  display: flex;
  justify-content: center;
}

.hall-page .hall-container{
  margin: 0 !important; /* porque lo centra el flex */
}


.bodyHomePage .contentHomePage {
    position: relative;
    z-index: 2;
}

/* =========================
   HOME – FIX DEFINITIVO
   ========================= */

body.bodyHomePage header.headerHomePage {
  height: auto !important;
  min-height: 0 !important;
  padding-bottom: 0 !important;
}

/* STATS */
body.bodyHomePage .homeStats-wrapper {
  position: relative;
  z-index: 10;
  margin: 25px auto 0 auto;
  max-width: 1200px;
}

/* SLIDER + NEWS */
body.bodyHomePage .newsBlock {
  position: relative !important;
  margin: 30px auto 0 auto;
  max-width: 1200px;
  width: 100%;
  display: flex;
  align-items: stretch;
  z-index: 5;
}

/* Slider */
body.bodyHomePage .newsBlock .swiper-container,
body.bodyHomePage .newsBlock .swiper-news {
  flex: 1;
  width: auto;
  min-width: 0;
}

/* News column */
body.bodyHomePage .newsBlock .news-block {
  width: 340px;
  margin-left: 15px;
}

/* Events column */
body.bodyHomePage .newsBlock .events-block {
  width: 320px;
  margin-left: 15px;
}

/* Events visual */
body.bodyHomePage .events-block {
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255, 204, 102, .18);
  box-shadow: 0 0 20px rgba(255, 174, 0, .06);
  border-radius: 10px;
  overflow: hidden;
}

body.bodyHomePage .events-block-header {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255, 204, 102, .12);
}

body.bodyHomePage .events-title {
  display: block;
  font-weight: 700;
  letter-spacing: .3px;
  color: #f5d27a;
}

body.bodyHomePage .events-subtitle {
  display: block;
  font-size: 12px;
  opacity: .7;
  margin-top: 2px;
}

body.bodyHomePage .events-list {
  padding: 8px 10px;
}

body.bodyHomePage .event-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 8px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

body.bodyHomePage .event-row:last-child {
  border-bottom: none;
}

body.bodyHomePage .event-left .event-name {
  display: block;
  font-weight: 600;
}

body.bodyHomePage .event-left small,
body.bodyHomePage .event-right small {
  display: block;
  font-size: 11px;
  opacity: .75;
}

body.bodyHomePage .event-right {
  text-align: right;
}

body.bodyHomePage .event-next {
  display: block;
  font-weight: 600;
  color: #f5d27a;
}

body.bodyHomePage .event-timer {
  font-variant-numeric: tabular-nums;
}

/* Responsive */
@media (max-width: 991px) {
  body.bodyHomePage .newsBlock {
    flex-direction: column;
  }

  body.bodyHomePage .newsBlock .swiper-container,
  body.bodyHomePage .newsBlock .news-block,
  body.bodyHomePage .newsBlock .events-block {
    width: 100%;
    margin-left: 0;
  }
}
/* HOME: mantener el espacio del headerButtons pero ocultar su contenido */
body.bodyHomePage .headerButtons{
  height: 132px !important;       /* mantiene el alto que usaba el botón */
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* oculta TODO lo de adentro (download + links) */
body.bodyHomePage .headerButtons *{
  display: none !important;
}
/* HOME: sacar la línea/borde del header */
body.bodyHomePage .topPanel,
body.bodyHomePage header.headerHomePage,
body.bodyHomePage header.headerHomePage .topPanel{
  border-bottom: none !important;
}
/* HOME: sacar bordes del bloque slider/news */
body.bodyHomePage .newsBlock,
body.bodyHomePage .newsBlock *,
body.bodyHomePage .swiper-container,
body.bodyHomePage .swiper-news,
body.bodyHomePage .swiper-wrapper,
body.bodyHomePage .swiper-slide{
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}
/* HOME: headerButtons vacío sin fondo ni cosas raras */
body.bodyHomePage .headerButtons{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
/* HOME: eliminar línea inferior del header (incluye ::before/::after) */
body.bodyHomePage header.headerHomePage,
body.bodyHomePage header.headerHomePage .topPanel,
body.bodyHomePage header.headerHomePage .topPanel-wrapper{
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

body.bodyHomePage header.headerHomePage::before,
body.bodyHomePage header.headerHomePage::after,
body.bodyHomePage .topPanel::before,
body.bodyHomePage .topPanel::after{
  content: none !important;
  display: none !important;
}
/* HOME: estilo "borde dorado brilloso" (igual al top) */
body.bodyHomePage .homeStats-wrapper,
body.bodyHomePage .newsBlock{
  border: 1px solid rgba(212,175,55,.55) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.65) inset,
    0 0 18px rgba(212,175,55,.18),
    0 0 40px rgba(212,175,55,.08) !important;
  background: rgba(0,0,0,.35) !important;
  border-radius: 10px;
}

/* Para que el borde se vea parejo y no “corte” con hijos internos */
body.bodyHomePage .homeStats-wrapper,
body.bodyHomePage .newsBlock{
  overflow: hidden;
}
/* HOME: eliminar cualquier "línea separadora" horizontal bajo el menú */
body.bodyHomePage header.headerHomePage,
body.bodyHomePage .topPanel,
body.bodyHomePage .wrapper{
  border: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* Pseudo-elementos típicos que dibujan líneas */
body.bodyHomePage header.headerHomePage::before,
body.bodyHomePage header.headerHomePage::after,
body.bodyHomePage .topPanel::before,
body.bodyHomePage .topPanel::after,
body.bodyHomePage .wrapper::before,
body.bodyHomePage .wrapper::after,
body.bodyHomePage body::before,
body.bodyHomePage body::after{
  content: none !important;
  display: none !important;
}

/* Por si es un <hr> o separador */
body.bodyHomePage hr{
  display: none !important;
  height: 0 !important;
  border: 0 !important;
}
/* HOME: el contenedor de stats SIN borde (solo layout) */
body.bodyHomePage .homeStats-wrapper{
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}

/* HOME: brillo dorado por "cuadradito" (cada stat card) */
body.bodyHomePage .homeStats .statCard{
  border: 1px solid rgba(212,175,55,.55) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.65) inset,
    0 0 14px rgba(212,175,55,.22),
    0 0 28px rgba(212,175,55,.10) !important;
  background: rgba(0,0,0,.35) !important;
  border-radius: 10px;
}

/* espacio prolijo entre tarjetas */
body.bodyHomePage .homeStats-inner{
  gap: 14px !important;
}
/* ===== FIX DEFINITIVO DROPDOWN MENU ===== */

/* El submenu NO ocupa espacio */
.headerHomePage .menu ul ul {
  position: absolute !important;
  top: 100%;
  left: 0;
  display: none;
  min-height: unset !important;
  height: auto !important;
  padding: 8px 0;
  margin: 0;

  background: rgba(0,0,0,.95);
  border: 1px solid rgba(212,175,55,.35);
  border-radius: 10px;

  box-shadow: 0 15px 40px rgba(0,0,0,.7);
  z-index: 9999;
}

/* Se muestra SOLO al hover */
.headerHomePage .menu li:hover > ul {
  display: block;
}

/* El li padre es referencia */
.headerHomePage .menu li {
  position: relative;
}
/* ===== TOP NAV con más vida ===== */

.headerHomePage .topPanel{
 e   background: linear-gradient(
    180deg,
    rgba(0,0,0,.92),
    rgba(0,0,0,.70)
  ) !important;

  border-bottom: 1px solid rgba(212,175,55,.25);
  box-shadow:
    0 10px 30px rgba(0,0,0,.55),
    inset 0 -1px 0 rgba(212,175,55,.25);
}

/* Links */
.headerHomePage .menu > ul > li > a{
  position: relative;
  padding: 18px 14px;
  letter-spacing: .5px;
  transition: color .25s ease, transform .25s ease;
}

/* Subrayado animado */
.headerHomePage .menu > ul > li > a::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:10px;
  height:2px;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(212,175,55,.95),
    transparent
  );

  transform: scaleX(0);
  transition: transform .25s ease;
}

/* Hover */
.headerHomePage .menu > ul > li:hover > a{
  color:#d4af37 !important;
  transform: translateY(-1px);
}
.headerHomePage .menu > ul > li:hover > a::after{
  transform: scaleX(1);
}
/* 1) SACAR EL RECTANGULO AZUL DEL HOVER EN EL MENU */
.headerHomePage .menu > ul > li:hover,
.headerHomePage .menu > ul > li:hover > a,
.headerHomePage .menu > ul > li > a:hover {
  background: transparent !important;
  box-shadow: none !important;
}
/* 2) DROPDOWN PEGADO Y PROLIJO */
.headerHomePage .menu li { position: relative; }

.headerHomePage .menu ul ul{
  position: absolute !important;
  top: calc(100% + 6px) !important;   /* separacion corta */
  left: 50% !important;
  transform: translateX(-50%);
  display: none;

  min-width: 220px;
  padding: 10px 0;
  margin: 0;

  background: rgba(0,0,0,.95);
  border: 1px solid rgba(212,175,55,.35);
  border-radius: 10px;
  box-shadow: 0 15px 40px rgba(0,0,0,.7);
  z-index: 99999;
}

.headerHomePage .menu li:hover > ul{ display: block; }

/* items del dropdown */
.headerHomePage .menu ul ul li a{
  display: block;
  padding: 10px 14px;
  white-space: nowrap;
}
/* 3) EVITAR QUE EL HEADER PISE LOS STATS */
body.bodyHomePage header.headerHomePage{
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding-bottom: 0 !important;
  margin-bottom: 12px !important;
}

/* Aseguro separacion del bloque stats respecto del header */
body.bodyHomePage .homeStats-wrapper{
  margin-top: 12px !important;
  clear: both !important;
}
/* ===========================
   FIX MENU + DROPDOWN + STATS
   (PEGAR AL FINAL DE style.css)
   =========================== */

/* 0) Arreglá el typo: si tenés ".topPanel{ e background: ... }" borrá la "e" */

/* 1) Sacar hover/focus azul y cualquier fondo raro */
.headerHomePage .menu a,
.headerHomePage .menu a:hover,
.headerHomePage .menu a:focus,
.headerHomePage .menu a:active{
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Evita el rectángulo azul de focus en Chrome */
.headerHomePage .menu a:focus-visible{
  outline: none !important;
}

/* 2) Dropdown pegado al item (no “flotando lejos”) */
.headerHomePage .menu li{ position: relative; }

.headerHomePage .menu ul ul{
  position: absolute !important;
  top: calc(100% + 6px) !important;  /* bien pegado */
  left: 0 !important;                /* alineado al item */
  transform: none !important;

  display: none;
  min-width: 220px;

  padding: 10px 0;
  margin: 0;

  background: rgba(0,0,0,.95);
  border: 1px solid rgba(212,175,55,.35);
  border-radius: 10px;
  box-shadow: 0 15px 40px rgba(0,0,0,.7);
  z-index: 99999;
}

.headerHomePage .menu li:hover > ul{ display:block; }

.headerHomePage .menu ul ul li a{
  display:block;
  padding: 10px 14px;
  white-space: nowrap;
}

/* 3) Evitar que el header pise / tape los stats */
body.bodyHomePage header.headerHomePage{
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding-bottom: 0 !important;
}

body.bodyHomePage .homeStats-wrapper{
  position: relative;
  z-index: 5;
  margin-top: 14px !important;
  clear: both !important;
}

/* Si el bloque de stats se “corta”, esto ayuda */
body.bodyHomePage .wrapper{
  overflow: visible !important;
}
/* ===== HEADER REAL (solo la barra superior) ===== */
.headerHomePage{
  position: relative;
  z-index: 100;
  height: 72px;           /* altura real del menú */
  min-height: 72px;
  overflow: visible;
}

/* SOLO la barra */
.headerHomePage .topPanel{
  height: 72px;
  display: flex;
  align-items: center;
}

/* Todo lo que NO es barra, fuera del flujo del header */
.headerHomePage .headerButtons,
.headerHomePage .countdown{
  position: relative;
  z-index: 1;
}
/* El LI es el ancla del dropdown */
.headerHomePage .menu > ul > li{
  position: relative;
}

/* Submenu */
.headerHomePage .menu ul ul{
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;

  background: rgba(0,0,0,.95);
  border: 1px solid rgba(212,175,55,.4);
  border-radius: 10px;
  padding: 10px 0;
  min-width: 220px;
  box-shadow: 0 20px 45px rgba(0,0,0,.7);

  display: none;
}

.headerHomePage .menu li:hover > ul{
  display: block;
}
/* ===== MENU: ancla real del dropdown ===== */
.headerHomePage nav.menu > ul > li{
  position: relative !important;
}

/* reset total del submenu */
.headerHomePage nav.menu ul ul{
  display: none;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  transform: none !important;

  margin: 10px 0 0 0 !important;
  padding: 10px 0 !important;

  z-index: 99999 !important;

  background: rgba(0,0,0,.96);
  border: 1px solid rgba(212,175,55,.45);
  border-radius: 12px;
  min-width: 220px;

  box-shadow: 0 18px 45px rgba(0,0,0,.75);
}

/* que aparezca pegado */
.headerHomePage nav.menu > ul > li:hover > ul{
  display: block !important;
}

/* items del dropdown */
.headerHomePage nav.menu ul ul li a{
  display: block;
  padding: 10px 14px;
  color: #d4af37;
  white-space: nowrap;
}
.headerHomePage nav.menu ul ul li a:hover{
  background: rgba(212,175,55,.08);
}
/* ===== MENU: mismo alto, padding y hover para TODOS ===== */
.headerHomePage nav.menu > ul{
  display: flex;
  align-items: center;
  gap: 18px;
}

.headerHomePage nav.menu > ul > li > a{
  display: inline-flex;
  align-items: center;
  height: 48px;
  padding: 0 10px;
  line-height: 48px;
  border-radius: 10px;
  transition: .2s ease;
}

.headerHomePage nav.menu > ul > li > a:hover{
  background: rgba(212,175,55,.08);
  box-shadow: 0 0 0 1px rgba(212,175,55,.22) inset;
}
/* ===== MENU PRINCIPAL – VIDA Y JERARQUÍA ===== */
.headerHomePage nav.menu > ul > li > a {
  position: relative;
  color: #d4af37;
  font-weight: 500;
  letter-spacing: 0.5px;
  transition: color .25s ease;
}

/* línea dorada animada */
.headerHomePage nav.menu > ul > li > a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 6px;
  width: 0;
  height: 2px;
  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    #ffef9f,
    #d4af37,
    transparent
  );
  transform: translateX(-50%);
  transition: width .3s ease;
  border-radius: 2px;
}

/* hover */
.headerHomePage nav.menu > ul > li > a:hover {
  color: #ffef9f;
}

.headerHomePage nav.menu > ul > li > a:hover::after {
  width: 80%;
}
.headerHomePage nav.menu > ul > li > a[href*="halloffame"] {
  text-shadow: 0 0 8px rgba(212,175,55,.35);
}
/* =========================================================
   MU IMPERIO – FIX TOP NAV (altura, corte arriba y espaciado)
   Pegar AL FINAL de style.css
   ========================================================= */

/* Altura real de la barra fija */
:root{
  --topbar-h: 88px;
}

/* La topbar es fixed -> dejo espacio para que no tape contenido */
body{
  padding-top: var(--topbar-h);
}

/* Barra superior */
.topPanel{
  height: var(--topbar-h);
  background: rgba(0,0,0,.82) !important;
  backdrop-filter: blur(6px);
  border-bottom: 1px solid rgba(212,175,55,.25);
}

/* Wrapper alineado verticalmente */
.topPanel-wrapper{
  height: var(--topbar-h);
  display: flex;
  align-items: center;
  padding: 0 20px !important;
}

/* Sacar márgenes que empujaban todo para abajo/arriba */
.logo{ margin-top: 0 !important; }
.acc-panel{ margin-top: 0 !important; }

/* Menú: menos separación horizontal y sin padding gigante */
.menu ul{
  align-items: center;
  gap: 14px;
}

.menu ul li{
  padding: 0 !important;              /* mata el 45px 40px */
}

.menu ul li a{
  min-width: 0 !important;            /* mata el min-width:100px */
  display: inline-flex;
  align-items: center;
  height: 44px;
  padding: 0 10px;
  border-radius: 10px;
  line-height: 44px;
  white-space: nowrap;
}

/* Hover prolijo (sin rectángulo azul raro) */
.menu ul li:hover{
  background: transparent !important;
}
.menu ul li a:hover{
  background: rgba(212,175,55,.08);
  box-shadow: 0 0 0 1px rgba(212,175,55,.22) inset;
  color: #ffef9f !important;
}

/* Dropdown: pegado al item y sin empujar layout */
.menu ul li{
  position: relative;
}
.menu ul li ul{
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  transform: none !important;
  margin: 0 !important;
  padding: 10px 0 !important;

  background: rgba(0,0,0,.96);
  border: 1px solid rgba(212,175,55,.35);
  border-radius: 12px;
  box-shadow: 0 18px 45px rgba(0,0,0,.75);
  z-index: 99999;

  display: none;
}
.menu ul li:hover ul{
  display: block !important;
}

/* Items del dropdown */
.menu ul li ul li{
  padding: 0 !important;
}
.menu ul li ul li a{
  height: auto;
  line-height: 1.2;
  padding: 10px 14px;
  border-radius: 0;
}

/* Importante: NO recortes el headerHomePage (si lo fijaste en 72px, lo anulo) */
.headerHomePage{
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

/* Si te quedaron outlines de debug, los apago */
.headerHomePage,
.newsBlock{
  outline: none !important;
}
/* =========================================================
   FIX ESPACIO VACÍO ENTRE MENU Y SLIDER (headerButtons)
   ========================================================= */

/* El contenedor que genera el hueco */
.headerButtons,
.headerButtons.flex{
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    display: none !important; /* lo ocultamos */
}

/* Por las dudas, el wrapper interno */
.headerButtons > *{
    margin: 0 !important;
    padding: 0 !important;
}

/* El slider sube automáticamente */
.homeSlider,
#slider,
.slider{
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* =========================================================
   FIX 1: subrayado dorado centrado
   ========================================================= */

/* Asegura que el link sea el “ancla” del subrayado */
.menu ul li a{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Subrayado centrado real */
.menu ul li a::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 8px;                /* ajustá 6-10px si lo querés más pegado */
  transform: translateX(-50%);
  width: 0;
  height: 2px;
  background: rgba(212,175,55,0.95);
  border-radius: 2px;
  transition: width .18s ease;
}

/* En hover, aparece y queda centrado */
.menu ul li a:hover::after,
.menu ul li:hover > a::after{
  width: 70%;                 /* ajustá 60-80% a gusto */
}

/* =========================================================
   FIX 2: dropdown no desaparece al bajar el mouse
   (se arregla el “gap” entre el link y el submenu)
   ========================================================= */

.menu ul li{
  position: relative;
}

/* El submenu queda pegado al item (sin hueco) */
.menu ul li ul{
  top: 100% !important;
  margin-top: 0 !important;
  padding-top: 8px !important; /* “zona puente” dentro del submenu */
}

/* Creamos un “puente invisible” entre el link y el submenu */
.menu ul li.has-sub::before,
.menu ul li:has(ul)::before{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 10px;               /* zona puente */
}

/* Mantener abierto mientras estás en el LI o en el submenu */
.menu ul li:hover > ul{
  display: block !important;
}

/* Opcional: que el submenu no se vaya atrás de otros bloques */
.menu ul li ul{
  z-index: 999999 !important;
}
/* =========================================================
   FIX FINAL: subrayado dorado EXACTO bajo el texto
   ========================================================= */

/* El link deja de ser referencia vertical */
.menu ul li a{
  position: relative;
  display: inline-block !important;   /* CLAVE */
  padding: 0 10px;
  line-height: 1.2;                    /* altura real del texto */
}

/* Subrayado basado en texto, no en el botón */
.menu ul li a::after{
  content: "";
  position: absolute;
  left: 50%;
  top: calc(100% + 6px);               /* SIEMPRE debajo del texto */
  transform: translateX(-50%);
  width: 0;
  height: 2px;
  background: rgba(212,175,55,.95);
  border-radius: 2px;
  transition: width .18s ease;
}

/* Hover */
.menu ul li:hover > a::after{
  width: 100%;                         /* mismo ancho que el texto */
}

/* =========================================================
   MENU MODERNO + SUBRAYADO PERFECTO (sin corrimiento)
   ========================================================= */

/* Fuente moderna (si el server tiene internet, se carga sola) */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700&display=swap');

/* Tipografía + look general del menú */
.menu ul li a{
  font-family: "Montserrat", Arial, sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: .4px;
  font-size: 13px;
  text-transform: uppercase;
  color: rgba(212,175,55,.95) !important;

  /* IMPORTANTE: subrayado nativo (no se corre jamás) */
  text-decoration: none !important;
  text-decoration-color: rgba(212,175,55,.95);
  text-decoration-thickness: 2px;
  text-underline-offset: 8px;   /* ajustá 6-10 a gusto */
}

/* MATAMOS cualquier underline viejo del template */
.menu ul li,
.menu ul li a{
  background-image: none !important;
  box-shadow: none !important;
  border-bottom: none !important;
}
.menu ul li a::after{
  content: none !important; /* desactiva tus pruebas anteriores */
}

/* Hover: aparece el subrayado perfectamente alineado con el texto */
.menu ul li:hover > a,
.menu ul li a:hover{
  color: #ffef9f !important;
  text-decoration: underline !important;
}

/* Opcional: hover con “pill” suave */
.menu ul li a{
  padding: 10px 12px !important;
  border-radius: 10px;
}
.menu ul li a:hover{
  background: rgba(212,175,55,.08) !important;
}
/* =========================================================
   MENU MU – EFECTO RUNA DORADA (moderno, no grasa)
   ========================================================= */

.menu ul li a{
  position: relative;
  font-family: "Montserrat", Arial, sans-serif !important;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: rgba(212,175,55,.9) !important;
  padding: 10px 14px;
  transition: color .25s ease;
}

/* Línea dorada base (invisible) */
.menu ul li a::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 2px;
  transform: translateX(-50%);
  width: 0;
  height: 2px;
  background: linear-gradient(
    90deg,
    rgba(212,175,55,0),
    rgba(255,215,100,.9),
    rgba(212,175,55,0)
  );
  box-shadow: 0 0 6px rgba(212,175,55,.6);
  transition: width .28s ease;
  border-radius: 2px;
}

/* Hover elegante */
.menu ul li:hover > a{
  color: #fff1b8 !important;
  text-shadow: 0 0 8px rgba(212,175,55,.35);
}

/* Aparece la runa */
.menu ul li:hover > a::after{
  width: 80%;
}

/* Página activa (si WebEngine marca .active o .current) */
.menu ul li.active > a,
.menu ul li.current > a{
  color: #fff1b8 !important;
}

.menu ul li.active > a::after,
.menu ul li.current > a::after{
  width: 80%;
}
.menu ul li:hover > a::after{
  animation: runeGlow 1.6s ease-in-out infinite;
}

@keyframes runeGlow{
  0%{ box-shadow: 0 0 6px rgba(212,175,55,.4); }
  50%{ box-shadow: 0 0 12px rgba(255,220,130,.8); }
  100%{ box-shadow: 0 0 6px rgba(212,175,55,.4); }
}
/* =========================================================
   HOME FIX: el main pisaba el menú (WebEngine)
   + underline moderno (barra que viaja)
   ========================================================= */

/* 1) MATAR cualquier underline viejo del template (home suele tener uno) */
.topPanel .menu ul li,
.topPanel .menu ul li a{
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* 2) Link del menú: base */
.topPanel .menu ul li a{
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 10px 14px !important;
  border-radius: 10px !important;

  font-family: "Montserrat", Arial, sans-serif !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: .6px !important;
  text-transform: uppercase !important;

  color: rgba(212,175,55,.9) !important;
  transition: color .25s ease, background .25s ease, transform .25s ease !important;
}

/* 3) Underline moderno: barra que entra + “shine” que corre */
.topPanel .menu ul li a::after{
  content: "" !important;
  position: absolute !important;
  left: 10% !important;
  right: 10% !important;
  bottom: 2px !important;
  height: 2px !important;

  /* base dorada */
  background: linear-gradient(90deg, rgba(212,175,55,.15), rgba(255,220,130,.9), rgba(212,175,55,.15)) !important;
  border-radius: 2px !important;

  /* animación clean (no word) */
  transform: scaleX(0) !important;
  transform-origin: 50% 50% !important;
  transition: transform .28s ease !important;

  /* glow sutil */
  box-shadow: 0 0 10px rgba(212,175,55,.25) !important;
}

/* Shine que corre encima de la barra (se ve “premium”) */
.topPanel .menu ul li a::before{
  content: "" !important;
  position: absolute !important;
  left: 10% !important;
  right: 10% !important;
  bottom: 2px !important;
  height: 2px !important;

  background: linear-gradient(90deg,
    rgba(255,255,255,0),
    rgba(255,255,255,.75),
    rgba(255,255,255,0)
  ) !important;

  border-radius: 2px !important;

  /* por defecto invisible */
  opacity: 0 !important;
  transform: translateX(-80%) !important;
  transition: opacity .2s ease !important;
}

/* Hover */
.topPanel .menu ul li:hover > a{
  color: #fff1b8 !important;
  background: rgba(212,175,55,.06) !important;
  transform: translateY(-1px) !important;
  text-shadow: 0 0 10px rgba(212,175,55,.25) !important;
}

.topPanel .menu ul li:hover > a::after{
  transform: scaleX(1) !important;
}

.topPanel .menu ul li:hover > a::before{
  opacity: 1 !important;
  animation: menuShine 900ms ease forwards !important;
}

@keyframes menuShine{
  0%   { transform: translateX(-80%); }
  100% { transform: translateX(80%); }
}

/* Activo (por si WebEngine marca active/current) */
.topPanel .menu ul li.active > a,
.topPanel .menu ul li.current > a{
  color: #fff1b8 !important;
}

.topPanel .menu ul li.active > a::after,
.topPanel .menu ul li.current > a::after{
  transform: scaleX(1) !important;
}
/* =========================================================
   FIX FINAL: eliminar underline viejo (gris) del template
   ========================================================= */

/* Mata subrayados nativos o del template */
.topPanel .menu ul li a,
.topPanel .menu ul li a:hover,
.topPanel .menu ul li a:focus,
.topPanel .menu ul li a:active{
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

/* Por si el template lo pone en el LI */
.topPanel .menu ul li{
  border-bottom: none !important;
}

/* =========================================================
   Underline moderno (único, dorado)
   ========================================================= */

.topPanel .menu ul li a{
  position: relative !important;
}

/* Línea dorada */
.topPanel .menu ul li a::after{
  content: "" !important;
  position: absolute !important;
  left: 12% !important;
  right: 12% !important;
  bottom: 2px !important;
  height: 2px !important;

  background: linear-gradient(
    90deg,
    rgba(212,175,55,.2),
    rgba(255,220,140,.95),
    rgba(212,175,55,.2)
  ) !important;

  border-radius: 2px !important;
  box-shadow: 0 0 10px rgba(212,175,55,.35) !important;

  transform: scaleX(0) !important;
  transform-origin: center !important;
  transition: transform .25s ease !important;
}

/* Hover */
.topPanel .menu ul li:hover > a::after{
  transform: scaleX(1) !important;
}

/* Activo */
.topPanel .menu ul li.active > a::after,
.topPanel .menu ul li.current > a::after{
  transform: scaleX(1) !important;
}
/* =========================================================
   FIX LINEA GRIS EN DROPDOWN + ESTILO PRO
   ========================================================= */

/* Quitar líneas/ sombras raras dentro del dropdown */
.topPanel .menu ul li ul,
.topPanel .menu ul li ul li,
.topPanel .menu ul li ul li a{
  border: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
  text-decoration: none !important;
}

/* Dropdown contenedor (glass MU) */
.topPanel .menu ul li ul{
  background: rgba(0,0,0,.92) !important;
  border: 1px solid rgba(212,175,55,.28) !important;
  border-radius: 12px !important;
  overflow: hidden !important; /* evita artefactos internos */
}

/* Items del dropdown */
.topPanel .menu ul li ul li{
  border-bottom: 0 !important; /* mata separadores grises */
}

/* Link dropdown */
.topPanel .menu ul li ul li a{
  display: block !important;
  padding: 10px 14px !important;
  color: rgba(212,175,55,.88) !important;
  font-size: 12px !important;
  letter-spacing: .5px !important;
  text-transform: uppercase !important;
}

/* Hover dropdown (pro) */
.topPanel .menu ul li ul li a:hover{
  background: rgba(212,175,55,.08) !important;
  color: #fff1b8 !important;
}
/* =========================================================
   FIX: el ::before del template rompe el menú top
   ========================================================= */

/* Apaga el before SOLO en el menú de arriba */
.topPanel .menu ul li > a::before{
  content: none !important;
  display: none !important;
}

/* (Opcional) por si también usa ::after viejo en el template */
.topPanel .menu ul li > a::after{
  /* lo dejamos activo si tu underline moderno usa ::after
     si NO lo usa, descomentá estas 2 líneas:
  content: none !important;
  display: none !important;
  */
}
.events-block {
  border: 2px solid red !important;
  min-height: 200px;
  display: block !important;
}
/* ============================
   HOME - NEWS + EVENTS LAYOUT
   ============================ */

/* Contenedor principal (slider + news + eventos) */
body.bodyHomePage .newsBlockFlex{
  display: flex;
  gap: 15px;
  align-items: stretch;
  overflow: visible; /* importante: que no corte columnas */
}

/* Slider: ocupa todo el ancho disponible */
body.bodyHomePage .swiper-news{
  flex: 1 1 auto;
  min-width: 0; /* CLAVE para que no empuje el resto */
}

/* Columna News */
body.bodyHomePage .news-block{
  flex: 0 0 340px;
}

/* Columna Eventos */
body.bodyHomePage .events-block{
  flex: 0 0 320px;
  overflow: visible; /* si estaba hidden, lo pisamos */
}

/* Responsive: apilar en pantallas chicas */
@media (max-width: 1200px){
  body.bodyHomePage .newsBlockFlex{
    flex-direction: column;
  }
  body.bodyHomePage .news-block,
  body.bodyHomePage .events-block{
    flex: 1 1 auto;
    width: 100%;
  }
}
/* ============ HOME: NEWS + EVENTS ============ */
body.bodyHomePage .newsBlock{
  display: flex !important;
  gap: 15px;
  align-items: stretch;
  overflow: visible !important;
}

body.bodyHomePage .newsBlock > .swiper-news{
  flex: 1 1 auto;
  min-width: 0;
}

body.bodyHomePage .newsBlock > .news-block{
  flex: 0 0 340px;
  display: block !important;
}

body.bodyHomePage .newsBlock > .events-block{
  flex: 0 0 320px;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative;
  z-index: 5;
}

/* Si algún estilo viejo lo está ocultando en responsive */
@media (max-width: 1200px){
  body.bodyHomePage .newsBlock{
    flex-direction: column;
  }
  body.bodyHomePage .newsBlock > .news-block,
  body.bodyHomePage .newsBlock > .events-block{
    flex: 1 1 auto;
    width: 100%;
  }
}
/* =========================
   EVENTS - MODERN CARD UI
   ========================= */

body.bodyHomePage .events-block{
  background: rgba(10,10,10,.55) !important;
  border: 1px solid rgba(255, 204, 102, .18) !important;
  border-radius: 14px;
  padding: 14px 14px 10px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:
    0 10px 30px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,204,102,.06) inset;
  position: relative;
  overflow: hidden;
}

body.bodyHomePage .events-block:before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(600px 220px at 20% 0%,
    rgba(255,204,102,.18),
    transparent 55%);
  pointer-events:none;
}

body.bodyHomePage .events-block-header{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding: 2px 2px 10px;
  border-bottom: 1px solid rgba(255, 204, 102, .10);
  margin-bottom: 10px;
}

body.bodyHomePage .events-title{
  font-size: 14px;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: rgba(255, 220, 150, .95);
}

body.bodyHomePage .events-subtitle{
  font-size: 12px;
  color: rgba(255,255,255,.55);
}

/* =========================
   EVENTS - MODERN CARD UI
   ========================= */

body.bodyHomePage .events-block{
  background: rgba(10,10,10,.55) !important;
  border: 1px solid rgba(255, 204, 102, .18) !important;
  border-radius: 14px;
  padding: 14px 14px 10px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:
    0 10px 30px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,204,102,.06) inset;
  position: relative;
  overflow: hidden;
}

body.bodyHomePage .events-block:before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(600px 220px at 20% 0%,
    rgba(255,204,102,.18),
    transparent 55%);
  pointer-events:none;
}

body.bodyHomePage .events-block-header{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding: 2px 2px 10px;
  border-bottom: 1px solid rgba(255, 204, 102, .10);
  margin-bottom: 10px;
}

body.bodyHomePage .events-title{
  font-size: 14px;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: rgba(255, 220, 150, .95);
}

body.bodyHomePage .events-subtitle{
  font-size: 12px;
  color: rgba(255,255,255,.55);
}
body.bodyHomePage .events-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

body.bodyHomePage .event-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255, 204, 102, .10);
  background: rgba(0,0,0,.22);
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

body.bodyHomePage .event-row:hover{
  transform: translateY(-1px);
  border-color: rgba(255, 204, 102, .25);
  background: rgba(0,0,0,.30);
}

body.bodyHomePage .event-left .event-name{
  display:block;
  font-weight: 700;
  font-size: 13px;
  color: rgba(255, 220, 150, .92);
}

body.bodyHomePage .event-left small{
  display:block;
  margin-top:2px;
  font-size: 11px;
  color: rgba(255,255,255,.45);
}

body.bodyHomePage .event-right{
  text-align:right;
}

body.bodyHomePage .event-next{
  display:block;
  font-weight:700;
  font-size: 12px;
  color: rgba(255, 204, 102, .95);
}

body.bodyHomePage .event-timer{
  display:block;
  margin-top:2px;
  font-size: 11px;
  color: rgba(255,255,255,.65);
  font-variant-numeric: tabular-nums;
}
body.bodyHomePage .event-row.is-soon{
  border-color: rgba(255, 204, 102, .35);
  box-shadow: 0 0 18px rgba(255, 204, 102, .10);
}

body.bodyHomePage .event-row.is-now{
  border-color: rgba(80, 255, 160, .35);
  box-shadow: 0 0 18px rgba(80, 255, 160, .10);
}

body.bodyHomePage .event-row.is-now .event-next{
  color: rgba(120, 255, 190, .95);
}
/* MAPA / UBICACIÓN */
body.bodyHomePage .event-map{
  display:block;
  margin-top:2px;
  font-size: 11px;
  color: rgba(255,255,255,.42);
}

/* BADGE LIVE */
body.bodyHomePage .event-live{
  display:none;
  align-items:center;
  justify-content:center;
  gap:6px;
  position:absolute;
  right: 10px;
  top: 10px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: rgba(0,0,0,.9);
  background: rgba(120,255,190,.95);
  box-shadow: 0 0 18px rgba(120,255,190,.25);
}

body.bodyHomePage .event-row{
  position: relative; /* necesario para ubicar el badge */
}

body.bodyHomePage .event-row.is-now{
  border-color: rgba(80, 255, 160, .35) !important;
  box-shadow: 0 0 18px rgba(80, 255, 160, .10);
}
/* Sidebar cards debajo de Próximos eventos */
.bodyHomePage .sidecards{
  width: 320px;
  margin-left: 15px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.bodyHomePage .sidecard{
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255, 204, 102, .22);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  backdrop-filter: blur(6px);
}

.bodyHomePage .sidecard-header{
  padding: 12px 14px;
  border-bottom: 1px solid rgba(255,204,102,.14);
}

.bodyHomePage .sidecard-title{
  color: #ffcc66;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: none;
  font-size: 13px;
}

.bodyHomePage .sidecard-body{
  padding: 10px 14px 12px;
}

.bodyHomePage .info-row{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px dashed rgba(255,255,255,.06);
}

.bodyHomePage .info-row:last-child{
  border-bottom: 0;
}

.bodyHomePage .info-row .k{
  color: rgba(255,255,255,.75);
  font-size: 12px;
}

.bodyHomePage .info-row .v{
  color: rgba(255,255,255,.9);
  font-size: 12px;
  font-weight: 600;
}

.bodyHomePage .info-sep{
  height: 10px;
  margin: 8px 0;
  border-bottom: 1px solid rgba(255,204,102,.12);
}

.bodyHomePage .pill{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .3px;
}

.bodyHomePage .pill:before{
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}

.bodyHomePage .pill-on{
  color: #7CFFB2;
  border: 1px solid rgba(124,255,178,.25);
  background: rgba(30, 255, 140, .08);
}

.bodyHomePage .pill-on:before{
  background: #1eff8c;
  box-shadow: 0 0 10px rgba(30,255,140,.6);
}

.bodyHomePage .pill-off{
  color: #ff6b6b;
  border: 1px solid rgba(255,107,107,.25);
  background: rgba(255, 50, 50, .08);
}

.bodyHomePage .pill-off:before{
  background: #ff3b3b;
  box-shadow: 0 0 10px rgba(255,59,59,.55);
}

/* Para que quede alineado con el panel de eventos */
.bodyHomePage .newsBlock{
  align-items: flex-start;
}
/* =========================================================
   FIX DEFINITIVO: EVENTOS AL BORDE DERECHO (FUERA DEL WRAPPER)
   Pegar al FINAL del CSS
   ========================================================= */

/* 1) Reservar espacio en el wrapper para que no se tape el contenido */
@media (min-width: 1201px){
  .wrapper{
    padding-right: 360px !important; /* 320 + aire */
  }
}

/* 2) Anclar la columna de eventos al viewport (derecha real) */
@media (min-width: 1201px){
  /* cubro ambos nombres porque en tu CSS existen .eventsBlock y .events-block */
  .eventsBlock,
  .events-block{
    position: fixed !important;
    right: 30px !important;   /* pegado a la derecha */
    top: 160px !important;    /* bajalo/subilo a gusto */
    width: 320px !important;
    z-index: 99999 !important;

    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    margin: 0 !important;
    float: none !important;
  }

  /* 3) Evitar que el contenedor lo “empuje” o le aplique layout */
  .newsBlock,
  .newsBlockFlex{
    overflow: visible !important;
  }
}

/* 4) En pantallas chicas vuelve al flujo normal */
@media (max-width: 1200px){
  .wrapper{ padding-right: 0 !important; }

  .eventsBlock,
  .events-block{
    position: static !important;
    width: 100% !important;
    right: auto !important;
    top: auto !important;
  }
}

/* =========================================
   FIX #1: SLIDER (swiper) con altura real
   ========================================= */

/* Contenedor del bloque slider/news */
body.bodyHomePage .newsBlock{
  max-width: 1200px;
  margin: 22px auto 0 auto;
  width: 100%;
  display: flex;
  gap: 15px;
  align-items: stretch;
}

/* Slider: que ocupe el espacio y NO colapse */
body.bodyHomePage .swiper-news,
body.bodyHomePage .newsBlock .swiper-container{
  flex: 1 1 auto;
  min-width: 0;
  height: 394px !important;     /* el alto original del template */
  overflow: hidden;
  border-radius: 12px;
}

/* Si tus slides van por background-image, esto es CLAVE */
body.bodyHomePage .swiper-news .swiper-wrapper,
body.bodyHomePage .swiper-news .swiper-slide{
  height: 100% !important;
}

body.bodyHomePage .swiper-news .swiper-slide{
  background-size: cover !important;
  background-position: center !important;
}
/* =========================================
   FIX #2: EVENTOS alineado al bloque
   ========================================= */

body.bodyHomePage .events-block{
  flex: 0 0 320px;
  width: 320px;
  margin: 0 !important;
  position: relative !important;
  right: auto !important;
  left: auto !important;
  top: auto !important;
  display: block !important;
}

/* Columna news al lado del slider */
body.bodyHomePage .news-block{
  flex: 0 0 340px;
  width: 340px;
  margin: 0 !important;
  display: block !important;
}

/* Responsive: apilar */
@media (max-width: 1200px){
  body.bodyHomePage .newsBlock{
    flex-direction: column;
  }
  body.bodyHomePage .swiper-news,
  body.bodyHomePage .news-block,
  body.bodyHomePage .events-block{
    width: 100% !important;
    flex: 1 1 auto !important;
  }
  body.bodyHomePage .swiper-news,
  body.bodyHomePage .newsBlock .swiper-container{
    height: 360px !important;
  }
}
/* =========================================
   FIX #3: THUMBS PJ (circulo bien recortado)
   ========================================= */

.gallery-thumbs span{
  overflow: hidden;          /* recorta al circulo */
  border-radius: 50%;
}

.gallery-thumbs span img{
  width: 96px !important;
  height: 96px !important;
  object-fit: cover;         /* encuadra sin deformar */
  border-radius: 50%;
  display: block;
}