:root{
  --ice:#8de7ff;
  --ice-bright:#d9f8ff;
  --blue:#238fc7;
  --deep:#020711;
  --panel:#07111de8;
  --panel-warm:#160d08e8;
  --gold:#d9a441;
  --gold-bright:#ffe39a;
  --line:#35566c;
  --text:#e7f4fb;
  --muted:#9eb6c5;
  --danger:#ff7575;
  --success:#75ffa7;
}

@font-face{
  font-family:"Cinzel Decorative";
  src:url("/assets/fonts/cinzel-decorative-latin-700-normal.woff2") format("woff2");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}
@font-face{
  font-family:"Cinzel";
  src:url("/assets/fonts/cinzel-latin-700-normal.woff2") format("woff2");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--text);
  font-family:"Trebuchet MS",Verdana,Arial,sans-serif;
  background:
    linear-gradient(180deg,rgba(1,5,12,.38) 0,rgba(1,6,13,.74) 46%,#02050a 100%),
    url("/assets/spainlive-frozen-citadel.png") center top/cover fixed no-repeat,
    #020711;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 5%,rgba(72,190,255,.14),transparent 35%),
    linear-gradient(90deg,rgba(0,0,0,.55),transparent 25%,transparent 75%,rgba(0,0,0,.55));
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.22;
  background-image:
    repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(126,220,255,.025) 4px),
    radial-gradient(ellipse at top,#4cbbe333,transparent 52%);
}

body.page-inicio{
  background:#020407;
}
body.page-inicio::before{
  inset:-28px;
  z-index:-2;
  opacity:.82;
  filter:blur(14px) saturate(1.12);
  transform:scale(1.035);
  background:
    linear-gradient(90deg,rgba(0,0,0,.2),rgba(0,0,0,.7) 48%,rgba(0,0,0,.18)),
    url("/assets/spainlive-dual-wotlk.png") left center/55% 100% no-repeat,
    url("/assets/spainlive-dual-cata.png") right center/55% 100% no-repeat,
    #020407;
}
body.page-inicio::after{
  z-index:-1;
  opacity:1;
  background:
    radial-gradient(circle at 24% 20%,rgba(74,195,255,.18),transparent 38%),
    radial-gradient(circle at 78% 22%,rgba(255,91,24,.2),transparent 38%),
    linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.76));
}
a{color:var(--ice);text-decoration:none}
a:hover{color:var(--ice-bright)}

.wrap{
  width:min(1450px,calc(100% - 36px));
  margin:28px auto;
  padding:0 28px 34px;
  position:relative;
  background:linear-gradient(180deg,rgba(3,10,18,.9),rgba(2,6,11,.96));
  border:1px solid #58788d;
  border-radius:6px;
  box-shadow:0 0 0 3px #07131e,0 0 0 4px #9a6f2c,0 24px 80px #000,inset 0 0 60px rgba(35,143,199,.08);
}
.wrap::before,.wrap::after{
  content:"◆";
  position:absolute;
  top:-17px;
  color:var(--gold-bright);
  font-size:28px;
  text-shadow:0 0 12px #36b8ff;
}
.wrap::before{left:20px}.wrap::after{right:20px}

.logo{
  position:relative;
  text-align:center;
  padding:30px 10px 18px;
  overflow:hidden;
  border-bottom:1px solid rgba(137,204,235,.25);
}
.logo-main{
  display:inline-block;
  padding:.04em .12em .1em;
  font-family:"Cinzel Decorative","Cinzel",Georgia,"Times New Roman",serif;
  font-size:clamp(45px,5.6vw,72px);
  font-weight:700;
  letter-spacing:.045em;
  line-height:.95;
  color:var(--gold-bright);
  background:
    linear-gradient(180deg,#fffbe4 0,#f4df9a 20%,#c79a45 43%,#fff1b8 52%,#b97d2c 70%,#6d4217 88%,#dfb65f 100%);
  background-size:100% 150%;
  background-position:center 10%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  -webkit-text-stroke:.7px rgba(255,239,185,.72);
  paint-order:stroke fill;
  filter:
    drop-shadow(0 1px 0 #fff5cb)
    drop-shadow(0 2px 0 #9b6a28)
    drop-shadow(0 3px 0 #38240f)
    drop-shadow(1px 0 0 #06131d)
    drop-shadow(-1px 0 0 #06131d)
    drop-shadow(0 0 6px rgba(221,177,84,.45))
    drop-shadow(0 8px 16px rgba(0,0,0,.65));
  animation:elegantLogoSheen 8s ease-in-out infinite;
}
.logo small{
  display:block;
  margin-top:8px;
  color:#d5f2ff;
  font-family:"Cinzel",Georgia,serif;
  font-size:clamp(10px,1.1vw,14px);
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  text-shadow:0 2px 6px #000,0 0 9px #2bbaff66;
}
@keyframes elegantLogoSheen{
  0%,100%{background-position:center 10%}
  50%{background-position:center 72%}
}

nav{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:6px;
  margin:0 -28px 26px;
  padding:11px 22px;
  background:linear-gradient(180deg,#14293a,#07111c 55%,#03080e);
  border-top:1px solid #55778e;
  border-bottom:1px solid #8c672c;
  box-shadow:0 8px 22px #000;
}
nav a,.button,button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  margin:3px;
  padding:10px 17px;
  border:1px solid #9b7436;
  border-radius:4px;
  color:#fff3c4;
  font-weight:700;
  text-decoration:none;
  text-shadow:0 1px 2px #000;
  background:linear-gradient(180deg,#5b421d,#2b1a0c 54%,#120b06);
  box-shadow:inset 0 1px #e5bd6b66,0 2px 8px #000;
  cursor:pointer;
  transition:.18s ease;
}
nav a:hover,.button:hover,button:hover{
  color:white;
  border-color:#9be8ff;
  background:linear-gradient(180deg,#246e94,#10364f 54%,#071826);
  box-shadow:inset 0 1px #d7f8ff88,0 0 15px #26b9ff66;
  transform:translateY(-1px);
}
nav a[aria-current="page"]{
  color:#fff6cf;
  border-color:#d8aa55;
  background:linear-gradient(180deg,#74511f,#321b09 54%,#160b04);
  box-shadow:inset 0 1px #ffe5a377,0 0 14px #49c5ff55;
}
button:disabled{filter:grayscale(1);opacity:.5;cursor:not-allowed;transform:none}

.card{
  position:relative;
  margin:20px 0;
  padding:24px;
  overflow:hidden;
  background:linear-gradient(145deg,var(--panel),var(--panel-warm));
  border:1px solid #46677a;
  border-radius:5px;
  box-shadow:inset 0 0 0 1px #000,inset 0 0 35px #000,0 8px 25px #0009;
}
.card::before{
  content:"";
  position:absolute;
  inset:5px;
  pointer-events:none;
  border:1px solid rgba(218,164,65,.22);
  border-radius:3px;
}
.card > *{position:relative;z-index:1}
.card::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-95px;
  top:-105px;
  transform:rotate(45deg);
  border:1px solid rgba(109,201,240,.12);
  box-shadow:0 0 25px rgba(41,167,220,.08);
}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif}
h2{
  margin-top:0;
  color:var(--gold-bright);
  border-bottom:1px solid #6d5736;
  padding-bottom:10px;
  text-shadow:0 2px 4px #000,0 0 10px #bd7b2488;
}
h3{color:var(--ice);text-shadow:0 1px 3px #000}
p,li{line-height:1.65}

input,select,textarea{
  width:100%;
  padding:13px 14px;
  margin:7px 0;
  color:#ecf8ff;
  background:#020811e8;
  border:1px solid #496c82;
  border-radius:4px;
  outline:none;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--ice);
  box-shadow:0 0 0 2px rgba(71,192,240,.18);
}
table{
  width:100%;
  border-collapse:collapse;
  margin-top:15px;
  background:#02070ccb;
}
tbody tr:nth-child(even) td{background:rgba(19,37,51,.3)}
th,td{padding:11px;border-bottom:1px solid #294454;text-align:left}
th{color:var(--gold-bright);background:#101820}
tr:hover td{background:#0c1a2488}
.on{color:var(--success);text-shadow:0 0 8px #00ff55}
.off{color:var(--danger);text-shadow:0 0 8px #ff0000}
.msg{color:white;font-weight:bold;margin-top:14px}
.msg.success{color:var(--success);text-shadow:0 0 10px rgba(117,255,167,.28)}
.msg.error{color:var(--danger)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}

.player-home{margin:0 -28px 26px}
.hero{
  min-height:530px;
  display:grid;
  place-items:center;
  text-align:center;
  padding:70px 24px 55px;
  background:
    linear-gradient(180deg,rgba(0,7,17,.18),rgba(1,7,14,.38) 56%,#030810 100%),
    url("/assets/spainlive-frozen-citadel.png") center 43%/cover no-repeat;
  border-bottom:1px solid #9a7134;
  box-shadow:inset 0 -90px 90px #030810;
}

.page-inicio .hero{
  min-height:660px;
  isolation:isolate;
  background:
    linear-gradient(90deg,rgba(2,9,18,.2),rgba(0,0,0,.7) 48%,rgba(24,8,2,.2)),
    linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.18) 56%,#03070c 100%),
    url("/assets/spainlive-dual-wotlk.png") left center/54% cover no-repeat,
    url("/assets/spainlive-dual-cata.png") right center/54% cover no-repeat;
}
.page-inicio .hero::after{
  right:50%;
  left:auto;
  top:4%;
  bottom:4%;
  width:1px;
  opacity:.7;
  background:linear-gradient(transparent,#d6ecff,#f1ad62,transparent);
  box-shadow:0 0 28px #fff;
}
.dual-hero-title{
  margin:14px 0 16px;
  font-family:"Cinzel Decorative","Cinzel",Georgia,serif;
  line-height:.9;
}
.dual-hero-title span{
  display:block;
  font-size:clamp(54px,7vw,98px);
  color:#ffe2a0;
  text-shadow:0 3px 0 #281606,0 0 20px #000,0 0 35px rgba(255,192,89,.32);
}
.dual-hero-title small{
  display:block;
  margin-top:17px;
  color:#e7eef4;
  font-size:clamp(12px,1.4vw,18px);
  letter-spacing:.42em;
}
.dual-realms{
  display:grid;
  grid-template-columns:1fr 1px 1fr;
  align-items:center;
  width:min(780px,94vw);
  margin:26px auto 12px;
  border:1px solid rgba(177,198,211,.45);
  background:rgba(2,5,8,.72);
  box-shadow:0 15px 40px #000,inset 0 0 35px #000;
  backdrop-filter:blur(8px);
}
.dual-realm{padding:18px 22px;text-align:center}
.dual-realm span{display:block;font:700 .75rem "Cinzel",Georgia,serif;letter-spacing:.15em}
.dual-realm strong{display:block;margin:7px 0 4px;font:700 1.8rem Georgia,serif}
.dual-realm small{color:#b8c3cc}
.dual-realm-wotlk span,.dual-realm-wotlk strong{color:#a9ebff;text-shadow:0 0 12px #2caee9}
.dual-realm-cata span,.dual-realm-cata strong{color:#ffb167;text-shadow:0 0 12px #ef531b}
.dual-divider{height:76%;background:linear-gradient(transparent,#dfe9ef,transparent)}
.hero-actions .cata-action{border-color:#ffb46b;background:linear-gradient(180deg,#b94c18,#5d1c08 58%,#260b04)}
.hero-actions .wotlk-action{border-color:#b9efff;background:linear-gradient(180deg,#267eac,#0d3c59 58%,#061724)}
.dual-server-strip{grid-template-columns:repeat(6,1fr);max-width:1240px}
.dual-server-strip .server-stat:nth-child(3){border-right:2px solid #a76c37}
.server-label.wotlk-label{background:linear-gradient(135deg,rgba(32,137,190,.28),transparent)}
.server-label.cata-label{background:linear-gradient(135deg,rgba(218,72,18,.3),transparent)}
.server-label.wotlk-label b{color:#9feaff}
.server-label.cata-label b{color:#ffad61}
.wotlk-download{
  color:#031018;
  border-color:#aeeeff;
  background:linear-gradient(180deg,#aeeeff,#39a7d2 58%,#12516f);
  box-shadow:0 0 14px rgba(52,185,235,.25);
}

@media(max-width:980px){
  .dual-server-strip{grid-template-columns:repeat(3,1fr)}
  .dual-server-strip .server-stat:nth-child(3){border-right:0}
  .dual-server-strip .server-stat:nth-child(-n+3){border-bottom:1px solid #314b5b}
}
@media(max-width:700px){
  body.page-inicio::before{
    background:
      linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.65)),
      url("/assets/spainlive-dual-wotlk.png") center top/auto 52% no-repeat,
      url("/assets/spainlive-dual-cata.png") center bottom/auto 52% no-repeat;
  }
  .page-inicio .hero{
    background:
      linear-gradient(180deg,rgba(1,8,15,.25),rgba(0,0,0,.76) 48%,rgba(31,9,2,.28)),
      url("/assets/spainlive-dual-wotlk.png") center top/auto 54% no-repeat,
      url("/assets/spainlive-dual-cata.png") center bottom/auto 54% no-repeat;
  }
  .dual-realms{grid-template-columns:1fr}
  .dual-divider{width:80%;height:1px;margin:auto}
  .dual-server-strip{grid-template-columns:1fr 1fr}
  .dual-server-strip .server-stat{border-bottom:1px solid #314b5b}
}
.hero-content{max-width:900px}
.hero-kicker{
  color:#b9edff;
  text-transform:uppercase;
  letter-spacing:.24em;
  font-weight:bold;
  text-shadow:0 2px 5px #000;
}
.hero h1{
  margin:12px 0;
  font-size:clamp(58px,10vw,118px);
  line-height:.88;
  letter-spacing:.06em;
  color:#fff2b9;
  text-shadow:0 4px 0 #17232b,0 0 25px #2ebfff,0 0 55px #000;
}
.hero h1 span{display:block;font-size:.3em;color:#a9e8ff;letter-spacing:.3em;margin-top:18px}
.hero-lead{max-width:720px;margin:22px auto;color:#d8eaf3;font-size:1.13rem;text-shadow:0 2px 4px #000}
.hero-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:24px}
.hero-actions .primary{font-size:1.08rem;border-color:#f2d58a;background:linear-gradient(#b77c27,#5b310e 58%,#241104)}
.server-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  max-width:1050px;
  margin:-48px auto 30px;
  position:relative;
  z-index:2;
  background:#06101bea;
  border:1px solid #6e8794;
  box-shadow:0 12px 32px #000;
}
.server-stat{padding:18px;text-align:center;border-right:1px solid #314b5b}
.server-stat:last-child{border:0}
.server-stat b{display:block;color:var(--gold-bright);font-family:Georgia,serif;font-size:1.08rem}
.server-stat span{color:#a9c5d3;font-size:.9rem}
.home-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:0 28px}
.feature-card{
  min-height:190px;
  padding:25px;
  background:linear-gradient(145deg,#0a1723ed,#100b08ed);
  border:1px solid #45677b;
  box-shadow:inset 0 0 25px #000;
}
.feature-icon{font-size:32px;color:var(--ice);text-shadow:0 0 12px #39bfff}
.feature-card h3{margin:8px 0;color:var(--gold-bright)}
.home-steps{margin:22px 28px 0;padding:25px;background:#050c14e8;border:1px solid #6d5530}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.step-card{padding:18px;border-left:3px solid var(--blue);background:#07131e}
.step-card b{display:block;color:var(--gold-bright);margin-bottom:6px}

footer{
  text-align:center;
  width:min(1450px,calc(100% - 36px));
  margin:38px auto 0;
  padding:26px;
  border-top:1px solid #84642e;
  background:#02060bd9;
  color:#9fb1bc;
  font-size:13px;
  line-height:1.7;
}

@media(min-width:1100px){
  nav{position:sticky;top:0;z-index:50}
}

@media(max-width:900px){
  .wrap{width:calc(100% - 18px);margin:10px auto;padding:0 14px 24px}
  nav{margin:0 -14px 20px;padding:8px}
  nav a{padding:9px 12px;font-size:.88rem}
  .player-home{margin:0 -14px 20px}
  .hero{min-height:470px;padding:55px 18px}
  .server-strip{grid-template-columns:repeat(2,1fr);margin:-35px 14px 25px}
  .server-stat:nth-child(2){border-right:0}
  .server-stat:nth-child(-n+2){border-bottom:1px solid #314b5b}
  .home-grid,.steps{grid-template-columns:1fr}
  .home-grid{padding:0 14px}
  .home-steps{margin:20px 14px 0}
  .grid{grid-template-columns:1fr}
  .card{padding:18px}
  table{display:block;overflow-x:auto}
  footer{width:calc(100% - 18px);margin:30px auto 0}
}

/* WotLK interface refresh */
body{
  background:
    linear-gradient(180deg,rgba(1,5,12,.18),rgba(1,5,12,.84) 65%,#010307),
    url("/assets/wotlk-frozen-frame-v2.png") center top/cover fixed no-repeat,
    #01050a;
}
.wrap{
  width:min(1320px,calc(100% - 32px));
  margin:18px auto;
  padding:0 24px 30px;
  border:1px solid #46677b;
  border-radius:2px;
  background:linear-gradient(180deg,rgba(2,10,18,.89),rgba(2,6,11,.97));
  box-shadow:0 0 0 1px #02060b,0 0 0 2px #715525,0 24px 80px #000;
}
.wrap{
  isolation:isolate;
}
.wrap > *{position:relative;z-index:2}
.wrap::before,.wrap::after{
  z-index:3;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border:1px solid #a67d35;
  background:linear-gradient(135deg,#dff8ff,#55b8df 45%,#17354a);
  color:#e8fbff;
  font-size:0;
  transform:rotate(45deg);
  box-shadow:0 0 13px #54cfff,0 0 0 3px #07111a;
}
.wrap::before{left:18px}.wrap::after{right:18px}
.wrap > nav::before,.wrap > nav::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:90px;
  pointer-events:none;
}
.wrap > nav::before{left:0;background:linear-gradient(90deg,#0b1e2d,transparent)}
.wrap > nav::after{right:0;background:linear-gradient(-90deg,#0b1e2d,transparent)}
.wrap::before,.wrap::after{font-size:18px;top:-12px}
.logo{
  min-height:112px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:18px 10px 14px;
  background:
    radial-gradient(ellipse at center,rgba(47,151,200,.13),transparent 60%),
    linear-gradient(180deg,rgba(5,17,28,.75),rgba(2,8,14,.3));
}
.logo::before,.logo::after{
  content:"";
  position:absolute;
  top:50%;
  width:clamp(80px,18vw,270px);
  height:1px;
  background:linear-gradient(90deg,transparent,#5fcdf4,#d2a751);
  box-shadow:0 0 8px #33bfff;
}
.logo::before{
  left:16px;
  top:50%;
  width:min(300px,23vw);
  height:165px;
  opacity:.52;
  transform:translateY(-50%);
  background:url("/assets/wotlk-crest-v1.png") center/contain no-repeat;
  filter:drop-shadow(0 0 14px #35bce8);
}
.logo::after{
  right:16px;
  top:50%;
  width:min(300px,23vw);
  height:165px;
  opacity:.52;
  transform:translateY(-50%) scaleX(-1);
  background:url("/assets/wotlk-crest-v1.png") center/contain no-repeat;
  filter:drop-shadow(0 0 14px #35bce8);
}
.logo-main,.logo small{position:relative;z-index:2}
.logo-main{font-size:clamp(45px,5vw,66px);line-height:1}
.logo small{margin-top:5px;font-size:12px;letter-spacing:.2em}
.page-inicio .logo{display:none}
nav{
  flex-wrap:nowrap;
  justify-content:flex-start;
  gap:0;
  margin:0 -24px 24px;
  padding:0 22px;
  overflow-x:auto;
  background:linear-gradient(180deg,rgba(17,39,56,.98),rgba(3,12,20,.98));
  border-top:1px solid #4b7188;
  border-bottom:1px solid #916b2d;
  scrollbar-width:thin;
}
nav a{
  flex:0 0 auto;
  min-height:48px;
  margin:0;
  padding:0 12px;
  border:0;
  border-right:1px solid rgba(114,151,172,.16);
  border-radius:0;
  color:#cbdce6;
  font-size:13px;
  background:transparent;
  box-shadow:none;
}
nav a:hover,nav a[aria-current="page"]{
  transform:none;
  color:#fff0b0;
  border-color:rgba(114,151,172,.16);
  background:linear-gradient(180deg,rgba(46,134,177,.2),rgba(164,105,25,.14));
  box-shadow:inset 0 -2px #e2b75f;
}
.card{
  border-color:#38566a;
  border-radius:2px;
  background:linear-gradient(135deg,rgba(5,15,24,.96),rgba(12,8,6,.96));
}
.card{
  box-shadow:inset 0 0 0 1px #02070c,inset 0 0 38px #000,0 10px 28px #000b,0 0 18px rgba(37,146,194,.08);
}
.card::before{
  background:
    linear-gradient(135deg,#83dfff 0 2px,transparent 3px) top left,
    linear-gradient(-135deg,#83dfff 0 2px,transparent 3px) top right,
    linear-gradient(45deg,#b98835 0 2px,transparent 3px) bottom left,
    linear-gradient(-45deg,#b98835 0 2px,transparent 3px) bottom right;
  background-size:22px 22px;
  background-repeat:no-repeat;
}
.card::before{inset:4px;border-color:rgba(205,158,67,.18)}
.card::after{display:none}
h2{font-size:1.55rem;letter-spacing:.02em}
.button,button{
  border-radius:2px;
  background:linear-gradient(180deg,#76511b,#321a08 58%,#160b04);
}
.button.primary,.hero-actions .primary{
  border-color:#f0ca70;
  background:linear-gradient(180deg,#b67a22,#633509 58%,#291303);
}
.player-home{margin:0 -24px 24px}
.hero{min-height:620px;border-bottom-color:#856329}
.hero{
  position:relative;
  background:
    linear-gradient(180deg,rgba(0,7,17,.08),rgba(1,7,14,.2) 54%,#030810 100%),
    url("/assets/wotlk-citadel-hero-v2.png") center 47%/cover no-repeat;
  box-shadow:inset 0 0 100px #000,inset 0 -110px 100px #030810;
}
.hero::before,.hero::after{
  content:"";
  position:absolute;
  top:8%;
  bottom:8%;
  width:2px;
  background:linear-gradient(transparent,#57c8ed,#bf8c36,transparent);
  opacity:.55;
  box-shadow:0 0 14px #4ecaff;
}
.hero::before{left:24px}.hero::after{right:24px}
.hero h1{font-size:clamp(62px,9vw,112px)}
.hero h1 span{font-size:.27em}
.section-heading{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-bottom:1px solid #5e4a2c;
  margin-bottom:18px;
}
.section-heading::after{
  content:"✦";
  position:absolute;
  left:50%;
  bottom:-8px;
  padding:0 10px;
  color:#74d8fb;
  background:#071018;
  text-shadow:0 0 10px #27bbf3;
  transform:translateX(-50%);
}
.section-heading h2{border:0;margin:3px 0 10px;padding:0}
.eyebrow{
  color:#78ccec;
  font-size:.7rem;
  font-weight:bold;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.section-rune{
  color:#d9b566;
  font-family:Georgia,serif;
  font-size:1.35rem;
  opacity:.55;
}
.feature-card,.step-card{
  position:relative;
  overflow:hidden;
}
.feature-card::after,.step-card::after{
  content:"";
  position:absolute;
  right:-28px;
  bottom:-28px;
  width:82px;
  height:82px;
  border:1px solid rgba(90,203,240,.2);
  transform:rotate(45deg);
  box-shadow:0 0 20px rgba(32,170,221,.12);
}

.portal-layout{
  display:grid;
  grid-template-columns:minmax(0,1.75fr) minmax(290px,.75fr);
  gap:22px;
  padding:8px 28px 4px;
}
.news-board,.realm-panel,.quick-panel,.realmlist-panel{
  border:1px solid #3b5c70;
  background:linear-gradient(145deg,rgba(5,16,26,.97),rgba(13,8,5,.97));
  box-shadow:inset 0 0 35px #000,0 9px 24px #000a;
}
.news-board{padding:22px}
.portal-title{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:20px;
  margin-bottom:18px;
  padding-bottom:12px;
  border-bottom:1px solid #73562d;
}
.portal-title span,.news-copy small,.news-list small{
  color:#77d7f6;
  font-size:.68rem;
  font-weight:bold;
  letter-spacing:.17em;
  text-transform:uppercase;
}
.portal-title h2{margin:3px 0 0;padding:0;border:0}
.portal-title > a{color:#d9bd75;font-size:.82rem}
.news-feature{
  display:grid;
  grid-template-columns:minmax(230px,.85fr) 1.15fr;
  min-height:260px;
  border:1px solid #4a5d64;
  background:#030910;
}
.news-art{
  position:relative;
  min-height:260px;
  background:
    linear-gradient(90deg,transparent 60%,#030910),
    linear-gradient(0deg,#03091022,#03091022),
    url("/assets/wotlk-citadel-hero-v2.png") 76% center/cover no-repeat;
}
.news-art span{
  position:absolute;
  left:14px;
  top:14px;
  padding:6px 9px;
  color:#061019;
  font-size:.65rem;
  font-weight:bold;
  letter-spacing:.12em;
  background:#83def8;
  box-shadow:0 0 14px #38bce9;
}
.news-copy{display:flex;flex-direction:column;justify-content:center;padding:28px}
.news-copy h3{margin:7px 0 8px;color:#ffe6a0;font-size:1.65rem}
.news-copy p{margin:0 0 14px;color:#b9cbd5}
.news-copy a,.news-list article > a{color:#f0c86c;font-weight:bold}
.news-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.news-list article{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:13px;
  padding:16px;
  border:1px solid #2e4c5e;
  background:linear-gradient(135deg,#06131f,#090806);
}
.news-list article > a{grid-column:2;font-size:.8rem}
.news-list h3{margin:4px 0;color:#e5d29c;font-size:1rem}
.news-list p{margin:0;color:#8fa6b4;font-size:.82rem;line-height:1.5}
.news-glyph{
  display:grid;
  place-items:center;
  width:39px;
  height:39px;
  color:#c7f5ff;
  border:1px solid #56b6d6;
  transform:rotate(45deg);
  background:#092031;
  box-shadow:0 0 12px #229bcf55;
}
.news-glyph::first-line{transform:rotate(-45deg)}
.realm-sidebar{display:flex;flex-direction:column;gap:14px}
.realm-stack{display:flex;flex-direction:column;gap:14px}
.realm-panel,.quick-panel,.realmlist-panel{padding:20px}
.realm-panel{text-align:center;background:linear-gradient(180deg,rgba(9,30,45,.98),rgba(12,8,6,.98))}
.realm-panel{position:relative;overflow:hidden}
.realm-panel::before{
  content:"";
  position:absolute;
  inset:-25px -55px auto;
  height:155px;
  opacity:.2;
  background:url("/assets/wotlk-crest-v1.png") center top/contain no-repeat;
  pointer-events:none;
}
.realm-panel > *{position:relative;z-index:1}
.realm-crown{
  padding:34px 10px 15px;
  color:#dff9ff;
  font-family:Georgia,serif;
  font-size:1.55rem;
  letter-spacing:.12em;
  background:
    radial-gradient(circle at center,#4dcaf244,transparent 48%),
    linear-gradient(135deg,transparent 46%,#74d4f322 47% 53%,transparent 54%);
  text-shadow:0 0 12px #34bce9;
}
.realm-panel h2{font-size:1.15rem;border:0;margin:0 0 8px;padding:0}
.realm-online{display:flex;justify-content:center;align-items:center;gap:8px;color:#8dffae;text-transform:uppercase;font-size:.8rem;letter-spacing:.1em}
.realm-online i{width:8px;height:8px;border-radius:50%;background:#63ff8f;box-shadow:0 0 10px #2cff67}
.realm-online.realm-offline{color:#ff8d8d}
.realm-online.realm-offline i{background:#ff6363;box-shadow:0 0 10px #ff2c2c}
.realm-panel dl{margin:17px 0 0}
.realm-panel dl div{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid #294353}
.realm-panel dt{color:#8da5b4}.realm-panel dd{margin:0;color:#f3d685;font-weight:bold}
.realm-panel-cata{
  border-color:#9a4f21;
  background:
    radial-gradient(circle at 50% -12%,rgba(255,116,31,.34),transparent 43%),
    linear-gradient(180deg,rgba(48,18,8,.99),rgba(13,12,10,.99) 58%,rgba(5,12,9,.99));
  box-shadow:inset 0 0 40px #000,0 9px 24px #000a,0 0 22px rgba(239,91,23,.18);
}
.realm-panel-cata::before{
  inset:0;
  height:auto;
  opacity:1;
  background:
    linear-gradient(115deg,transparent 0 45%,rgba(255,110,24,.08) 46% 47%,transparent 48%),
    radial-gradient(circle at 50% 0,rgba(255,151,55,.23),transparent 52%),
    radial-gradient(circle at 15% 88%,rgba(43,151,76,.14),transparent 34%);
}
.cata-crown{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding-top:27px;
  color:#ffb45d;
  background:
    radial-gradient(circle at center,rgba(255,102,24,.2),transparent 52%),
    linear-gradient(135deg,transparent 46%,rgba(255,148,51,.12) 47% 53%,transparent 54%);
  text-shadow:0 0 8px #ff6a1b,0 2px 4px #000;
}
.cata-crown small{
  display:block;
  color:#d6d0b7;
  font:700 .62rem "Trebuchet MS",sans-serif;
  letter-spacing:.3em;
}
.cata-crown span{display:block;margin-top:7px;letter-spacing:.16em}
.realm-panel-cata h2{color:#ffd18a;text-shadow:0 0 10px rgba(255,91,24,.5)}
.cata-tagline{margin:-2px 0 10px;color:#bb9b7a;font-size:.76rem;line-height:1.35}
.realm-panel-cata dl div{border-color:#523324}
.realm-panel-cata dd{color:#ffbd69}
.realm-panel-cata .realm-address small{color:#ef8e46}
.realm-panel-cata .realm-address code{border-color:#693c25;background:#0c0805;color:#ffd399}
.realm-download{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:39px;
  margin-top:12px;
  padding:8px 12px;
  color:#120803;
  font-weight:bold;
  border:1px solid #ffc16c;
  background:linear-gradient(180deg,#ffc16c,#d55a1e 58%,#6c210d);
  box-shadow:0 0 14px rgba(238,80,22,.22);
}
.realm-download:hover{color:#fff4dc;filter:brightness(1.12)}
.realm-address{margin-top:14px;text-align:left}
.realm-address small{display:block;color:#5fc8eb;letter-spacing:.16em}
.realm-address code{display:block;margin-top:7px;padding:9px;color:#ffe09a;background:#02070b;border:1px solid #304b5b;word-break:break-all;font-size:.78rem}
.quick-panel h3{margin:0 0 10px;color:#f5d98c}
.quick-panel a{display:flex;gap:12px;align-items:center;padding:12px 0;border-top:1px solid #263e4e;color:#dceaf1}
.quick-panel a b{color:#5ac9ed;font-family:Georgia,serif}
.quick-panel a span{font-weight:bold}.quick-panel a small{display:block;color:#77909f;font-weight:normal;margin-top:3px}
.realmlist-panel small{display:block;color:#5fc8eb;letter-spacing:.16em}
.realmlist-panel code{display:block;margin-top:8px;padding:10px;color:#ffe09a;background:#02070b;border:1px solid #304b5b;word-break:break-all}

.guild-hero{
  position:relative;
  margin:0 -24px 26px;
  padding:70px 24px 54px;
  text-align:center;
  overflow:hidden;
  border-bottom:1px solid #89652b;
  background:
    linear-gradient(90deg,rgba(8,36,66,.72),rgba(3,8,14,.35) 45%,rgba(40,7,6,.65)),
    url("/assets/wotlk-citadel-hero-v2.png") center 48%/cover no-repeat;
  box-shadow:inset 0 -80px 80px #030810,inset 0 0 80px #000;
}
.guild-hero::before,.guild-hero::after{
  content:"";
  position:absolute;
  top:20px;
  width:280px;
  height:150px;
  opacity:.55;
  background:url("/assets/wotlk-crest-v1.png") center/contain no-repeat;
  filter:drop-shadow(0 0 15px #40c7f0);
}
.guild-hero::before{left:-35px}.guild-hero::after{right:-35px;transform:scaleX(-1)}
.guild-hero > *{position:relative;z-index:1}
.guild-hero-kicker{color:#8ce4ff;font-weight:bold;letter-spacing:.2em;text-transform:uppercase}
.guild-hero h1{margin:8px 0;color:#ffe7a5;font-size:clamp(48px,7vw,78px);text-shadow:0 3px #061019,0 0 22px #34bce8}
.guild-hero p{max-width:720px;margin:0 auto;color:#d0e0e8}
.guild-totals{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:22px;color:#b9ccd6}
.guild-totals b{display:block;color:#ffe296;font-family:Georgia,serif;font-size:1.45rem}
.guild-totals i{width:1px;height:36px;background:linear-gradient(transparent,#73d6f6,transparent)}
.faction-columns{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.faction-column{padding:20px;border:1px solid #405a6b;background:linear-gradient(160deg,#071521f2,#0b0806f5);box-shadow:inset 0 0 35px #000,0 12px 30px #000a}
.faction-alliance{border-color:#416c98;box-shadow:inset 0 0 35px #000,0 0 25px #1d75bc24}
.faction-horde{border-color:#80402f;box-shadow:inset 0 0 35px #000,0 0 25px #b7302024}
.faction-header{display:flex;align-items:center;gap:16px;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid #526477}
.faction-header small{color:#91a8b7;text-transform:uppercase;letter-spacing:.14em}
.faction-header h2{margin:2px 0 0;padding:0;border:0}
.faction-sigil{display:grid;place-items:center;width:58px;height:58px;transform:rotate(45deg);font:700 25px Georgia;color:#fff;border:1px solid #8bcff0;background:#12365d;box-shadow:0 0 18px #2e9edf66}
.faction-sigil::first-line{transform:rotate(-45deg)}
.faction-horde .faction-sigil{border-color:#d07155;background:#5b1711;box-shadow:0 0 18px #d3453066}
.faction-horde .faction-header h2{color:#ffb08e}
.guild-card{margin-top:14px;padding:18px;border:1px solid #395568;background:linear-gradient(145deg,#06111bf2,#100b08f2);box-shadow:inset 0 0 25px #000}
.faction-horde .guild-card{border-color:#603c33}
.guild-card-head{display:flex;justify-content:space-between;align-items:start;gap:14px}
.guild-card-head small{color:#83cce7;text-transform:uppercase;letter-spacing:.1em;font-size:.68rem}
.guild-card h3{margin:4px 0;color:#ffe099;font-size:1.3rem}
.guild-online{padding:5px 8px;color:#84ffa6;border:1px solid #326144;background:#07150d;font-size:.72rem;white-space:nowrap}
.guild-motd{color:#d9c79b;font-style:italic}.guild-info{color:#9eb1bd}
.guild-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:15px 0;border:1px solid #304a5a}
.guild-stats span{padding:10px;text-align:center;color:#91a6b3;font-size:.75rem;border-right:1px solid #304a5a}
.guild-stats span:last-child{border:0}.guild-stats b{display:block;color:#f5d881;font-size:1.15rem}
.guild-roster{border:1px solid #294759;background:#02080d}
.guild-roster summary{padding:11px 13px;color:#80d9f7;font-weight:bold;cursor:pointer}
.guild-members{padding:0 12px 10px}
.guild-members > div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:8px 0;border-top:1px solid #243b49}
.guild-members i{width:7px;height:7px;border-radius:50%;background:#52636d}.guild-members i.member-online{background:#5dff86;box-shadow:0 0 8px #35ff66}
.guild-members span{color:#849aa7;font-size:.78rem}.guild-empty{padding:30px;text-align:center;color:#8da2ae;border:1px dashed #3b5260}

/* Compact guild directory */
.guild-page-title{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  margin:0 0 18px;
  padding:20px 4px 14px;
  border-bottom:1px solid #74572d;
}
.guild-page-title span{color:#78d7f7;font-size:.7rem;font-weight:bold;letter-spacing:.18em;text-transform:uppercase}
.guild-page-title h1{margin:4px 0 0;color:#ffe29a;font-size:2rem}
.guild-page-title p{margin:0;color:#95aab7}
.page-guilds .faction-columns{gap:16px}
.page-guilds .faction-column{padding:14px}
.page-guilds .faction-header{min-height:98px;margin:0 0 10px;padding:8px 12px 12px}
.faction-crest{width:80px;height:80px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(55,173,226,.4))}
.faction-horde .faction-crest{filter:drop-shadow(0 0 10px rgba(210,54,38,.45))}
.page-guilds .faction-header h2{font-size:1.45rem}
.page-guilds .faction-header span{color:#8198a6;font-size:.78rem}
.page-guilds .guild-card{margin-top:8px;padding:13px 14px}
.page-guilds .guild-card h3{margin:0 0 4px;font-size:1.05rem}
.page-guilds .guild-card-head small{color:#89a4b3;letter-spacing:0;text-transform:none}
.guild-level{color:#e7c66f;font-size:.78rem;white-space:nowrap}
.page-guilds .guild-roster{margin-top:11px}
.page-guilds .guild-members{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
.page-guilds .guild-members > div{grid-template-columns:auto 1fr auto}
.page-guilds .guild-hero,.page-guilds .guild-stats,.page-guilds .guild-motd,.page-guilds .guild-info,.page-guilds .faction-sigil{display:none}

.armory-search{display:flex;align-items:end;justify-content:space-between;gap:24px}
.armory-search h2{margin:4px 0 0}.armory-search form{display:flex;gap:8px;min-width:min(520px,100%)}
.armory-search input{margin:0}.armory-search button{margin:0;white-space:nowrap}
.armory-profile{border:1px solid #44677c;background:linear-gradient(145deg,#061521f5,#0d0907f8);box-shadow:inset 0 0 50px #000,0 15px 40px #000b}
.armory-header{display:flex;align-items:center;justify-content:space-between;padding:24px 28px;border-bottom:1px solid #74582e;background:linear-gradient(90deg,#0b2235,#090b0d 60%,#281607)}
.armory-header h1{margin:4px 0;color:#ffe5a1;font-size:2.5rem}.armory-header p{margin:0;color:#aec1cc}
.item-level{text-align:center;padding:12px 22px;border:1px solid #8d682d;background:#03090e}
.item-level small,.item-level span{display:block;color:#7f9dac;font-size:.67rem;letter-spacing:.12em}.item-level b{display:block;color:#f4d16e;font:700 2.25rem Georgia}
.armory-paperdoll{display:grid;grid-template-columns:minmax(250px,1fr) minmax(270px,.85fr) minmax(250px,1fr);gap:18px;padding:24px;background:radial-gradient(circle at center,#17557835,transparent 42%)}
.gear-column{display:flex;flex-direction:column;gap:7px}.gear-slot{display:flex;align-items:center;gap:10px;min-height:66px;padding:7px;border:1px solid #3b5667;background:#030a10e8}
.gear-slot img,.empty-icon{width:50px;height:50px;flex:0 0 50px;border:2px solid currentColor;border-radius:4px;background:#06101a}
.gear-slot small,.gear-slot span{display:block;color:#8198a6;font-size:.68rem}.gear-slot strong{display:block;margin:2px 0;color:inherit;font-size:.82rem;line-height:1.18}
.gear-slot.empty{color:#566975}.empty-icon{opacity:.35;background:linear-gradient(135deg,#132331,#050b10)}
.character-stage{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:610px;overflow:hidden;border:1px solid #4d6d7e;background:linear-gradient(180deg,#0a2538aa,#03080dbb),url("/assets/wotlk-citadel-hero-v2.png") 72% center/cover}
.character-stage::before{content:"";position:absolute;inset:8px;border:1px solid #b58a3d55}
.character-aura{position:absolute;width:240px;height:420px;border-radius:50%;background:radial-gradient(ellipse,#47caff44,transparent 66%);filter:blur(5px)}
.character-silhouette{position:relative;display:grid;place-items:center;width:170px;height:330px;clip-path:polygon(40% 0,60% 0,66% 12%,78% 20%,70% 42%,78% 63%,64% 100%,52% 80%,48% 80%,36% 100%,22% 63%,30% 42%,22% 20%,34% 12%);background:linear-gradient(90deg,#071018,#4d85a0 48%,#081018 52%);filter:drop-shadow(0 0 18px #40c8ff)}
.character-silhouette span{color:#dff9ff;font:700 58px Georgia;text-shadow:0 0 15px #45caff}
.character-stage h3{position:relative;margin:15px 0 2px;color:#ffe29b;font-size:1.5rem}.character-stage p{position:relative;margin:0;color:#a9bfcb}
.character-currencies{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:6px;width:85%;margin-top:15px}.character-currencies span{padding:7px;text-align:center;color:#8da5b3;background:#02080dbd;border:1px solid #2e4a5a;font-size:.72rem}.character-currencies b{display:block;color:#f1cf73}
.power-summary{padding:24px;border-top:1px solid #74582e}.power-title h2{margin:4px 0 16px}
.power-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.power-grid section{padding:15px;border:1px solid #375669;background:#030a10}.power-grid h3{margin:0 0 9px;color:#f1d17a}
.power-grid dl{margin:0}.power-grid dl div{display:flex;justify-content:space-between;padding:7px 0;border-top:1px solid #243c4b}.power-grid dt{color:#8ea5b3}.power-grid dd{margin:0;color:#e8f6fc;font-weight:bold}
.resistance-row{display:grid;grid-template-columns:repeat(6,1fr);margin-top:12px;border:1px solid #3a5565}.resistance-row span{padding:10px;text-align:center;color:#8ea6b4;border-right:1px solid #3a5565}.resistance-row span:last-child{border:0}.resistance-row b{display:block;color:#7fd9f6}
.stats-note{padding:11px 13px;color:#9db1bc;border-left:3px solid #4ebcde;background:#06121b}
.stats-note code{color:#f0d27c}.equipment-power{margin-top:12px}

@media(max-width:900px){
  .wrap{width:calc(100% - 14px);margin:7px auto;padding:0 12px 22px}
  nav{margin:0 -12px 18px;padding:0 6px}
  nav a{min-height:44px;padding:0 10px}
  .player-home{margin:0 -12px 18px}
  .logo{min-height:92px}
  .logo-main{font-size:42px}
  .hero{min-height:510px}
  .logo::before,.logo::after{display:none}
  .hero::before,.hero::after{display:none}
  .portal-layout{grid-template-columns:1fr;padding:8px 14px 4px}
  .news-feature{grid-template-columns:1fr}
  .news-art{min-height:220px}
  .news-list{grid-template-columns:1fr}
  .guild-hero{margin:0 -12px 22px}.guild-hero::before,.guild-hero::after{display:none}
  .faction-columns{grid-template-columns:1fr}.guild-stats{grid-template-columns:1fr}
  .guild-stats span{border-right:0;border-bottom:1px solid #304a5a}.guild-stats span:last-child{border-bottom:0}
  .guild-page-title{align-items:start;flex-direction:column}
  .page-guilds .guild-members{grid-template-columns:1fr}
  .armory-search{align-items:stretch;flex-direction:column}.armory-search form{min-width:0;width:100%}
  .armory-paperdoll{grid-template-columns:1fr}.character-stage{grid-row:1;min-height:460px}.gear-left,.gear-right{grid-row:auto}
  .power-grid{grid-template-columns:1fr 1fr}.resistance-row{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:600px){.armory-search form{flex-direction:column}.power-grid{grid-template-columns:1fr}.resistance-row{grid-template-columns:1fr 1fr}.armory-header{align-items:flex-start;flex-direction:column}}

/* Braided gold cord frame */
.wrap{
  border:7px solid transparent;
  border-image-source:url("/assets/gold-braided-cord-v1.jpg");
  border-image-slice:34;
  border-image-repeat:round;
  border-radius:3px;
  box-shadow:
    0 0 0 1px #211304,
    0 0 0 3px #02060b,
    0 0 22px rgba(220,164,55,.2),
    0 24px 80px #000,
    inset 0 0 28px rgba(230,175,66,.08);
  animation:goldCordGlow 7s ease-in-out infinite;
}
.armory-profile{
  border:5px solid transparent;
  border-image-source:url("/assets/gold-braided-cord-v1.jpg");
  border-image-slice:34;
  border-image-repeat:round;
  box-shadow:inset 0 0 50px #000,0 0 18px #d99a2d24,0 15px 40px #000b;
}
@keyframes goldCordGlow{
  0%,100%{filter:drop-shadow(0 0 2px rgba(255,214,116,.18))}
  50%{filter:drop-shadow(0 0 7px rgba(255,194,63,.34))}
}
@media(max-width:900px){
  .wrap{border-width:4px}
  .armory-profile{border-width:3px}
}
@media(prefers-reduced-motion:reduce){
  .wrap,.logo-main{animation:none}
}

/* Shared SPAINLIVE identity used by the website and game login. */
.brand-logo{
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 7px 12px rgba(0,0,0,.88));
}
.brand-logo-header{
  width:min(440px,82vw);
  margin:0 auto;
}
.hero-brand{
  width:min(760px,92%);
  margin:0 auto 8px;
  line-height:0;
}
.hero-content{
  width:100%;
  min-width:0;
}
.hero{
  grid-template-columns:minmax(0,1fr);
  overflow:hidden;
}
.brand-logo-hero{max-height:390px}
@media(max-width:900px){
  .logo{padding:16px 8px 12px}
  .brand-logo-header{width:min(340px,88vw)}
  .hero-brand{width:min(620px,96%)}
}
@media(max-width:520px){
  .brand-logo-header{width:min(280px,92vw)}
  .hero-brand{width:100%}
}

/* WotLK class guide library */
.guide-library{margin:0 0 24px}
.guide-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:32px;border:1px solid #725628;background:linear-gradient(100deg,#081b2bf2,#05080df5 60%,#251306e8),url("/assets/wotlk-citadel-hero-v2.png") center 48%/cover;box-shadow:inset 0 0 70px #000,0 15px 45px #000b}
.guide-hero h1{margin:5px 0;color:#ffe29a;font:700 clamp(2rem,4vw,3.3rem) Georgia;text-shadow:0 2px 5px #000,0 0 18px #ca862d88}
.guide-hero p{max-width:760px;margin:0;color:#bad0dc}
.guide-count{display:grid;grid-template-columns:auto auto;align-items:center;gap:2px 10px;min-width:185px;padding:15px 20px;border:1px solid #765a2d;background:#02080dcc}
.guide-count b{color:#f4cf71;font:700 1.7rem Georgia}.guide-count span{color:#8da6b4;text-transform:uppercase;font-size:.7rem;letter-spacing:.1em}
.guide-tools{display:grid;grid-template-columns:1fr 190px 150px auto auto;gap:10px;margin:18px 0}.guide-tools input,.guide-tools select,.guide-tools button{margin:0}
.guide-help{margin:-5px 0 16px;padding:10px 13px;color:#b8cbd5;border-left:3px solid #d3a347;background:#07121a;font-size:.85rem}
.guide-reference,.community-guides{margin:14px 0;border:1px solid #506a79;background:#030a10}
.guide-reference>summary,.community-guides>summary{padding:15px 18px;color:#f1d078;font-weight:bold;cursor:pointer;background:linear-gradient(90deg,#132638,#100b07)}
.guide-reference-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;padding:1px;background:#263e4d}.guide-reference-grid section{padding:16px;background:#040b11}.guide-reference-grid h3{margin:0 0 7px;color:#78d8f6}.guide-reference-grid p{margin:0;color:#acbec8;font-size:.87rem}
.faction-guide-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}.faction-mini{border:1px solid #3c6f9c;background:#061420}.faction-mini.horde{border-color:#864332;background:#1a0907}.faction-mini summary{display:flex;align-items:center;gap:12px;padding:11px 15px;color:#ffe09a;font-weight:bold;cursor:pointer}.faction-mini img{width:42px;height:42px;object-fit:contain}.faction-mini p{margin:0;padding:0 16px 15px;color:#aabfc9;font-size:.86rem}
.class-index{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;margin:18px 0;padding:8px;border:1px solid #394f5d;background:#02070b}
.class-index a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:9px 4px;color:#aabdc8;text-align:center;font-size:.68rem}.class-index a:hover{color:#ffe09a;background:#10202b}.class-index img{width:42px;height:42px;border:2px solid #6c552d;border-radius:50%;box-shadow:0 0 12px #000}
.class-guide{margin:9px 0;border:1px solid #415e70;background:linear-gradient(145deg,#06131e,#090705);box-shadow:inset 0 0 28px #000}
.class-guide>summary{display:flex;align-items:center;gap:15px;padding:12px 16px;cursor:pointer;list-style:none}.class-guide>summary::-webkit-details-marker,.spec-guide>summary::-webkit-details-marker{display:none}
.class-guide>summary::after{content:"+";margin-left:auto;color:#e9c66b;font:700 1.5rem Georgia}.class-guide[open]>summary::after{content:"−"}
.class-guide>summary img{width:58px;height:58px;border:2px solid #957237;border-radius:50%;box-shadow:0 0 15px #1ba0db44}.class-guide>summary span{display:grid}.class-guide>summary small{color:#6fcbea;font-size:.62rem;letter-spacing:.16em}.class-guide>summary b{color:#f6d783;font:700 1.4rem Georgia}.class-guide>summary em{color:#8199a6;font-size:.72rem;font-style:normal}
.class-guide-body{padding:0 15px 16px;border-top:1px solid #334d5d}.race-recommendations{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}.race-recommendations p{margin:0;padding:11px 13px;color:#aabfc9;border-left:3px solid #438cc5;background:#06121b;font-size:.82rem}.race-recommendations p.horde{border-color:#a14331;background:#170a08}.race-recommendations b{display:block;margin-bottom:2px;color:#f2d37c}
.spec-guide{margin:8px 0;border:1px solid #2d4c5d;background:#02080d}.spec-guide>summary{padding:12px 15px;cursor:pointer;list-style:none}.spec-guide>summary span{display:flex;align-items:center;justify-content:space-between;gap:12px}.spec-guide>summary b{color:#8be3ff}.spec-guide>summary small{color:#d4bd7e}.spec-guide>summary::after{content:"Abrir guía";float:right;margin-top:-18px;color:#698391;font-size:.65rem;text-transform:uppercase;letter-spacing:.1em}.spec-guide[open]>summary::after{content:"Cerrar"}
.talent-visual{display:grid;grid-template-columns:minmax(320px,1.35fr) 1fr;align-items:center;gap:18px;padding:16px;border-top:1px solid #294756;background:radial-gradient(circle at 25% 50%,#153e5640,transparent 45%),#03090e}.talent-visual img{display:block;width:100%;height:auto;border:1px solid #80622e;box-shadow:0 0 18px #000}.talent-visual h3{margin:4px 0 8px;color:#f3cf74;font-size:1.55rem}.talent-visual p{margin:0;color:#aabec8;font-size:.86rem}
.spec-guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;padding:1px;background:#263e4c}.spec-guide-grid section{padding:14px;background:#050c12}.spec-guide-grid section.wide{grid-column:span 3}.spec-guide-grid h4{margin:0 0 7px;color:#e7c46b;font-family:Georgia,serif}.spec-guide-grid p{margin:0;color:#afc1ca;font-size:.86rem;line-height:1.55}
.beginner-guide{border-left:3px solid #55c9ed}.beginner-guide ol,.rotation-steps ol{margin:8px 0 0;padding-left:22px}.beginner-guide li,.rotation-steps li{margin:7px 0;color:#bdd0d9;line-height:1.5}.beginner-guide li::marker,.rotation-steps li::marker{color:#e9c66c;font-weight:bold}.rotation-steps{background:linear-gradient(90deg,#071722,#080b0d)!important}.guide-note{margin-top:12px!important;padding:9px 11px;color:#92acb9!important;border-left:2px solid #b78532;background:#02070b}.video-guide{display:flex;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(90deg,#180807,#07131d)!important;border-top:1px solid #713126}.video-guide>div{display:flex;align-items:center;gap:14px}.video-guide h4{margin-bottom:3px}.video-play{display:grid;place-items:center;width:48px;height:48px;flex:0 0 48px;color:#fff;border-radius:50%;background:#c72b22;box-shadow:0 0 18px #c72b2266}.video-guide .button{flex:0 0 auto}
.guide-empty{padding:24px;text-align:center;border:1px dashed #526875;color:#9db2be}.community-guide-body{padding:16px}.community-guide-form textarea{min-height:150px}.community-guide-entry{margin-top:12px;padding:16px;border:1px solid #314c5b;background:#03090e}.community-guide-entry h3{margin-top:0}.community-guide-entry>p{color:#839ba8;font-size:.78rem}
.class-guide[hidden],.spec-guide[hidden]{display:none}
@media(max-width:1100px){.guide-tools{grid-template-columns:1fr 1fr 1fr}.guide-tools input{grid-column:span 3}.class-index{grid-template-columns:repeat(5,1fr)}.spec-guide-grid{grid-template-columns:1fr 1fr}.spec-guide-grid section.wide{grid-column:span 2}}
@media(max-width:700px){.guide-hero{align-items:flex-start;flex-direction:column;padding:22px}.guide-count{width:100%}.guide-tools,.faction-guide-row,.guide-reference-grid,.race-recommendations,.talent-visual{grid-template-columns:1fr}.guide-tools input{grid-column:auto}.class-index{grid-template-columns:repeat(2,1fr)}.class-index a{flex-direction:row;text-align:left}.spec-guide-grid{grid-template-columns:1fr}.spec-guide-grid section.wide{grid-column:auto}.spec-guide>summary span{align-items:flex-start;flex-direction:column}.spec-guide>summary::after{float:none;display:block;margin:5px 0 0}.video-guide{align-items:stretch;flex-direction:column}.video-guide .button{width:100%}}

/* 2026 dual-expansion landing page */
.page-inicio{
  background:#02070b;
}
.page-inicio::before{
  content:"";
  position:fixed;
  z-index:-2;
  inset:-28px;
  background:
    linear-gradient(180deg,rgba(1,6,11,.16),rgba(1,5,9,.9) 78%),
    url("/assets/dual-expansion-hero-v1.png") center top/cover no-repeat;
  filter:blur(18px) saturate(1.08);
  transform:scale(1.05);
}
.page-inicio .player-home{
  position:relative;
  margin:0 -20px 28px;
  overflow:hidden;
  border-bottom:1px solid rgba(229,183,86,.42);
  background:#03090e;
}
.page-inicio .hero{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:690px;
  padding:72px 28px 116px;
  isolation:isolate;
  background:
    radial-gradient(circle at 50% 46%,rgba(3,10,16,.15),rgba(2,7,11,.7) 53%,rgba(1,4,7,.96) 100%),
    linear-gradient(90deg,rgba(3,18,31,.08),rgba(2,7,12,.3) 48%,rgba(34,12,3,.1)),
    url("/assets/dual-expansion-hero-v1.png") center/cover no-repeat;
}
.page-inicio .hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg,rgba(0,0,0,.08),transparent 35%,rgba(1,5,8,.9));
  pointer-events:none;
}
.page-inicio .hero::after{
  content:"";
  position:absolute;
  inset:16px;
  z-index:-1;
  border:1px solid rgba(229,188,94,.3);
  box-shadow:inset 0 0 55px rgba(0,0,0,.72);
  pointer-events:none;
}
.page-inicio .hero-content{
  width:min(920px,calc(100% - 30px));
  padding:38px clamp(24px,5vw,58px) 42px;
  text-align:center;
  border:1px solid rgba(226,188,105,.42);
  border-radius:3px;
  background:linear-gradient(145deg,rgba(2,13,22,.8),rgba(3,8,12,.74) 52%,rgba(24,10,3,.76));
  box-shadow:0 28px 85px rgba(0,0,0,.58),inset 0 0 45px rgba(14,64,92,.12);
  backdrop-filter:blur(12px);
}
.page-inicio .hero-kicker{
  color:#b8dff0;
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.31em;
  text-shadow:0 2px 8px #000;
}
.page-inicio .dual-hero-title{
  margin:14px 0 22px;
}
.page-inicio .dual-hero-title span{
  display:block;
  color:#d9f3ff;
  font:600 clamp(1rem,2vw,1.3rem) Georgia,serif;
  letter-spacing:.35em;
  text-shadow:0 0 18px rgba(77,195,241,.6);
}
.page-inicio .dual-hero-title small{
  display:block;
  margin-top:4px;
  color:#ffe4a0;
  font:700 clamp(3rem,7vw,5.6rem)/.96 Georgia,serif;
  letter-spacing:.04em;
  text-shadow:0 3px 5px #000,0 0 26px rgba(215,153,49,.42);
}
.page-inicio .dual-realms{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:0 auto 20px;
  border:0;
  background:none;
  box-shadow:none;
}
.page-inicio .dual-divider{display:none}
.page-inicio .dual-realm{
  position:relative;
  padding:14px 18px;
  overflow:hidden;
  text-align:left;
  border:1px solid rgba(131,174,194,.45);
  background:linear-gradient(110deg,rgba(5,35,54,.88),rgba(2,9,14,.7));
}
.page-inicio .dual-realm::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:#5ed1ff;
  box-shadow:0 0 16px #5ed1ff;
}
.page-inicio .dual-realm-cata{
  border-color:rgba(190,116,64,.5);
  background:linear-gradient(110deg,rgba(31,11,4,.76),rgba(66,26,5,.82));
}
.page-inicio .dual-realm-cata::before{
  background:#e48535;
  box-shadow:0 0 16px #e48535;
}
.page-inicio .dual-realm span,
.page-inicio .dual-realm strong,
.page-inicio .dual-realm small{display:block}
.page-inicio .dual-realm span{
  color:#accbd9;
  font-size:.62rem;
  font-weight:700;
  letter-spacing:.15em;
}
.page-inicio .dual-realm strong{
  margin:3px 0;
  color:#ffe1a0;
  font:700 1.35rem Georgia,serif;
}
.page-inicio .dual-realm small{color:#91aab6}
.page-inicio .hero-lead{
  max-width:750px;
  margin:0 auto 24px;
  color:#c0d0d7;
  line-height:1.7;
}
.page-inicio .hero-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:9px;
}
.page-inicio .hero-actions .button{
  min-height:43px;
  margin:0;
  padding:12px 17px;
  border-color:#775a2b;
  background:linear-gradient(#3a2a13,#171006);
  box-shadow:inset 0 1px rgba(255,255,255,.1),0 7px 18px rgba(0,0,0,.32);
}
.page-inicio .hero-actions .wotlk-action{
  border-color:#4f9fc3;
  background:linear-gradient(#164866,#082235);
}
.page-inicio .hero-actions .cata-action{
  border-color:#bc7134;
  background:linear-gradient(#713810,#301404);
}
.page-inicio .dual-server-strip{
  position:relative;
  z-index:3;
  width:min(1120px,calc(100% - 48px));
  margin:-82px auto 28px;
  border:1px solid rgba(218,178,91,.48);
  border-radius:3px;
  background:rgba(2,10,15,.92);
  box-shadow:0 18px 48px rgba(0,0,0,.55),inset 0 0 30px rgba(20,80,107,.1);
  backdrop-filter:blur(10px);
}
.page-inicio .dual-server-strip .server-stat{
  min-height:80px;
  border-color:rgba(93,130,147,.32);
}
.page-inicio .dual-server-strip .wotlk-label b{color:#80dcff}
.page-inicio .dual-server-strip .cata-label b{color:#ef9a4c}
@media(max-width:900px){
  .page-inicio .player-home{margin:0 -12px 24px}
  .page-inicio .hero{min-height:660px;padding:55px 16px 110px}
  .page-inicio .hero::after{inset:8px}
  .page-inicio .hero-content{width:min(760px,calc(100% - 12px))}
  .page-inicio .dual-server-strip{width:calc(100% - 24px)}
}
@media(max-width:650px){
  .page-inicio .hero{
    min-height:760px;
    padding:34px 9px 120px;
    background-position:48% center;
  }
  .page-inicio .hero-content{padding:27px 16px 31px}
  .page-inicio .hero-kicker{letter-spacing:.16em}
  .page-inicio .dual-hero-title small{font-size:clamp(2.5rem,13vw,4rem)}
  .page-inicio .dual-realms{grid-template-columns:1fr}
  .page-inicio .hero-actions .button{width:100%}
  .page-inicio .dual-server-strip{
    grid-template-columns:1fr 1fr;
    margin-top:-92px;
  }
  .page-inicio .dual-server-strip .server-stat{min-height:68px}
}

/* SPAINLIVE full visual redesign */
:root{
  --sl-bg:#05080b;
  --sl-surface:#0b1015;
  --sl-surface-2:#10161d;
  --sl-line:rgba(255,255,255,.12);
  --sl-copy:#f3f0e8;
  --sl-muted:#9aa4ad;
  --sl-ice:#67c9ec;
  --sl-fire:#e57c32;
  --sl-gold:#d5ac61;
}
body{
  color:var(--sl-copy);
  background:
    radial-gradient(circle at 18% 0,rgba(33,105,139,.14),transparent 30%),
    radial-gradient(circle at 82% 0,rgba(131,57,17,.13),transparent 30%),
    var(--sl-bg);
}
body::before,body::after{display:none}
.wrap{
  width:100%;
  max-width:none;
  margin:0;
  padding:0 0 70px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  filter:none;
  animation:none;
}
.wrap::before,.wrap::after{display:none}
.site-header{
  position:sticky;
  z-index:100;
  top:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:76px;
  padding:0 clamp(20px,4vw,72px);
  border-bottom:1px solid rgba(255,255,255,.1);
  background:rgba(5,8,11,.88);
  box-shadow:0 10px 35px rgba(0,0,0,.28);
  backdrop-filter:blur(18px);
}
.site-brand{
  display:grid;
  grid-template-columns:auto auto;
  align-items:end;
  color:#f4f1e9;
  font:700 1.45rem/1 "Cinzel",Georgia,serif;
  letter-spacing:.05em;
}
.site-brand span{font-weight:400}
.site-brand b{color:var(--sl-gold)}
.site-brand small{
  grid-column:1/3;
  margin-top:4px;
  color:#7d8993;
  font:700 .48rem/1 Arial,sans-serif;
  letter-spacing:.27em;
}
.site-brand:hover{color:#fff}
.site-brand-logo{display:block;width:auto;height:64px;object-fit:contain}
@media(max-width:760px){.site-brand-logo{height:52px}}
.site-nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:2px;
  margin:0;
  padding:0;
  border:0;
  background:none;
  box-shadow:none;
}
.site-nav>a,.site-nav-more>summary{
  min-height:auto;
  margin:0;
  padding:11px 13px;
  color:#aeb7be;
  border:0;
  border-radius:2px;
  background:none;
  box-shadow:none;
  font:700 .7rem/1 Arial,sans-serif;
  letter-spacing:.06em;
  text-shadow:none;
  text-transform:uppercase;
  cursor:pointer;
  transition:color .2s ease,background .2s ease;
}
.site-nav>a:hover,.site-nav-more>summary:hover{
  color:#fff;
  background:rgba(255,255,255,.06);
  box-shadow:none;
  transform:none;
}
.site-nav .site-login{color:#e8d3a8;border-left:1px solid var(--sl-line);margin-left:8px}
.site-nav .site-register,.site-nav .site-account{
  margin-left:5px;
  color:#090b0e;
  background:var(--sl-gold);
}
.site-nav .site-register:hover,.site-nav .site-account:hover{color:#090b0e;background:#efd28e}
.site-nav .site-logout{color:#a77777}
.site-nav-more{position:relative}
.site-nav-more>summary{list-style:none}
.site-nav-more>summary::-webkit-details-marker{display:none}
.site-nav-more[open]>div{
  position:absolute;
  top:44px;
  right:0;
  display:grid;
  width:210px;
  padding:8px;
  border:1px solid var(--sl-line);
  background:#0a0f14;
  box-shadow:0 18px 45px rgba(0,0,0,.55);
}
.site-nav-more div a{padding:10px 12px;color:#aeb7be;font-size:.76rem}
.site-nav-more div a:hover{color:#fff;background:rgba(255,255,255,.06)}

.page-inicio{background:var(--sl-bg)}
.page-inicio .wrap{padding-bottom:0}
.sl-home{overflow:hidden}
.sl-hero{
  position:relative;
  min-height:calc(100vh - 76px);
  display:flex;
  align-items:center;
  padding:90px clamp(24px,8vw,140px) 130px;
  isolation:isolate;
  background:url("/assets/dual-expansion-hero-v1.png") center/cover no-repeat;
}
.sl-hero::before{
  content:"";
  position:absolute;
  z-index:-2;
  inset:0;
  background:
    linear-gradient(90deg,rgba(2,7,11,.35),rgba(3,7,10,.1) 46%,rgba(8,5,3,.12)),
    linear-gradient(180deg,rgba(1,4,7,.08),rgba(5,8,11,.12) 60%,var(--sl-bg));
}
.sl-hero-shade{
  position:absolute;
  z-index:-1;
  inset:0;
  background:radial-gradient(ellipse at 34% 47%,rgba(5,10,14,.05),rgba(4,8,11,.64) 65%,rgba(4,7,10,.82));
}
.sl-hero-copy{width:min(760px,100%)}
.sl-eyebrow,.sl-section-heading>span{
  display:block;
  margin-bottom:16px;
  color:var(--sl-gold);
  font:700 .67rem/1 Arial,sans-serif;
  letter-spacing:.28em;
}
.sl-hero h1{
  margin:0;
  color:#f6f3eb;
  font:400 clamp(3.4rem,7.2vw,7.2rem)/.92 Georgia,serif;
  letter-spacing:-.055em;
  text-shadow:0 5px 30px rgba(0,0,0,.58);
}
.sl-hero h1 em{color:#b8d9e6;font-weight:400}
.sl-hero-copy>p{
  max-width:620px;
  margin:28px 0 0;
  color:#c5ccd0;
  font-size:1.06rem;
  line-height:1.7;
}
.sl-hero-actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:35px}
.sl-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 22px;
  color:#f6f1e7;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(8,12,16,.48);
  font:700 .7rem/1 Arial,sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
  transition:.2s ease;
}
.sl-button:hover{color:#fff;border-color:rgba(255,255,255,.5);transform:translateY(-2px)}
.sl-button-main{color:#11100d;border-color:var(--sl-gold);background:var(--sl-gold)}
.sl-button-main:hover{color:#11100d;background:#efd28e}
.sl-button-ghost{backdrop-filter:blur(10px)}
.sl-livebar{
  position:absolute;
  right:clamp(24px,6vw,100px);
  bottom:33px;
  left:clamp(24px,6vw,100px);
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:18px 24px;
  color:#9da8b0;
  border-top:1px solid rgba(255,255,255,.18);
  border-bottom:1px solid rgba(255,255,255,.08);
  background:rgba(5,9,12,.52);
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  backdrop-filter:blur(13px);
}
.sl-livebar span:last-child{text-align:right}
.sl-livebar strong{color:#e8e4dc;font-weight:400}
.sl-livebar i{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%}
.sl-livebar .is-online{background:#57db8b;box-shadow:0 0 12px #57db8b}
.sl-livebar .is-offline{background:#d75d5d}
.sl-section{
  width:min(1240px,calc(100% - 48px));
  margin:0 auto;
  padding:115px 0;
}
.sl-section-heading{max-width:680px;margin-bottom:48px}
.sl-section-heading h2,.sl-manifesto h2,.sl-community h2{
  margin:0;
  padding:0;
  color:#f2eee5;
  border:0;
  font:400 clamp(2.5rem,5vw,4.8rem)/1 Georgia,serif;
  letter-spacing:-.035em;
  text-shadow:none;
}
.sl-section-heading p{margin:19px 0 0;color:var(--sl-muted)}
.sl-realm-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.sl-realm-card{
  position:relative;
  min-width:0;
  overflow:hidden;
  border:1px solid var(--sl-line);
  background:var(--sl-surface);
  box-shadow:0 25px 70px rgba(0,0,0,.24);
}
.sl-realm-art{height:310px;background-image:url("/assets/dual-expansion-hero-v1.png");background-repeat:no-repeat;background-size:200% 100%}
.sl-realm-wotlk .sl-realm-art{background-position:left center}
.sl-realm-cata .sl-realm-art{background-position:right center}
.sl-realm-body{padding:34px}
.sl-realm-top{display:flex;align-items:center;justify-content:space-between;gap:15px}
.sl-realm-top span{color:#8d9ba5;font-size:.64rem;font-weight:700;letter-spacing:.18em}
.sl-realm-top b{font-size:.57rem;letter-spacing:.12em}
.sl-realm-top .is-live{color:#69dda0}.sl-realm-top .is-down{color:#df7777}
.sl-realm-card h3{
  margin:18px 0 12px;
  color:#f4f0e7;
  font:400 2.25rem/1 Georgia,serif;
  text-shadow:none;
}
.sl-realm-card p{min-height:78px;margin:0;color:var(--sl-muted)}
.sl-realm-card dl{display:grid;grid-template-columns:repeat(3,1fr);margin:30px 0;border-top:1px solid var(--sl-line);border-bottom:1px solid var(--sl-line)}
.sl-realm-card dl div{padding:15px 8px;border-right:1px solid var(--sl-line)}
.sl-realm-card dl div:last-child{border:0}
.sl-realm-card dt{color:#737f88;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase}
.sl-realm-card dd{margin:6px 0 0;color:#e8e2d8}
.sl-realm-actions{display:flex;align-items:center;gap:22px}
.sl-realm-actions>a:last-child{color:#abb6bd;font-size:.75rem;border-bottom:1px solid #53606a}
.sl-button-ice{color:#071116;border-color:#70cae8;background:#70cae8}
.sl-button-fire{color:#160a03;border-color:#e07b35;background:#e07b35}
.sl-manifesto{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:clamp(60px,10vw,150px);
  align-items:center;
  padding:130px max(24px,calc((100% - 1240px)/2));
  background:
    linear-gradient(90deg,rgba(8,13,17,.98),rgba(10,15,19,.86)),
    url("/assets/dual-expansion-hero-v1.png") center/cover fixed;
}
.sl-manifesto-copy>p{margin:27px 0;color:#aab3ba}
.sl-text-link{display:inline-block;margin-top:12px;color:var(--sl-gold);border-bottom:1px solid #7d6537;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}
.sl-feature-list{border-top:1px solid var(--sl-line)}
.sl-feature-list article{display:grid;grid-template-columns:50px 1fr;gap:20px;padding:24px 0;border-bottom:1px solid var(--sl-line)}
.sl-feature-list article>b{color:#59656e;font:400 1rem Georgia,serif}
.sl-feature-list h3{margin:0 0 5px;color:#eee9df;font:400 1.35rem Georgia,serif;text-shadow:none}
.sl-feature-list p{margin:0;color:#929da5;font-size:.88rem;line-height:1.55}
.sl-start{padding-bottom:130px}
.sl-step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--sl-line)}
.sl-step-grid article{padding:34px;background:var(--sl-surface)}
.sl-step-grid article>b{color:#53606a;font:400 2.3rem Georgia,serif}
.sl-step-grid h3{margin:27px 0 9px;color:#eee9df;font:400 1.55rem Georgia,serif;text-shadow:none}
.sl-step-grid p{min-height:60px;color:#929da5;font-size:.88rem}
.sl-step-grid a{color:var(--sl-gold);font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.sl-community{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  padding:85px max(24px,calc((100% - 1240px)/2));
  background:#10161b;
  border-top:1px solid var(--sl-line);
}
.sl-community p{margin:15px 0 0;color:#929da5}

body:not(.page-inicio) .wrap{width:min(1280px,calc(100% - 30px));margin:0 auto;padding-bottom:50px}
body:not(.page-inicio) .site-header{margin:0 calc((100vw - min(1280px,calc(100vw - 30px)))/-2) 28px}
body:not(.page-inicio) .card{border-color:var(--sl-line);border-radius:0;background:var(--sl-surface);box-shadow:0 20px 50px rgba(0,0,0,.3)}

@media(max-width:1050px){
  .site-header{align-items:flex-start;flex-direction:column;padding-top:16px;padding-bottom:12px}
  .site-nav{justify-content:flex-start;margin-top:10px}
  .sl-hero{min-height:760px}
  .sl-manifesto{grid-template-columns:1fr;gap:60px}
}
@media(max-width:760px){
  .site-header{position:relative;padding:15px 18px}
  .site-nav{gap:0}
  .site-nav>a,.site-nav-more>summary{padding:9px 8px;font-size:.62rem}
  .site-nav .site-login{margin-left:0;border:0}
  .sl-hero{min-height:720px;padding:70px 24px 140px;background-position:48% center}
  .sl-hero h1{font-size:clamp(3rem,15vw,5rem)}
  .sl-livebar{right:16px;bottom:20px;left:16px;grid-template-columns:1fr 1fr;gap:9px;padding:14px}
  .sl-livebar strong{grid-column:1/3;grid-row:2;text-align:center}
  .sl-realm-grid,.sl-step-grid{grid-template-columns:1fr}
  .sl-section{width:min(100% - 30px,1240px);padding:80px 0}
  .sl-realm-art{height:240px}
  .sl-realm-body{padding:25px}
  .sl-realm-card p{min-height:0}
  .sl-realm-actions{align-items:stretch;flex-direction:column;gap:14px}
  .sl-manifesto{padding:90px 24px;background-attachment:scroll}
  .sl-step-grid article{padding:28px}
  .sl-step-grid p{min-height:0}
  .sl-community{align-items:flex-start;flex-direction:column;padding:65px 24px}
}

/* Epic fantasy MMORPG visual pass */
body{
  background:
    radial-gradient(circle at 50% -10%,rgba(49,104,131,.2),transparent 34%),
    linear-gradient(rgba(2,5,8,.88),rgba(2,5,8,.96)),
    url("/assets/spainlive-fantasy-frame-v2.png") center top/cover fixed,
    #020407;
}
.site-header{
  min-height:84px;
  border-bottom:3px ridge #745527;
  background:
    linear-gradient(180deg,rgba(31,38,43,.98),rgba(5,9,13,.98) 58%,rgba(18,11,6,.98)),
    repeating-linear-gradient(90deg,transparent 0 18px,rgba(255,255,255,.02) 19px 20px);
  box-shadow:inset 0 -1px #d8a84e55,inset 0 1px #8ce5ff22,0 8px 30px #000;
}
.site-header::before,.site-header::after{
  content:"";
  position:absolute;
  bottom:-7px;
  width:34%;
  height:8px;
  background:linear-gradient(90deg,transparent,#9c7132,#e2bd69,#9c7132);
  clip-path:polygon(0 35%,94% 35%,100% 100%,4% 100%);
}
.site-header::before{left:0}
.site-header::after{right:0;transform:scaleX(-1)}
.site-brand{
  position:relative;
  padding:8px 30px;
  font-family:"Cinzel Decorative","Cinzel",Georgia,serif;
  font-size:1.7rem;
  text-shadow:0 2px 0 #000,0 0 12px #ca923c66;
}
.site-brand::before,.site-brand::after{
  content:"◆";
  position:absolute;
  top:17px;
  color:#ba8a3e;
  font-size:.65rem;
  text-shadow:0 0 8px #58cfff;
}
.site-brand::before{left:8px}.site-brand::after{right:8px}
.site-brand span{
  color:#e7edf0;
  -webkit-text-stroke:.3px #67889a;
}
.site-brand b{
  color:#f4ce79;
  background:linear-gradient(#fff6c8,#c89135 48%,#fff0a6 55%,#7e4e17 90%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  -webkit-text-stroke:.4px #f5dda0;
}
.site-nav>a,.site-nav-more>summary{
  font-family:"Cinzel",Georgia,serif;
  letter-spacing:.04em;
}
.site-nav>a:hover,.site-nav-more>summary:hover{
  color:#fff2bf;
  background:linear-gradient(180deg,rgba(99,76,36,.35),rgba(18,24,29,.45));
  box-shadow:inset 0 0 0 1px #b78a4455,0 0 12px #54c8ff22;
}
.site-nav .site-register,.site-nav .site-account{
  color:#fff2bf;
  border:1px solid #b8883b;
  background:linear-gradient(180deg,#6e4d1c,#2c1908 58%,#130a04);
  box-shadow:inset 0 1px #ffe3a066,0 0 12px #b8792622;
}
.site-nav .site-register:hover,.site-nav .site-account:hover{color:white;background:linear-gradient(#8b6225,#3b2109)}
.sl-hero{
  min-height:calc(100vh - 84px);
  justify-content:center;
  padding:120px clamp(20px,6vw,100px) 150px;
  text-align:center;
  background:url("/assets/spainlive-fantasy-frame-v2.png") center/cover no-repeat;
  box-shadow:inset 0 -50px 70px #020407;
}
.sl-hero::before{
  background:
    radial-gradient(ellipse at center,rgba(1,4,7,.02),rgba(1,4,7,.2) 42%,rgba(1,4,7,.45) 75%),
    linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.08) 70%,#020407);
}
.sl-hero-shade{background:radial-gradient(ellipse at center,transparent 0,rgba(1,4,7,.06) 38%,rgba(1,4,7,.38) 80%)}
.sl-hero-copy{
  width:min(780px,60vw);
  margin-top:5px;
  padding:45px 55px 38px;
}
.sl-eyebrow{
  color:#b8d7e5;
  font-family:"Cinzel",Georgia,serif;
  letter-spacing:.28em;
  text-shadow:0 2px 4px #000,0 0 12px #35bce977;
}
.sl-wow-title{margin:0!important;line-height:1!important}
.sl-wow-title span{
  display:block;
  color:#f5d780;
  font:700 clamp(3.5rem,7.2vw,7rem)/.9 "Cinzel Decorative","Cinzel",Georgia,serif;
  letter-spacing:.035em;
  background:linear-gradient(180deg,#fff9ce 2%,#edcc6f 25%,#9b641e 47%,#fff0a2 54%,#a26820 72%,#4c2a0a 93%);
  background-size:100% 145%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  -webkit-text-stroke:1.2px #ffeaa9;
  filter:
    drop-shadow(0 2px 0 #5b350c)
    drop-shadow(0 4px 0 #2a1605)
    drop-shadow(0 7px 0 #050301)
    drop-shadow(0 0 15px #df9e3866)
    drop-shadow(0 12px 18px #000);
}
.sl-wow-title em{
  display:block;
  margin-top:18px;
  color:#d4e8ef;
  font:700 clamp(.8rem,1.3vw,1.15rem)/1 "Cinzel",Georgia,serif;
  letter-spacing:.42em;
  text-shadow:0 2px 3px #000,0 0 13px #43bfe766;
}
.sl-rune-divider{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  width:min(520px,90%);
  margin:22px auto;
}
.sl-rune-divider i{width:45%;height:1px;background:linear-gradient(90deg,transparent,#9a7135)}
.sl-rune-divider i:last-child{background:linear-gradient(90deg,#9a7135,transparent)}
.sl-rune-divider b{color:#efd384;text-shadow:0 0 10px #49c8f1}
.sl-hero-copy>p{
  max-width:690px;
  margin:0 auto;
  color:#d0d8dc;
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.08rem;
  text-shadow:0 2px 4px #000;
}
.sl-hero-actions{justify-content:center}
.sl-button{
  position:relative;
  min-height:49px;
  border:2px ridge #8e692e;
  border-radius:2px;
  background:linear-gradient(180deg,#3c2b15,#171008 56%,#080604);
  box-shadow:inset 0 1px #ffe9a244,inset 0 -4px 10px #0008,0 5px 12px #000;
  font-family:"Cinzel",Georgia,serif;
  text-shadow:0 2px 2px #000;
}
.sl-button::before{
  content:"";
  position:absolute;
  inset:3px;
  pointer-events:none;
  border:1px solid rgba(255,221,144,.18);
}
.sl-button-main{color:#fff0b4;background:linear-gradient(#815921,#3b2109 58%,#160b04)}
.sl-button-ghost{background:linear-gradient(#23323c,#0c151c 58%,#05090c)}
.sl-livebar{
  border:4px ridge #76562a;
  background:linear-gradient(180deg,rgba(18,27,33,.94),rgba(3,8,12,.96));
  box-shadow:inset 0 0 25px #000,0 8px 25px #000;
  font-family:"Cinzel",Georgia,serif;
}
.sl-section-heading{text-align:center;margin-right:auto;margin-left:auto}
.sl-section-heading::before{
  content:"◆";
  display:block;
  width:80px;
  margin:0 auto 18px;
  color:#b98a40;
  border-bottom:1px solid #795b30;
  line-height:.45;
  text-shadow:0 0 10px #4ac8f0;
}
.sl-section-heading h2,.sl-manifesto h2,.sl-community h2{
  color:#f0d98e;
  font-family:"Cinzel Decorative","Cinzel",Georgia,serif;
  font-weight:700;
  text-shadow:0 2px 0 #000,0 0 15px #9b662c44;
}
.sl-realm-card{
  border:6px ridge #5f4b30;
  background:
    linear-gradient(145deg,rgba(14,25,32,.97),rgba(5,9,12,.98)),
    url("/assets/spainlive-fantasy-frame-v2.png") center/cover;
  box-shadow:inset 0 0 0 2px #080b0d,inset 0 0 45px #000,0 18px 50px #000;
}
.sl-realm-card::before{
  content:"";
  position:absolute;
  z-index:2;
  inset:8px;
  pointer-events:none;
  border:1px solid rgba(222,177,87,.32);
}
.sl-realm-wotlk{border-color:#426d83}
.sl-realm-cata{border-color:#78502e}
.sl-realm-art{height:330px;border-bottom:4px ridge #72562e}
.sl-realm-body{position:relative}
.sl-realm-card h3{
  color:#f2d98f;
  font-family:"Cinzel Decorative","Cinzel",Georgia,serif;
  text-shadow:0 2px 0 #000,0 0 12px #c1883355;
}
.sl-realm-card dl{
  border:2px groove #4f493b;
  background:rgba(0,0,0,.25);
  box-shadow:inset 0 0 15px #000;
}
.sl-button-ice{
  color:#dff7ff;
  border-color:#4fa5c6;
  background:linear-gradient(#28799a,#10394e 58%,#071925);
  box-shadow:inset 0 1px #dffaff66,0 0 16px #45c5f144;
}
.sl-button-fire{
  color:#ffe1b7;
  border-color:#a75d29;
  background:linear-gradient(#8b3f16,#431a08 58%,#1e0903);
  box-shadow:inset 0 1px #ffd29c55,0 0 16px #f16c2644;
}
.sl-manifesto{
  position:relative;
  border-top:5px ridge #72552c;
  border-bottom:5px ridge #72552c;
  background:
    linear-gradient(90deg,rgba(4,10,14,.96),rgba(9,12,14,.9)),
    url("/assets/spainlive-fantasy-frame-v2.png") center/cover fixed;
  box-shadow:inset 0 0 80px #000;
}
.sl-feature-list{
  padding:15px 25px;
  border:5px ridge #5d4a31;
  background:rgba(3,7,10,.78);
  box-shadow:inset 0 0 35px #000;
}
.sl-feature-list h3,.sl-step-grid h3{color:#efd68a;font-family:"Cinzel",Georgia,serif}
.sl-step-grid{gap:12px;background:transparent}
.sl-step-grid article{
  position:relative;
  border:4px ridge #5d4a31;
  background:linear-gradient(145deg,#152029,#070b0f 70%);
  box-shadow:inset 0 0 30px #000,0 12px 30px #0008;
}
.sl-step-grid article::before{
  content:"";
  position:absolute;
  inset:6px;
  border:1px solid #b58a3c44;
  pointer-events:none;
}
.sl-community{
  border-top:5px ridge #74572e;
  background:
    radial-gradient(circle at 20% 50%,rgba(51,140,177,.18),transparent 38%),
    linear-gradient(#172129,#070b0e);
  box-shadow:inset 0 0 55px #000;
}
body:not(.page-inicio) .card{
  border:5px ridge #604d34;
  background:linear-gradient(145deg,rgba(15,27,35,.98),rgba(7,8,9,.98));
  box-shadow:inset 0 0 40px #000,0 16px 40px #000;
}
body:not(.page-inicio) h2{
  color:#efd58a;
  font-family:"Cinzel",Georgia,serif;
}
@media(max-width:760px){
  .site-header{border-bottom-width:2px}
  .site-brand{padding-left:26px;font-size:1.4rem}
  .sl-hero{min-height:740px;padding:95px 17px 145px;background-position:center}
  .sl-hero-copy{width:94vw;padding:35px 15px;background:rgba(2,7,10,.22)}
  .sl-wow-title span{font-size:clamp(2.8rem,14vw,4.4rem);-webkit-text-stroke:.7px #ffeaa9}
  .sl-wow-title em{letter-spacing:.22em}
  .sl-realm-card{border-width:4px}
  .sl-realm-art{height:220px}
  .sl-manifesto{background-attachment:scroll}
}

/* Admin realm visibility */
.admin-realm-help{
  margin:-4px 0 15px;
  color:#9eabb4;
  font-size:.84rem;
}
.admin-realm-help b{color:#75e3a8}
.admin-table-scroll{overflow-x:auto;border:1px solid #4f493b}
.admin-accounts-table{min-width:980px;margin:0}
.admin-accounts-table td{vertical-align:top}
.admin-realm-status{display:grid;gap:7px;min-width:300px}
.realm-badge{
  position:relative;
  display:grid;
  padding:9px 12px 9px 15px;
  overflow:hidden;
  border:1px solid #536775;
  background:linear-gradient(100deg,#102532,#071018);
  box-shadow:inset 0 0 15px #0008;
}
.realm-badge::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:#65cff3;
  box-shadow:0 0 12px #65cff3;
}
.realm-badge>b{
  color:#a9e9ff;
  font-family:"Cinzel",Georgia,serif;
  font-size:.76rem;
}
.realm-badge small{margin-top:3px;color:#91a3ae;font-size:.67rem}
.realm-badge small strong{color:#72e5a5;text-shadow:0 0 8px #2bdc7966}
.realm-badge em{
  margin-top:3px;
  color:#657985;
  font-size:.65rem;
  font-style:normal;
}
.realm-badge-cata{
  border-color:#785135;
  background:linear-gradient(100deg,#35180a,#120a06);
}
.realm-badge-cata::before{background:#e87931;box-shadow:0 0 12px #e87931}
.realm-badge-cata>b{color:#ffb56f}
.realm-badge-empty{border-color:#454b50;background:#11161a}
.realm-badge-empty::before{background:#666;box-shadow:none}
.realm-badge-empty>b{color:#a6adb2}
.realm-badge-inactive{opacity:.48;filter:saturate(.35)}
.realm-badge-inactive::before{box-shadow:none}
.panel-realm-overview{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:18px 0;
}
.panel-realm-overview>span{
  display:grid;
  grid-template-columns:1fr auto;
  gap:5px 15px;
  padding:15px 17px;
  border:3px ridge #536f7e;
  background:linear-gradient(110deg,#102a39,#071018);
  box-shadow:inset 0 0 20px #000;
}
.panel-realm-overview .panel-realm-cata{
  border-color:#7f5738;
  background:linear-gradient(110deg,#35180a,#120a06);
}
.panel-realm-overview b{color:#b7ebff;font-family:"Cinzel",Georgia,serif}
.panel-realm-overview .panel-realm-cata b{color:#ffba76}
.panel-realm-overview strong{text-align:right;font-size:.72rem}
.panel-realm-overview small{grid-column:1/3;color:#91a1aa}
@media(max-width:650px){
  .panel-realm-overview{grid-template-columns:1fr}
}

/* Visible fantasy dropdown menu */
.site-header{overflow:visible;z-index:10000}
.site-nav{overflow:visible}
.site-nav-more{
  position:relative;
  z-index:10001;
}
.site-nav-more>summary{
  display:flex;
  align-items:center;
  gap:7px;
  color:#e9d8aa;
  border:1px solid transparent;
}
.site-nav-more>summary::after{
  content:"▾";
  color:#d5a94f;
  font-size:.75rem;
  transition:transform .18s ease;
}
.site-nav-more[open]>summary{
  color:#fff2bd;
  border-color:#9a7337;
  background:linear-gradient(180deg,#59401b,#211509);
  box-shadow:inset 0 1px #ffe2a155,0 0 15px #49bfea33;
}
.site-nav-more[open]>summary::after{transform:rotate(180deg)}
.site-nav-more[open]>div{
  position:absolute;
  z-index:10002;
  top:calc(100% + 12px);
  right:0;
  display:grid;
  grid-template-columns:1fr;
  width:280px;
  padding:10px;
  overflow:visible;
  border:5px ridge #72572f;
  border-radius:2px;
  background:
    radial-gradient(circle at 50% 0,rgba(69,143,174,.14),transparent 45%),
    linear-gradient(145deg,#19262f,#070b0f 72%);
  box-shadow:inset 0 0 32px #000,0 18px 45px #000,0 0 20px #4cc9f022;
}
.site-nav-more[open]>div::before{
  content:"";
  position:absolute;
  top:-10px;
  right:25px;
  width:16px;
  height:16px;
  border-top:3px ridge #876735;
  border-left:3px ridge #876735;
  background:#17232b;
  transform:rotate(45deg);
}
.site-nav-more div a{
  position:relative;
  display:block;
  padding:12px 14px 12px 34px;
  color:#d2dce1;
  border-bottom:1px solid rgba(151,178,191,.16);
  font-family:"Cinzel",Georgia,serif;
  font-size:.72rem;
  letter-spacing:.04em;
  text-shadow:0 2px 2px #000;
}
.site-nav-more div a:last-child{border-bottom:0}
.site-nav-more div a::before{
  content:"◆";
  position:absolute;
  left:13px;
  color:#b58b43;
  font-size:.55rem;
  text-shadow:0 0 8px #52c9ef;
}
.site-nav-more div a:hover{
  color:#fff0b6;
  background:linear-gradient(90deg,rgba(134,91,31,.42),rgba(25,54,68,.26));
  box-shadow:inset 3px 0 #d0a34f;
}
@media(max-width:760px){
  .site-nav-more[open]>div{
    position:fixed;
    top:118px;
    right:12px;
    left:12px;
    width:auto;
    max-height:calc(100vh - 135px);
    overflow-y:auto;
  }
  .site-nav-more[open]>div::before{display:none}
  .site-nav-more div a{padding-top:14px;padding-bottom:14px;font-size:.78rem}
}

/* Admin online players only */
.admin-online-summary{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:13px 0 16px;
}
.admin-online-summary span{
  padding:9px 14px;
  border:2px ridge #4d788d;
  background:linear-gradient(#153647,#08151e);
  color:#aeeaff;
  font-family:"Cinzel",Georgia,serif;
  font-size:.72rem;
}
.admin-online-summary .summary-cata{
  color:#ffb878;
  border-color:#815735;
  background:linear-gradient(#401d0c,#160b06);
}
.admin-online-summary b{margin-right:6px;color:#73e3a5;font-size:1rem}
.admin-online-table{min-width:760px}
.online-realm{
  display:inline-block;
  min-width:145px;
  padding:8px 11px;
  border-left:4px solid #63d1f4;
  color:#bceeff;
  background:linear-gradient(90deg,#123344,#08131b);
  box-shadow:inset 0 0 12px #000;
  font-family:"Cinzel",Georgia,serif;
  font-size:.7rem;
}
.online-realm-cata{
  color:#ffc087;
  border-color:#ed8238;
  background:linear-gradient(90deg,#441d0b,#160a05);
}
.admin-no-online{
  padding:28px!important;
  color:#8e9ba4;
  text-align:center;
  font-style:italic;
}
