html, body { background: #050505 !important; }
html { scrollbar-color: #5a2418 #050505; scrollbar-width: thin; }
html::-webkit-scrollbar { width: 12px; background: #050505; }
html::-webkit-scrollbar-track { background: #050505; }
html::-webkit-scrollbar-thumb { background: #5a2418; border: 2px solid #050505; border-radius: 8px; }
html::-webkit-scrollbar-thumb:hover { background: #8a3824; }

.armagedon-home-link { display: none !important; }

/* Hermandades usa un diseño de ancho completo: elimina el relleno de Bulma del contenedor padre. */
section.section { padding-left: 0 !important; padding-right: 0 !important; }

.guilds-site-shell {
	position: relative;
	left: 50%;
	width: 100vw;
	max-width: none;
	margin: -3rem 0 3.5rem -50vw;
	background: #050505;
	font-family: "Open Sans", Arial, sans-serif;
}
.guilds-main-nav {
	min-height: 88px;
	display: grid;
	grid-template-columns: 190px minmax(700px, 1fr) auto;
	align-items: center;
	gap: 20px;
	padding: 0 38px;
	background: #030303;
	border-bottom: 1px solid #2d291f;
}
.guilds-brand { display: flex; align-items: center; }
.guilds-brand img { width: 136px; height: 74px; object-fit: contain; }
.guilds-main-nav nav { display: flex; justify-content: center; align-items: stretch; gap: 27px; height: 88px; }
.guilds-main-nav nav a, .guilds-nav-actions a, .guilds-nav-actions span {
	display: flex; align-items: center; color: #f1eadf; font-size: 14px; font-weight: 700;
	letter-spacing: .07em; text-transform: uppercase; text-decoration: none; white-space: nowrap;
}
.guilds-main-nav nav a { position: relative; }
.guilds-main-nav nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 23px; height: 2px; background: #f6bf00; transform: scaleX(0); }
.guilds-main-nav nav a:hover, .guilds-main-nav nav a.is-active { color: #f6bf00; }
.guilds-main-nav nav a.is-active::after, .guilds-main-nav nav a:hover::after { transform: scaleX(1); }
.guilds-nav-actions { display: flex; align-items: center; gap: 20px; }
.guilds-nav-actions .guilds-play { background: #ffc400; color: #090909; padding: 15px 22px; border-radius: 2px; }
.guilds-page-hero {
	position: relative; width: 100%; height: 324px; overflow: hidden;
	display: flex; align-items: center; background: #090402;
	border-bottom: 1px solid #4a3b1a;
}
.guilds-page-hero__image { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center top; }
.guilds-page-hero__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(2,7,12,.88), rgba(2,7,12,.34) 62%, rgba(2,7,12,.5)); }
.guilds-page-hero__inner { position: relative; z-index: 2; width: min(1620px, calc(100% - 140px)); margin: 0 auto; }
.guilds-page-hero__inner p { margin: 0 0 18px; color: #e2b54e; font-size: 14px; font-weight: 700; letter-spacing: .28em; }
.guilds-page-hero__inner h1 { margin: 0 0 20px; color: #f4f0e8; font: 600 clamp(45px, 4vw, 66px)/1 "Cinzel", Georgia, serif; text-transform: uppercase; }
.guilds-page-hero__inner span { color: #d9d0c3; font-size: 17px; }
.guilds-content { max-width: 1800px; margin: 0 auto; padding: 0 2rem 3rem; }

#select-guild-realm-container { display: flex; align-items: center; gap: .5rem; margin-bottom: 1.25rem; }
#guilds_processing { height: 70px; }
.faction-badge { display: inline-block; min-width: 78px; padding: .25rem .55rem; border-radius: 999px; font-weight: 700; text-align: center; }
.faction-badge.alliance { background: rgba(35,105,190,.22); color: #78b8ff; }
.faction-badge.horde { background: rgba(185,25,25,.22); color: #ff7777; }

@media (max-width: 1500px) {
	.guilds-main-nav { grid-template-columns: 150px 1fr; padding: 0 24px; }
	.guilds-main-nav nav { gap: 17px; }
	.guilds-nav-actions { grid-column: 1 / -1; justify-content: flex-end; padding-bottom: 14px; }
}
@media (max-width: 1050px) {
	.guilds-main-nav { display: block; padding: 10px 20px 18px; }
	.guilds-brand { justify-content: center; }
	.guilds-main-nav nav { height: auto; flex-wrap: wrap; gap: 8px 20px; }
	.guilds-main-nav nav a { padding: 8px 0; }
	.guilds-main-nav nav a::after { bottom: 2px; }
	.guilds-nav-actions { justify-content: center; margin-top: 12px; }
	.guilds-page-hero__inner { width: calc(100% - 48px); }
}
@media (max-width: 700px) {
	.guilds-site-shell { margin-top: -3rem; }
	.guilds-main-nav nav { justify-content: center; }
	.guilds-nav-actions { flex-wrap: wrap; }
	.guilds-page-hero { height: 250px; }
	.guilds-page-hero__inner h1 { font-size: 38px; }
	.guilds-content { padding: 0 .75rem 2rem; overflow-x: auto; }
}