/* MuClaus — site público · visual neon */
:root {
  --fundo: #04040b;
  --fundo-2: rgba(10, 10, 26, .72);
  --painel: rgba(255, 255, 255, .045);
  --painel-2: rgba(255, 255, 255, .07);
  --painel-solido: #0c0c1d;
  --borda: rgba(255, 255, 255, .08);
  --borda-2: rgba(255, 255, 255, .14);
  --texto: #d9def0;
  --texto-2: #8e94b5;
  --prata: #f4f6ff;
  --azul: #3fa0ff;
  --azul-forte: #2b6dff;
  --azul-claro: #a9d4ff;
  --ciano: #26e8ff;
  --roxo: #9b5cff;
  --magenta: #ff3dbd;
  --azul-glow: rgba(63, 160, 255, .5);
  --roxo-glow: rgba(155, 92, 255, .45);
  --grad: linear-gradient(120deg, var(--ciano), var(--azul) 35%, var(--roxo) 70%, var(--magenta));
  --grad-btn: linear-gradient(120deg, #2b8bff, #7a4dff 60%, #d23cff);
  --ouro: #ffd166;
  --verde: #38f2a0;
  --vermelho: #ff4d6d;
  --raio: 16px;
  --larg: 1180px;
  --vidro: blur(18px) saturate(150%);
  --fonte-tit: "Exo 2", "Inter", system-ui, sans-serif;
  --fonte-marca: "Orbitron", "Exo 2", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; -webkit-text-size-adjust: 100%; background: var(--fundo); }
body {
  position: relative; margin: 0; background: var(--fundo); color: var(--texto);
  font: 400 16px/1.6 "Inter", system-ui, sans-serif; -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
/* Fundo vivo: aurora + grade, fixo atrás de tudo */
body::before {
  content: ""; position: fixed; inset: -20%; z-index: -2; pointer-events: none;
  background:
    radial-gradient(38% 32% at 18% 22%, rgba(43, 109, 255, .26), transparent 70%),
    radial-gradient(34% 30% at 85% 18%, rgba(155, 92, 255, .22), transparent 70%),
    radial-gradient(40% 34% at 70% 85%, rgba(255, 61, 189, .14), transparent 70%),
    radial-gradient(36% 30% at 10% 90%, rgba(38, 232, 255, .12), transparent 70%);
  animation: aurora 26s ease-in-out infinite alternate;
}
body::after {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, .028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .028) 1px, transparent 1px);
  background-size: 56px 56px;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, #000, transparent 85%);
  mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, #000, transparent 85%);
}
@keyframes aurora {
  0% { transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
  50% { transform: translate3d(3%, -2%, 0) rotate(6deg) scale(1.08); }
  100% { transform: translate3d(-3%, 3%, 0) rotate(-5deg) scale(1.02); }
}
::selection { background: rgba(155, 92, 255, .45); color: #fff; }
img { max-width: 100%; display: block; }
a { color: var(--azul); }
h1, h2, h3 { font-family: var(--fonte-tit); font-weight: 800; color: var(--prata); line-height: 1.15; margin: 0; letter-spacing: -.01em; }
p { margin: 0 0 12px; }
kbd, code {
  font: 600 .84em/1.3 ui-monospace, Consolas, monospace; white-space: nowrap;
  background: rgba(63, 160, 255, .1); border: 1px solid rgba(63, 160, 255, .35);
  padding: .15em .45em; border-radius: 6px; color: var(--ciano);
}
.ico { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ico.gira { transform: rotate(180deg); }
.sr, .pular:not(:focus) { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pular:focus { position: fixed; top: 8px; left: 8px; z-index: 50; background: var(--azul-forte); color: #fff; padding: 10px 16px; border-radius: 8px; }
.mudo { color: var(--texto-2); }
.pequeno { font-size: .88rem; }
.forte { color: var(--prata); font-weight: 700; }
.centro { text-align: center; }
.direita { text-align: right; }
.nota { color: var(--texto-2); font-size: .9rem; }
.neon-txt { background: var(--grad); background-size: 200% auto; -webkit-background-clip: text; background-clip: text; color: transparent; animation: brilho-txt 6s linear infinite; }
@keyframes brilho-txt { to { background-position: 200% center; } }

.wrap { max-width: var(--larg); margin: 0 auto; padding: 0 16px; }
.estreito { max-width: 820px; }

/* Vidro: base comum dos cartões */
.vidro, .destaque-card, .noticia-grande, .noticias-lista a, .noticia, .mini-rk, .podio-item, .tabela, .pstat,
.painel-box, .membro, .caixa-info, .atalho, .card, .sistema, .faq details, .evento, .ev-item, .passos li,
.cmd-grupo, .trilha li, .classe-card, .cta-plat, .plat, .form-card, .numeros-caixa {
  background: linear-gradient(160deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02));
  border: 1px solid var(--borda);
  -webkit-backdrop-filter: var(--vidro); backdrop-filter: var(--vidro);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 18px 50px -20px rgba(0, 0, 0, .7);
}
/* Brilho que segue o mouse (script.js define --mx/--my) */
.luz { position: relative; isolation: isolate; }
.luz::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: -1; pointer-events: none; opacity: 0; transition: opacity .25s;
  background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), rgba(63, 160, 255, .16), transparent 70%);
}
.luz:hover::before { opacity: 1; }

/* Revelar ao rolar (só com JS ligado) */
.js .rv { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--rv-d, 0s); }
.js .rv.rv-on { opacity: 1; transform: none; }

/* ---------- Topo ---------- */
.aviso-topo { background: var(--grad-btn); color: #fff; text-align: center; font-weight: 600; font-size: .92rem; padding: 9px 16px; }
.topo { position: sticky; top: 0; z-index: 20; background: rgba(4, 4, 11, .62); -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%); border-bottom: 1px solid var(--borda); }
.topo::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--grad); opacity: .55; }
.topo-inner { max-width: var(--larg); margin: 0 auto; padding: 0 16px; height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.marca { display: inline-flex; align-items: center; gap: 0; font: 900 1.3rem var(--fonte-marca); color: var(--prata); text-decoration: none; letter-spacing: .06em; white-space: nowrap; text-transform: uppercase; }
.marca span { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 10px rgba(63, 160, 255, .5)); }
.marca small { margin-left: 10px; font: 700 .6rem "Inter", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--ciano); padding: 3px 8px; border: 1px solid rgba(38, 232, 255, .35); border-radius: 999px; }
.menu { display: flex; gap: 2px; align-items: center; }
.menu a { position: relative; display: inline-flex; align-items: center; gap: 6px; color: var(--texto); text-decoration: none; font-weight: 500; font-size: .92rem; padding: 8px 11px; border-radius: 10px; white-space: nowrap; transition: color .15s, background .15s; }
.menu a:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.menu a.ativo { color: #fff; }
.menu a.ativo::after { content: ""; position: absolute; left: 11px; right: 11px; bottom: 2px; height: 2px; border-radius: 2px; background: var(--grad); box-shadow: 0 0 10px var(--azul-glow); }
.menu a.menu-conta { border: 1px solid var(--borda-2); }
.menu a.menu-conta:hover { border-color: var(--azul); box-shadow: 0 0 18px -4px var(--azul-glow); }
.menu a.menu-cta { background: var(--grad-btn); color: #fff; margin-left: 6px; font-weight: 700; box-shadow: 0 6px 22px -6px var(--roxo-glow); }
.menu a.menu-cta::after { display: none; }
.menu a.menu-cta:hover { filter: brightness(1.15); }
.menu-sep { width: 1px; height: 22px; background: var(--borda-2); margin: 0 6px; }
.menu-btn { display: none; }

/* ---------- Botões ---------- */
.btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 0 24px; border-radius: 12px; border: 0; cursor: pointer;
  font: 700 1rem "Inter", sans-serif; text-decoration: none; transition: transform .15s, box-shadow .2s, border-color .15s, filter .15s, background .2s;
}
.btn-ouro { color: #fff; background: var(--grad-btn); background-size: 160% auto; box-shadow: 0 0 0 1px rgba(255, 255, 255, .18) inset, 0 10px 34px -8px var(--roxo-glow), 0 0 24px -6px var(--azul-glow); }
.btn-ouro:hover { transform: translateY(-2px); background-position: right center; box-shadow: 0 0 0 1px rgba(255, 255, 255, .25) inset, 0 14px 40px -8px var(--roxo-glow), 0 0 34px -4px var(--azul-glow); }
.btn-borda { color: var(--prata); border: 1px solid var(--borda-2); background: rgba(255, 255, 255, .04); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.btn-borda:hover { border-color: var(--azul); color: #fff; box-shadow: 0 0 22px -6px var(--azul-glow), 0 0 0 1px rgba(63, 160, 255, .25) inset; transform: translateY(-2px); }
.btn-grande { min-height: 56px; padding: 0 34px; font-size: 1.05rem; }
.btn-p { min-height: 38px; padding: 0 14px; font-size: .9rem; }
.btn.desativado { background: rgba(255, 255, 255, .05); color: var(--texto-2); box-shadow: none; cursor: not-allowed; transform: none; filter: none; }
.btn[disabled] { opacity: .6; cursor: wait; }
.link-seta { display: inline-flex; align-items: center; gap: 6px; color: var(--ciano); font-weight: 600; text-decoration: none; font-size: .95rem; }
.link-seta:hover { color: #fff; text-shadow: 0 0 12px var(--azul-glow); }
.link-seta .ico { width: 16px; height: 16px; transition: transform .15s; }
.link-seta:hover .ico:not(.gira) { transform: translateX(3px); }
.link-fraco { color: var(--texto-2); text-decoration: none; }
.link-fraco:hover { color: var(--prata); }

/* ---------- Hero ---------- */
.hero {
  position: relative; overflow: hidden; display: grid; place-items: center; text-align: center;
  min-height: min(90vh, 800px); padding: 64px 16px 96px; isolation: isolate;
}
.hero-fx { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.hero-orbe { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .7; animation: flutuar 14s ease-in-out infinite alternate; }
.hero-orbe.o1 { width: 520px; height: 520px; left: 50%; top: 28%; margin-left: -260px; margin-top: -260px; background: radial-gradient(circle, rgba(43, 109, 255, .55), transparent 65%); }
.hero-orbe.o2 { width: 380px; height: 380px; left: 8%; top: 52%; background: radial-gradient(circle, rgba(155, 92, 255, .45), transparent 65%); animation-duration: 18s; }
.hero-orbe.o3 { width: 340px; height: 340px; right: 6%; top: 8%; background: radial-gradient(circle, rgba(255, 61, 189, .32), transparent 65%); animation-duration: 16s; animation-delay: -6s; }
@keyframes flutuar { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(40px, -30px) scale(1.12); } }
.hero-chao {
  position: absolute; left: -50%; right: -50%; bottom: -10%; height: 55%;
  background-image:
    linear-gradient(rgba(63, 160, 255, .45) 1px, transparent 1px),
    linear-gradient(90deg, rgba(155, 92, 255, .45) 1px, transparent 1px);
  background-size: 64px 64px;
  transform: perspective(420px) rotateX(64deg); transform-origin: 50% 0;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 45%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 45%, transparent 100%);
  animation: chao 3.2s linear infinite; opacity: .55;
}
@keyframes chao { to { background-position: 0 64px, 0 0; } }
.hero-particulas { position: absolute; inset: 0; width: 100%; height: 100%; }
/* Vídeo/imagem do jogo atrás do logo (img/hero.mp4 e img/hero.jpg) */
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .62; filter: saturate(1.25) contrast(1.05); }
.hero-com-video .hero-fx::after {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 55% 45% at 50% 42%, rgba(4, 4, 11, .55), transparent 75%),
    linear-gradient(180deg, rgba(4, 4, 11, .55) 0%, rgba(4, 4, 11, .15) 35%, rgba(4, 4, 11, .35) 70%, var(--fundo) 100%),
    linear-gradient(90deg, rgba(43, 109, 255, .22), transparent 30%, transparent 70%, rgba(155, 92, 255, .22));
}
.hero-com-video .hero-orbe { opacity: .45; mix-blend-mode: screen; }
.hero-com-video .hero-chao { opacity: .3; }
.hero-com-video .hero-sub, .hero-com-video .hero-titulo { text-shadow: 0 2px 18px rgba(0, 0, 0, .85); }
.hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 160px; z-index: -1; background: linear-gradient(180deg, transparent, var(--fundo)); pointer-events: none; }
.hero-inner { position: relative; max-width: 900px; width: 100%; }
.selo { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 18px; font: 700 .76rem "Inter", sans-serif; letter-spacing: .22em; text-transform: uppercase; color: var(--prata); border: 1px solid rgba(38, 232, 255, .4); border-radius: 999px; padding: 7px 16px; background: rgba(38, 232, 255, .07); box-shadow: 0 0 24px -6px rgba(38, 232, 255, .5); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.selo::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ciano); box-shadow: 0 0 10px var(--ciano); }
.logo { position: relative; margin: 0 auto; max-width: 760px; }
.logo::before { content: ""; position: absolute; inset: 15% 8%; z-index: -1; border-radius: 50%; background: radial-gradient(ellipse, rgba(63, 160, 255, .4), rgba(155, 92, 255, .15) 50%, transparent 72%); filter: blur(30px); animation: logo-luz 5s ease-in-out infinite; }
@keyframes logo-luz { 50% { opacity: .55; transform: scale(1.08); } }
.logo img {
  width: 100%; height: auto; mix-blend-mode: screen;
  -webkit-mask-image: radial-gradient(ellipse 62% 64% at 50% 50%, #000 72%, transparent 100%);
  mask-image: radial-gradient(ellipse 62% 64% at 50% 50%, #000 72%, transparent 100%);
}
.hero-titulo { font: 800 clamp(1.5rem, 3.6vw, 2.3rem)/1.2 var(--fonte-tit); color: var(--prata); margin: 8px 0 0; }
.hero-sub { font-size: 1.12rem; color: var(--texto); max-width: 600px; margin: 14px auto 24px; }
.plat-chips { list-style: none; padding: 0; margin: 0 0 28px; display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.plat-chips li { display: inline-flex; align-items: center; gap: 6px; font: 600 .85rem "Inter", sans-serif; color: var(--prata); padding: 7px 15px; border-radius: 999px; border: 1px solid var(--borda-2); background: rgba(255, 255, 255, .05); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.plat-chips .ico { width: 15px; height: 15px; color: var(--ciano); }
.hero-acoes { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* Status */
.status { display: inline-flex; align-items: center; gap: 10px; margin-top: 28px; padding: 10px 18px; border-radius: 999px; border: 1px solid var(--borda-2); background: rgba(10, 10, 26, .55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: .92rem; }
.status-ponto { width: 10px; height: 10px; border-radius: 50%; background: var(--texto-2); flex: none; }
.status.on { border-color: rgba(56, 242, 160, .35); }
.status.on .status-ponto { background: var(--verde); box-shadow: 0 0 0 4px rgba(56, 242, 160, .15), 0 0 14px var(--verde); animation: pulsar 2s infinite; }
.status.off .status-ponto { background: var(--vermelho); box-shadow: 0 0 12px var(--vermelho); }
.status b { color: #fff; }
@keyframes pulsar { 50% { box-shadow: 0 0 0 7px rgba(56, 242, 160, .04), 0 0 18px var(--verde); } }

/* ---------- Números ---------- */
.faixa-numeros { position: relative; margin-top: -48px; z-index: 2; }
.numeros { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-radius: 20px; overflow: hidden; border: 1px solid var(--borda-2); background: linear-gradient(160deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02)); -webkit-backdrop-filter: var(--vidro); backdrop-filter: var(--vidro); box-shadow: 0 30px 80px -30px rgba(43, 109, 255, .45), 0 1px 0 rgba(255, 255, 255, .08) inset; }
.wrap.numeros { padding: 0; max-width: calc(var(--larg) - 32px); }
.numero { position: relative; display: flex; flex-direction: column; justify-content: center; padding: 22px 10px; text-align: center; border-left: 1px solid var(--borda); }
.numero:first-child { border-left: 0; }
.numero strong { display: block; font: 800 1.45rem/1.25 var(--fonte-marca); color: #fff; overflow-wrap: anywhere; text-shadow: 0 0 18px rgba(63, 160, 255, .55); }
.numero span { color: var(--texto-2); font-size: .74rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; margin-top: 4px; }
.numero.destaque strong { color: var(--verde); text-shadow: 0 0 18px rgba(56, 242, 160, .6); }
.numeros-caixa { border-radius: var(--raio); margin-bottom: 36px; }

/* ---------- Seções ---------- */
.secao { position: relative; padding: 88px 0; }
.secao-curta { padding: 48px 0 76px; }
.secao-escura { background: linear-gradient(180deg, transparent, rgba(12, 10, 32, .55) 18%, rgba(12, 10, 32, .55) 82%, transparent); }
.titulo { font-size: clamp(1.9rem, 4.4vw, 2.8rem); text-align: center; margin-bottom: 36px; }
.titulo::after { content: ""; display: block; width: 72px; height: 3px; margin: 16px auto 0; border-radius: 3px; background: var(--grad); box-shadow: 0 0 14px var(--azul-glow); }
.titulo.esq { text-align: left; margin-bottom: 0; }
.titulo.esq::after { margin-left: 0; }
.sobre-titulo { text-align: center; margin: 0 0 10px; font: 700 .76rem "Inter", sans-serif; letter-spacing: .26em; text-transform: uppercase; color: var(--ciano); text-shadow: 0 0 14px rgba(38, 232, 255, .45); }
.sobre-titulo.esq { text-align: left; }
.intro { text-align: center; color: var(--texto-2); margin: -18px auto 34px; max-width: 580px; }
.secao-topo { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 30px; flex-wrap: wrap; }
.secao-topo .mudo { margin: 0; max-width: 380px; font-size: .92rem; }
.sub-titulo { font-size: 1.5rem; margin: 48px 0 18px; }
.sub-titulo:first-child { margin-top: 0; }
.sub-titulo.sem-margem { margin: 0; }

/* Cabeçalho das páginas internas */
.pg-cab { position: relative; padding: 72px 0 52px; text-align: center; overflow: hidden; isolation: isolate; border-bottom: 1px solid var(--borda); }
.pg-cab::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 50% 100% at 50% 0%, rgba(43, 109, 255, .28), transparent 70%), radial-gradient(ellipse 30% 80% at 85% 0%, rgba(155, 92, 255, .2), transparent 70%); }
.pg-cab::after { content: ""; position: absolute; left: 10%; right: 10%; bottom: -1px; height: 1px; background: var(--grad); opacity: .6; box-shadow: 0 0 12px var(--azul-glow); }
.pg-titulo { font-size: clamp(2.1rem, 5.6vw, 3.4rem); background: linear-gradient(180deg, #fff 30%, #a9c6ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pg-titulo.esq { text-align: left; }
.pg-intro { color: var(--texto-2); max-width: 640px; margin: 14px auto 0; font-size: 1.05rem; }

/* ---------- Avatares e brasões ---------- */
.av {
  --c1: #3b4a66; --c2: #1b2436;
  flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  font: 800 .78rem var(--fonte-marca); color: #fff; letter-spacing: .02em;
  background: radial-gradient(circle at 30% 25%, var(--c1), var(--c2) 75%);
  box-shadow: 0 0 0 2px rgba(255, 255, 255, .1), 0 0 0 4px var(--fundo), 0 0 0 5px var(--c1), 0 0 22px -2px var(--c1);
}
.av-sm { --c1: #8b5cff; --c2: #261a63; }
.av-bk { --c1: #ff4d6d; --c2: #5a1424; }
.av-elf { --c1: #38f2a0; --c2: #0e4530; }
.av-mg { --c1: #ffa53d; --c2: #5c3109; }
.av-dl { --c1: #ffd166; --c2: #4e3a0c; }
.av-su { --c1: #ff3dbd; --c2: #521645; }
.av-rf { --c1: #26e8ff; --c2: #0f3d52; }
.av-p { width: 28px; height: 28px; font-size: .52rem; box-shadow: 0 0 0 1px var(--c1), 0 0 10px -2px var(--c1); }
.av-m { width: 52px; height: 52px; font-size: .86rem; }
.av-g { width: 88px; height: 88px; font-size: 1.25rem; }
.av-xg { width: 116px; height: 116px; font-size: 1.65rem; }
.gmark { flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; background: #000; border: 1px solid var(--borda-2); overflow: hidden; box-shadow: 0 0 18px -6px var(--azul-glow); }
.gmark svg { width: 100%; height: 100%; display: block; image-rendering: pixelated; }
.gmark-vazio { background: rgba(255, 255, 255, .05); color: var(--texto-2); }
.gmark-vazio .ico { width: 55%; height: 55%; }
.gmark-p { width: 26px; height: 26px; border-radius: 6px; }
.gmark-m { width: 52px; height: 52px; }
.gmark-g { width: 88px; height: 88px; border-radius: 16px; }
.gmark-xg { width: 116px; height: 116px; border-radius: 18px; }

/* ---------- Destaques da home ---------- */
.secao-destaques { padding: 64px 0 32px; }
.destaques { display: grid; grid-template-columns: 1fr 1.15fr 1fr; gap: 18px; }
.destaque-card { position: relative; display: flex; flex-direction: column; border-radius: 22px; padding: 24px; overflow: hidden; transition: transform .25s, border-color .25s, box-shadow .25s; }
.destaque-card:hover { transform: translateY(-4px); }
.destaque-rei { border-color: rgba(255, 209, 102, .3); }
.destaque-rei::after, .destaque-guild::after, .destaque-meio::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; }
.destaque-rei::after { background: linear-gradient(90deg, transparent, var(--ouro), transparent); box-shadow: 0 0 18px var(--ouro); }
.destaque-guild::after { background: linear-gradient(90deg, transparent, var(--magenta), transparent); box-shadow: 0 0 18px var(--magenta); }
.destaque-meio::after { background: var(--grad); box-shadow: 0 0 18px var(--azul-glow); }
.destaque-rei:hover { box-shadow: 0 24px 60px -24px rgba(255, 209, 102, .4); }
.destaque-guild { border-color: rgba(255, 61, 189, .28); }
.destaque-guild:hover { box-shadow: 0 24px 60px -24px rgba(255, 61, 189, .45); }
.destaque-meio { border-color: rgba(63, 160, 255, .35); background: radial-gradient(ellipse 90% 60% at 50% 0%, rgba(43, 109, 255, .22), transparent 70%), linear-gradient(160deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02)); }
.destaque-meio:hover { box-shadow: 0 24px 60px -24px var(--azul-glow); }
.destaque-rotulo { display: inline-flex; align-self: center; align-items: center; gap: 6px; margin: 0 0 20px; padding: 5px 12px; border-radius: 999px; font: 700 .72rem "Inter", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--ciano); border: 1px solid rgba(38, 232, 255, .35); background: rgba(38, 232, 255, .08); }
.destaque-rotulo .ico { width: 14px; height: 14px; }
.destaque-rei .destaque-rotulo { color: var(--ouro); border-color: rgba(255, 209, 102, .4); background: rgba(255, 209, 102, .08); }
.destaque-guild .destaque-rotulo { color: #ff8fd8; border-color: rgba(255, 61, 189, .4); background: rgba(255, 61, 189, .08); }
.destaque-corpo { flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; color: inherit; text-decoration: none; }
.destaque-corpo .av, .destaque-corpo .gmark { margin-bottom: 12px; }
.destaque-nome { font: 800 1.5rem var(--fonte-tit); color: var(--prata); word-break: break-word; }
.destaque-valor { margin-top: 6px; font-weight: 700; color: var(--azul-claro); }
.destaque-rei .destaque-valor { color: var(--ouro); text-shadow: 0 0 14px rgba(255, 209, 102, .4); }
.destaque-guild .destaque-valor { color: #ff8fd8; }
.destaque-corpo .link-seta { margin-top: auto; padding-top: 14px; }
a.destaque-corpo:hover .destaque-nome { color: #fff; }
.mini-passos { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 14px; }
.mini-passos li, .passos li { display: flex; gap: 12px; align-items: flex-start; }
.mini-passos span, .passos li > span { flex: none; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; background: var(--grad-btn); color: #fff; font: 800 .9rem var(--fonte-marca); box-shadow: 0 0 16px -4px var(--roxo-glow); }
.mini-passos strong, .passos strong { display: block; color: var(--prata); }
.mini-passos small, .passos small { display: block; color: var(--texto-2); font-size: .88rem; }
.destaque-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: auto; }
.destaque-acoes .btn { padding: 0 10px; font-size: .92rem; }

/* ---------- Notícias ---------- */
.cat { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ciano); border: 1px solid rgba(38, 232, 255, .4); background: rgba(38, 232, 255, .07); text-decoration: none; white-space: nowrap; }
.noticias-home { display: grid; grid-template-columns: 1.3fr 1fr; gap: 18px; }
.noticia-grande {
  position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 12px; min-height: 300px; padding: 30px; border-radius: 22px; text-decoration: none; color: inherit;
  background: radial-gradient(ellipse 80% 90% at 100% 0%, rgba(155, 92, 255, .32), transparent 60%), radial-gradient(ellipse 60% 70% at 0% 100%, rgba(43, 109, 255, .25), transparent 60%), linear-gradient(160deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02));
  transition: transform .25s, border-color .25s, box-shadow .25s;
}
.noticia-grande .cat { align-self: flex-start; }
.noticia-grande h3 { font-size: clamp(1.45rem, 3vw, 2rem); }
.noticia-grande p { color: var(--texto-2); margin: 0; }
.noticia-rodape { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 12px; color: var(--texto-2); font-size: .88rem; font-weight: 600; }
.noticia-grande:hover { border-color: rgba(155, 92, 255, .55); transform: translateY(-3px); box-shadow: 0 24px 60px -24px var(--roxo-glow); }
.noticias-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; align-content: start; }
.noticias-lista a { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "cat data" "tit tit"; gap: 6px 10px; align-items: center; padding: 16px 18px; border-radius: 14px; text-decoration: none; color: inherit; transition: border-color .2s, transform .2s; }
.noticias-lista a:hover { border-color: rgba(63, 160, 255, .5); transform: translateX(4px); }
.noticias-lista .cat { grid-area: cat; justify-self: start; }
.noticias-lista strong { grid-area: tit; color: var(--prata); }
.noticias-lista time { grid-area: data; justify-self: end; color: var(--texto-2); font-size: .82rem; }
.noticias { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 18px; }
.noticia { display: flex; flex-direction: column; gap: 10px; border-radius: var(--raio); padding: 24px; text-decoration: none; color: inherit; transition: border-color .2s, transform .2s, box-shadow .2s; }
.noticia:hover { border-color: rgba(63, 160, 255, .5); transform: translateY(-4px); box-shadow: 0 24px 50px -24px var(--azul-glow); }
.noticia-topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.noticia time { color: var(--texto-2); font-size: .84rem; }
.noticia h3 { font-size: 1.2rem; }
.noticia p { color: var(--texto-2); margin: 0; flex: 1; }
.artigo-meta { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; color: var(--texto-2); font-size: .9rem; }
.artigo .pg-cab { text-align: left; }
.texto-artigo { font-size: 1.05rem; }
.texto-artigo p { margin: 0 0 16px; }
.texto-artigo h2 { font-size: 1.4rem; margin: 36px 0 12px; }
.texto-artigo h2:first-child { margin-top: 0; }
.voltar { margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--borda); }

/* ---------- Rankings ---------- */
.mini-rankings { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.mini-rk { border-radius: var(--raio); padding: 18px 14px; min-width: 0; transition: border-color .2s, transform .2s; }
.mini-rk:hover { border-color: rgba(63, 160, 255, .4); transform: translateY(-3px); }
.mini-rk h3 { font: 700 .74rem "Inter", sans-serif; letter-spacing: .16em; text-transform: uppercase; margin: 0 0 14px; padding-bottom: 10px; border-bottom: 1px solid var(--borda); }
.mini-rk h3 a { color: var(--ciano); text-decoration: none; }
.mini-rk ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.mini-rk li { display: grid; grid-template-columns: 16px auto minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 8px; align-items: center; }
.mini-rk li > a { color: var(--prata); text-decoration: none; font-weight: 600; font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-rk li > a:hover { color: #fff; text-decoration: underline; }
.mini-rk li > b { grid-column: 3; font-size: .78rem; font-weight: 600; color: var(--texto-2); }
.mini-rk li .av, .mini-rk li .gmark { grid-row: span 2; }
.mini-pos { grid-row: span 2; font: 800 .8rem var(--fonte-marca); color: var(--texto-2); text-align: center; }
.mini-rk li:first-child .mini-pos { color: var(--ouro); text-shadow: 0 0 10px rgba(255, 209, 102, .6); }
.mini-vazio { color: var(--texto-2); font-size: .9rem; margin: 0; }

.abas { display: flex; justify-content: center; gap: 6px; margin: 0 auto 16px; flex-wrap: wrap; padding: 6px; border-radius: 999px; width: fit-content; max-width: 100%; border: 1px solid var(--borda); background: rgba(255, 255, 255, .04); -webkit-backdrop-filter: var(--vidro); backdrop-filter: var(--vidro); }
.aba { display: inline-flex; align-items: center; min-height: 40px; padding: 0 20px; border-radius: 999px; font: 600 .95rem "Inter", sans-serif; color: var(--texto-2); text-decoration: none; transition: .2s; }
.aba:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.aba.ativa { color: #fff; background: var(--grad-btn); box-shadow: 0 6px 22px -6px var(--roxo-glow); }
.filtros { display: flex; justify-content: center; gap: 6px; margin: 0 0 44px; flex-wrap: wrap; }
.filtro { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 14px 0 10px; border-radius: 999px; font-size: .88rem; font-weight: 600; color: var(--texto-2); text-decoration: none; border: 1px solid var(--borda); background: rgba(255, 255, 255, .03); transition: .2s; }
.filtro:not(:has(.av)) { padding-left: 14px; }
.filtro b { color: var(--ciano); font-weight: 700; }
.filtro:hover { color: var(--prata); border-color: rgba(63, 160, 255, .55); }
.filtro.ativo { color: #fff; border-color: var(--azul); background: rgba(63, 160, 255, .14); box-shadow: 0 0 18px -6px var(--azul-glow); }
.filtro .av-p { width: 22px; height: 22px; font-size: .46rem; }

.podio { display: grid; grid-template-columns: 1fr 1.15fr 1fr; gap: 16px; align-items: end; max-width: 800px; margin: 0 auto 32px; }
.podio-item { position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; padding: 34px 14px 20px; border-radius: 20px; text-decoration: none; transition: transform .2s, box-shadow .2s; }
.podio-item:hover { transform: translateY(-4px); }
.podio-item .av, .podio-item .gmark { margin-bottom: 10px; }
.podio-item.p1 { padding-top: 46px; border-color: rgba(255, 209, 102, .5); background: radial-gradient(ellipse 90% 60% at 50% 0%, rgba(255, 209, 102, .16), transparent 70%), linear-gradient(160deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02)); box-shadow: 0 0 60px -10px rgba(255, 209, 102, .3); }
.podio-pos { position: absolute; top: -17px; left: 50%; transform: translateX(-50%); width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font: 800 .95rem var(--fonte-marca); color: #fff; background: #4a5a74; border: 3px solid var(--fundo); }
.p1 .podio-pos { width: 44px; height: 44px; top: -22px; color: #3b2a05; background: linear-gradient(180deg, #ffe7a3, var(--ouro)); box-shadow: 0 0 22px rgba(255, 209, 102, .7); }
.p2 .podio-pos { background: linear-gradient(180deg, #eef2fb, #8e94b5); color: #1b2436; box-shadow: 0 0 16px rgba(220, 230, 255, .4); }
.p3 .podio-pos { background: linear-gradient(180deg, #f0b98a, #a3633a); box-shadow: 0 0 16px rgba(240, 160, 110, .45); }
.podio-nome { display: block; font: 800 1.15rem var(--fonte-tit); color: var(--prata); word-break: break-word; }
.p1 .podio-nome { font-size: 1.35rem; }
.podio-classe { display: block; color: var(--texto-2); font-size: .85rem; margin-bottom: 6px; }
.podio-valor { font-weight: 700; color: var(--azul-claro); font-size: .95rem; }
.p1 .podio-valor { color: var(--ouro); text-shadow: 0 0 12px rgba(255, 209, 102, .45); }

.tabela { border-radius: var(--raio); overflow: hidden; }
.tabela table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.tabela th, .tabela td { padding: 13px 14px; text-align: left; border-bottom: 1px solid var(--borda); vertical-align: middle; }
.tabela th { font: 700 .7rem "Inter", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--texto-2); background: rgba(255, 255, 255, .03); }
.tabela tbody tr:last-child td { border-bottom: 0; }
.tabela tbody tr { transition: background .15s; }
.tabela tbody tr:hover td { background: rgba(63, 160, 255, .07); }
.tabela .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tabela .pos { width: 56px; text-align: center; font: 800 .95rem var(--fonte-marca); color: var(--texto-2); }
.tabela tbody tr:nth-child(1) td.pos { color: var(--ouro); text-shadow: 0 0 10px rgba(255, 209, 102, .6); }
.tabela tbody tr:nth-child(2) td.pos { color: #e6ecf8; }
.tabela tbody tr:nth-child(3) td.pos { color: #f0b98a; }
.cel-nome { display: flex; align-items: center; gap: 12px; color: var(--prata); text-decoration: none; font-weight: 600; min-width: 0; }
.cel-nome > span { display: flex; flex-direction: column; min-width: 0; }
.cel-nome small { color: var(--texto-2); font-weight: 400; font-size: .82rem; }
.cel-nome:hover > span { color: #fff; text-decoration: underline; }

/* ---------- Perfil ---------- */
.perfil-cab { position: relative; padding: 56px 0 46px; overflow: hidden; isolation: isolate; border-bottom: 1px solid var(--borda); }
.perfil-cab::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 50% 140% at 12% 0%, rgba(43, 109, 255, .3), transparent 70%), radial-gradient(ellipse 40% 120% at 90% 100%, rgba(155, 92, 255, .2), transparent 70%); }
.perfil-topo { display: flex; align-items: center; gap: 30px; }
.perfil-id h1 { font-size: clamp(2.1rem, 6vw, 3.3rem); word-break: break-word; text-shadow: 0 0 30px rgba(63, 160, 255, .35); }
.perfil-sub { color: var(--texto-2); margin: 6px 0 10px; font-size: 1.05rem; }
.perfil-sub a { color: var(--ciano); }
.selos { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.selo-p { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 999px; font-size: .74rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; border: 1px solid; }
.selo-p .ico { width: 14px; height: 14px; }
.selo-gm { color: var(--ciano); border-color: rgba(38, 232, 255, .5); background: rgba(38, 232, 255, .1); }
.selo-bloq { color: #ffadc0; border-color: rgba(255, 77, 109, .5); background: rgba(255, 77, 109, .1); }
.selo-top { color: var(--ouro); border-color: rgba(255, 209, 102, .5); background: rgba(255, 209, 102, .08); }
.online-tag { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: .9rem; font-weight: 600; color: var(--texto-2); }
.online-tag span { width: 9px; height: 9px; border-radius: 50%; background: var(--texto-2); }
.online-tag.on { color: var(--verde); }
.online-tag.on span { background: var(--verde); box-shadow: 0 0 10px var(--verde); }
.perfil-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 28px; }
.pstat { border-radius: var(--raio); padding: 18px; }
.pstat span { display: block; font: 700 .7rem "Inter", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-2); }
.pstat strong { display: block; font: 800 1.6rem var(--fonte-marca); color: #fff; margin-top: 6px; text-shadow: 0 0 16px rgba(63, 160, 255, .45); }
.pstat small { color: var(--texto-2); font-size: .8rem; }
.perfil-grade, .grade-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.painel-box { border-radius: var(--raio); padding: 24px; min-width: 0; }
.painel-box h2, .painel-box h3 { display: flex; align-items: center; gap: 10px; font-size: 1.2rem; margin: 0 0 16px; }
.painel-box h2 .ico, .painel-box h3 .ico { color: var(--ciano); width: 20px; height: 20px; }
.painel-box p:last-child { margin-bottom: 0; }
.guild-linha { display: flex; align-items: center; gap: 14px; padding: 12px; border-radius: 12px; background: rgba(255, 255, 255, .04); border: 1px solid var(--borda); color: inherit; text-decoration: none; }
.guild-linha > span { flex: 1; display: flex; flex-direction: column; }
.guild-linha strong { color: var(--prata); font-size: 1.05rem; }
.guild-linha small { color: var(--texto-2); }
.guild-linha:hover { border-color: var(--azul); }
.atributos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; }
.atributos div { background: rgba(255, 255, 255, .04); border: 1px solid var(--borda); border-radius: 12px; padding: 10px 14px; }
.atributos dt { color: var(--texto-2); font-size: .8rem; }
.atributos dd { margin: 0; font: 700 1.1rem "Inter", sans-serif; color: var(--prata); font-variant-numeric: tabular-nums; }
.acoes-perfil { margin-top: 32px; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.membros { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.membro { display: flex; align-items: center; gap: 14px; padding: 14px; border-radius: 14px; text-decoration: none; color: inherit; transition: border-color .2s, transform .2s; }
a.membro:hover { border-color: rgba(63, 160, 255, .5); transform: translateY(-2px); }
.membro-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.membro-info strong { color: var(--prata); overflow: hidden; text-overflow: ellipsis; }
.membro-info small { color: var(--texto-2); font-size: .82rem; }
.cargo { flex: none; font-size: .66rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 3px 9px; border-radius: 999px; color: var(--texto-2); border: 1px solid var(--borda-2); }
.cargo-gm { color: var(--ouro); border-color: rgba(255, 209, 102, .5); }
.cargo-ass { color: var(--ciano); border-color: rgba(38, 232, 255, .5); }
.busca { display: flex; gap: 10px; max-width: 480px; margin: 22px auto 0; }
.busca input { flex: 1; min-height: 48px; padding: 0 16px; border-radius: 12px; border: 1px solid var(--borda-2); background: rgba(255, 255, 255, .05); color: var(--texto); font: 400 1rem "Inter", sans-serif; }
.busca input:focus-visible { outline: none; border-color: var(--azul); box-shadow: 0 0 0 3px rgba(63, 160, 255, .25), 0 0 22px -6px var(--azul-glow); }

/* ---------- Caixas e estados ---------- */
.caixa-info { display: flex; gap: 14px; align-items: flex-start; margin-top: 32px; padding: 18px 20px; border-radius: var(--raio); border-color: rgba(63, 160, 255, .3); background: linear-gradient(160deg, rgba(43, 109, 255, .12), rgba(155, 92, 255, .05)); }
.caixa-info > .ico { width: 22px; height: 22px; color: var(--ciano); margin-top: 2px; }
.caixa-info strong { color: var(--prata); }
.caixa-info p { margin: 4px 0 0; color: var(--texto-2); font-size: .95rem; }
.caixa-info.pequena { margin: 0 0 22px; }
.vazio { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; padding: 48px 16px; border-radius: var(--raio); border: 1px dashed var(--borda-2); background: rgba(255, 255, 255, .02); color: var(--texto-2); }
.vazio .ico { width: 32px; height: 32px; color: var(--ciano); filter: drop-shadow(0 0 8px rgba(38, 232, 255, .5)); }
.vazio p { margin: 0; max-width: 460px; }
.alerta-box { border-color: rgba(255, 77, 109, .3); }
.alerta-box h3 .ico { color: var(--vermelho); }
.equipe-info { margin-top: 28px; }

/* ---------- Atalhos, cards, sistemas ---------- */
.atalhos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.atalho { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "ico tit" "ico txt"; gap: 2px 16px; align-items: center; padding: 22px; border-radius: 18px; text-decoration: none; transition: border-color .2s, transform .2s, box-shadow .2s; }
.atalho:hover { border-color: rgba(63, 160, 255, .55); transform: translateY(-3px); box-shadow: 0 20px 50px -24px var(--azul-glow); }
.atalho .ico { grid-area: ico; width: 50px; height: 50px; padding: 12px; border-radius: 14px; color: #fff; background: var(--grad-btn); box-shadow: 0 8px 24px -8px var(--roxo-glow); }
.atalho strong { grid-area: tit; font: 700 1.1rem var(--fonte-tit); color: var(--prata); }
.atalho span { grid-area: txt; color: var(--texto-2); font-size: .9rem; }
.cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.card { border-radius: 18px; padding: 26px; transition: border-color .2s, transform .2s, box-shadow .2s; }
.card:hover { border-color: rgba(155, 92, 255, .5); transform: translateY(-3px); box-shadow: 0 20px 50px -24px var(--roxo-glow); }
.card-ico { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; margin-bottom: 16px; color: var(--ciano); background: linear-gradient(160deg, rgba(38, 232, 255, .18), rgba(155, 92, 255, .14)); border: 1px solid rgba(38, 232, 255, .3); box-shadow: 0 0 22px -8px rgba(38, 232, 255, .6); }
.card-ico .ico { width: 24px; height: 24px; }
.card h3 { font-size: 1.15rem; margin-bottom: 8px; }
.card p { margin: 0; color: var(--texto-2); font-size: .95rem; }
.sistemas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sistema { display: flex; gap: 14px; align-items: flex-start; padding: 16px; border-radius: 14px; }
.sistema > .ico { width: 40px; height: 40px; padding: 9px; border-radius: 12px; color: var(--ciano); background: rgba(38, 232, 255, .1); border: 1px solid rgba(38, 232, 255, .25); }
.sistema strong { display: block; color: var(--prata); }
.sistema span { color: var(--texto-2); font-size: .9rem; }

/* FAQ */
.faq { display: grid; gap: 10px; }
.faq details { border-radius: 14px; transition: border-color .2s; }
.faq details[open] { border-color: rgba(63, 160, 255, .45); box-shadow: 0 0 30px -14px var(--azul-glow); }
.faq summary { cursor: pointer; list-style: none; padding: 18px 54px 18px 20px; font-weight: 600; color: var(--prata); position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; display: grid; place-items: center; border-radius: 8px; font-size: 1.2rem; color: var(--ciano); border: 1px solid rgba(38, 232, 255, .35); transition: transform .2s; }
.faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq details p { margin: 0; padding: 0 20px 18px; color: var(--texto-2); }

/* ---------- Eventos ---------- */
.eventos-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.evento { display: flex; gap: 16px; padding: 22px; border-radius: 18px; transition: border-color .2s, transform .2s; }
.evento:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--c, var(--azul)) 45%, transparent); }
.evento h3 { font-size: 1.2rem; margin-bottom: 6px; }
.evento p { color: var(--texto-2); font-size: .95rem; }
.evento-ico { flex: none; width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; --c: var(--azul); color: var(--c); background: color-mix(in srgb, var(--c) 14%, transparent); border: 1px solid color-mix(in srgb, var(--c) 40%, transparent); box-shadow: 0 0 24px -8px var(--c); }
.evento-ico .ico { width: 26px; height: 26px; }
.ev-vermelho { --c: #ff4d6d; } .ev-roxo { --c: var(--roxo); } .ev-azul { --c: var(--azul); } .ev-verde { --c: var(--verde); } .ev-ouro { --c: var(--ouro); }
.evento-tags { display: flex; gap: 6px; flex-wrap: wrap; margin: 0; }
.evento-tags span { font-size: .74rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; color: var(--texto); background: rgba(255, 255, 255, .05); border: 1px solid var(--borda-2); }
.eventos-lista { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ev-item { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "tit cmd" "txt txt"; gap: 4px 12px; padding: 16px 18px; border-radius: 14px; border-left: 3px solid var(--roxo); }
.ev-item strong { grid-area: tit; color: var(--prata); }
.ev-item span { grid-area: txt; color: var(--texto-2); font-size: .92rem; }
.ev-item code { grid-area: cmd; align-self: center; }
.passos { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.passos li { border-radius: 14px; padding: 18px; }

/* ---------- Informações e guia ---------- */
.sumario { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 8px; }
.sumario a { padding: 7px 14px; border-radius: 999px; font-size: .88rem; font-weight: 600; text-decoration: none; color: var(--texto); border: 1px solid var(--borda-2); background: rgba(255, 255, 255, .04); transition: .2s; }
.sumario a:hover { border-color: var(--azul); color: #fff; box-shadow: 0 0 16px -6px var(--azul-glow); }
.tabela-simples { width: 100%; border-collapse: collapse; }
.tabela-simples th, .tabela-simples td { padding: 10px 0; border-bottom: 1px solid var(--borda); text-align: left; vertical-align: top; font-size: .95rem; }
.tabela-simples tr:last-child th, .tabela-simples tr:last-child td { border-bottom: 0; }
.tabela-simples th { color: var(--texto-2); font-weight: 500; width: 46%; padding-right: 12px; }
.tabela-simples td { color: var(--prata); font-weight: 600; }
.comandos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.cmd-grupo { border-radius: var(--raio); padding: 22px; }
.cmd-grupo h3 { font-size: 1.1rem; margin-bottom: 12px; color: var(--ciano); }
.cmd-grupo dl { margin: 0; display: grid; gap: 0; }
.cmd-grupo dl > div { display: grid; grid-template-columns: minmax(130px, auto) 1fr; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--borda); align-items: baseline; }
.cmd-grupo dl > div:last-child { border-bottom: 0; }
.cmd-grupo dd { margin: 0; color: var(--texto-2); font-size: .92rem; }
.trilha { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.trilha li { display: flex; gap: 14px; padding: 22px; border-radius: 18px; }
.trilha-n { flex: none; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; font: 800 .95rem var(--fonte-marca); color: #fff; background: var(--grad-btn); box-shadow: 0 6px 20px -6px var(--roxo-glow); }
.trilha strong { display: block; color: var(--prata); margin-bottom: 4px; font-size: 1.05rem; }
.trilha p { color: var(--texto-2); font-size: .93rem; margin: 0 0 8px; }
.classes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.classe-card { display: flex; gap: 18px; align-items: center; padding: 22px; border-radius: 18px; transition: transform .2s, border-color .2s; }
.classe-card:hover { transform: translateY(-3px); border-color: var(--borda-2); }
.classe-card h3 { font-size: 1.2rem; margin-bottom: 6px; }
.classe-card h3 small { font: 500 .85rem "Inter", sans-serif; color: var(--texto-2); }
.classe-card p { margin: 0; color: var(--texto-2); font-size: .94rem; }
.classe-card b { color: var(--prata); }
.guia-dicas { margin-top: 32px; }
.lista-check { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.lista-check li { position: relative; padding-left: 32px; }
.lista-check li::before { content: "✓"; position: absolute; left: 0; top: 2px; width: 21px; height: 21px; border-radius: 7px; display: grid; place-items: center; font-size: .72rem; font-weight: 800; color: #fff; background: var(--grad-btn); box-shadow: 0 0 12px -2px var(--roxo-glow); }
.alerta-box .lista-check li::before { content: "!"; background: #c0304d; box-shadow: 0 0 12px -2px rgba(255, 77, 109, .6); }
.lista-num { margin: 0; padding-left: 20px; display: grid; gap: 10px; color: var(--texto-2); }
.lista-num strong { color: var(--prata); }
.lista-links { margin: 0; padding-left: 20px; display: grid; gap: 6px; }

/* Regras */
.regras { margin: 0; padding: 0; list-style: none; counter-reset: r; }
.regras[start="5"] { counter-reset: r 4; }
.regras[start="10"] { counter-reset: r 9; }
.regras li { counter-increment: r; position: relative; padding: 14px 0 14px 54px; border-bottom: 1px solid var(--borda); }
.regras li::before { content: counter(r); position: absolute; left: 0; top: 12px; width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; font: 800 .85rem var(--fonte-marca); color: var(--ciano); border: 1px solid rgba(38, 232, 255, .4); background: rgba(38, 232, 255, .08); box-shadow: 0 0 16px -6px rgba(38, 232, 255, .6); }

/* ---------- Downloads ---------- */
.secao-download { overflow: hidden; isolation: isolate; }
.secao-download::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 50% 70% at 50% 100%, rgba(155, 92, 255, .28), transparent 70%), radial-gradient(ellipse 40% 50% at 20% 80%, rgba(43, 109, 255, .2), transparent 70%); }
.cta-plataformas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; max-width: 840px; margin: 0 auto; }
.cta-plat { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 28px 16px; border-radius: 20px; text-decoration: none; transition: transform .2s, border-color .2s, box-shadow .2s; }
.cta-plat:hover { transform: translateY(-4px); border-color: rgba(63, 160, 255, .6); box-shadow: 0 24px 60px -24px var(--azul-glow); }
.cta-plat .ico { width: 40px; height: 40px; color: var(--ciano); filter: drop-shadow(0 0 10px rgba(38, 232, 255, .55)); }
.cta-plat strong { font: 800 1.15rem var(--fonte-tit); color: var(--prata); }
.cta-plat small { color: var(--texto-2); }
.sub-cta { font-size: 1.25rem; margin: 48px 0 16px; }
.sociais { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.sociais.esq { justify-content: flex-start; }
.plataformas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.plat { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; border-radius: 20px; padding: 32px 20px 24px; scroll-margin-top: 90px; transition: border-color .2s, box-shadow .2s; }
.plat:target, .plat:hover { border-color: rgba(63, 160, 255, .55); box-shadow: 0 0 50px -16px var(--azul-glow); }
.plat > .ico { width: 48px; height: 48px; color: var(--ciano); filter: drop-shadow(0 0 12px rgba(38, 232, 255, .55)); }
.plat h2 { font-size: 1.4rem; }
.plat p { margin: 0 0 6px; color: var(--texto-2); font-size: .95rem; flex: 1; }
.plat .btn { width: 100%; }
.plat small { color: var(--texto-2); font-size: .8rem; min-height: 1.2em; }
.instalar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }

/* ---------- Formulário de cadastro ---------- */
.cadastro-sec { overflow: hidden; isolation: isolate; }
.cadastro-sec::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 45% 70% at 80% 30%, rgba(155, 92, 255, .22), transparent 70%), radial-gradient(ellipse 40% 60% at 15% 70%, rgba(43, 109, 255, .18), transparent 70%); }
.cadastro-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; max-width: 1000px; }
.cadastro-info > p { color: var(--texto-2); font-size: 1.05rem; margin: 18px 0; }
.cadastro-info .lista-check { margin-bottom: 26px; }
.form { display: grid; gap: 16px; }
.form-card { position: relative; border-radius: 22px; padding: 30px; border-color: rgba(63, 160, 255, .3); box-shadow: 0 30px 80px -30px var(--roxo-glow), 0 1px 0 rgba(255, 255, 255, .08) inset; }
.form-card::before { content: ""; position: absolute; left: 24px; right: 24px; top: -1px; height: 2px; background: var(--grad); box-shadow: 0 0 16px var(--azul-glow); border-radius: 2px; }
.form-card h2 { font-size: 1.4rem; }
.form label { display: grid; gap: 6px; font-weight: 600; color: var(--prata); font-size: .95rem; }
.form input:not([type=checkbox]) { font: 400 1rem "Inter", sans-serif; color: var(--texto); background: rgba(0, 0, 0, .35); border: 1px solid var(--borda-2); border-radius: 12px; min-height: 50px; padding: 0 14px; width: 100%; transition: border-color .15s, box-shadow .15s; }
.form input:not([type=checkbox]):focus-visible { outline: none; border-color: var(--azul); box-shadow: 0 0 0 3px rgba(63, 160, 255, .22), 0 0 24px -6px var(--azul-glow); }
.form input[aria-invalid="true"] { border-color: var(--vermelho); box-shadow: 0 0 0 3px rgba(255, 77, 109, .18); }
.form small { font-weight: 400; color: var(--texto-2); font-size: .82rem; }
.form label.check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; color: var(--texto-2); font-size: .92rem; }
.form label.check input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--roxo); flex: none; }
.form .btn { width: 100%; }
.form-msg { margin: 0; min-height: 1.4em; text-align: center; font-weight: 600; }
.form-msg.ok { color: var(--verde); }
.form-msg.erro { color: #ff8aa0; }
.pos-cadastro { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pos-cadastro[hidden] { display: none; }
.pos-cadastro .btn { font-size: .9rem; padding: 0 10px; }
.recuperado { justify-items: center; text-align: center; }
.recuperado p { margin: 0; color: var(--texto-2); }
.recuperado strong { color: #fff; }
.recuperado-ico { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; color: #04140c; background: var(--verde); box-shadow: 0 0 0 6px rgba(56, 242, 160, .15), 0 0 34px rgba(56, 242, 160, .6); }
.recuperado-ico .ico { width: 30px; height: 30px; stroke-width: 2.6; }
.recuperado .btn { width: 100%; }
.recuperado-ico.email { color: #fff; background: var(--grad-btn); box-shadow: 0 0 0 6px rgba(155, 92, 255, .15), 0 0 34px var(--roxo-glow); }
.recuperado-ico.ruim { color: #fff; background: var(--vermelho); box-shadow: 0 0 0 6px rgba(255, 77, 109, .15), 0 0 34px rgba(255, 77, 109, .5); }
.isca { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Rodapé ---------- */
.rodape { position: relative; padding: 64px 0 0; background: linear-gradient(180deg, transparent, rgba(8, 6, 22, .85) 30%); border-top: 1px solid var(--borda); }
.rodape::before { content: ""; position: absolute; left: 15%; right: 15%; top: -1px; height: 1px; background: var(--grad); opacity: .7; box-shadow: 0 0 16px var(--azul-glow); }
.rodape-grade { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 32px; }
.rodape-marca p { color: var(--texto-2); margin: 12px 0 16px; max-width: 300px; }
.rodape-grade h4 { margin: 0 0 12px; font: 700 .76rem "Inter", sans-serif; letter-spacing: .18em; text-transform: uppercase; color: var(--ciano); }
.rodape-grade nav a { display: block; color: var(--texto-2); text-decoration: none; padding: 4px 0; transition: color .15s, transform .15s; }
.rodape-grade nav a:hover { color: #fff; transform: translateX(3px); }
.rodape-marca .sociais { justify-content: flex-start; }
.rodape-base { margin-top: 48px; padding: 22px 16px; border-top: 1px solid var(--borda); text-align: center; color: var(--texto-2); font-size: .88rem; }
.rodape-base p { margin: 4px 0; }
.rodape-base .pequeno { font-size: .8rem; opacity: .7; }

/* ---------- Página inicial no formato do MU ADT (cores neon) ---------- */
.h-hero { position: relative; isolation: isolate; overflow: hidden; }
.h-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 140px; z-index: -1; background: linear-gradient(180deg, transparent, var(--fundo)); pointer-events: none; }
.h-hero-grid { display: grid; grid-template-columns: 260px minmax(0, 1fr) 260px; align-items: center; gap: 24px; padding: 40px 16px 76px; }
.h-hero-in { display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0; }
.h-hero-in .logo { width: 100%; max-width: 620px; }
.h-tag { margin: 6px 0 24px; font: 700 clamp(.82rem, 1.25vw, 1rem)/1.4 var(--fonte-marca); letter-spacing: .3em; text-transform: uppercase; color: var(--prata); text-shadow: 0 0 18px rgba(63, 160, 255, .5); }
.h-acoes { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.h-hero-in .status { margin-top: 22px; }

/* Cards dos lados (Rei e Guilda nº 1) */
.h-champ {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 22px 18px 18px; text-align: center;
  border: 1px solid rgba(63, 160, 255, .3); border-radius: 20px;
  background: radial-gradient(90% 55% at 50% 28%, rgba(43, 109, 255, .2), transparent 70%), linear-gradient(170deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02));
  -webkit-backdrop-filter: var(--vidro); backdrop-filter: var(--vidro);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .08) inset, 0 30px 60px -30px rgba(0, 0, 0, .9), 0 0 50px -24px var(--azul-glow);
}
.h-champ::before { content: ""; position: absolute; left: 22px; right: 22px; top: -1px; height: 2px; border-radius: 2px; background: var(--grad); box-shadow: 0 0 14px var(--azul-glow); }
.h-champ.guilda { border-color: rgba(255, 61, 189, .3); background: radial-gradient(90% 55% at 50% 28%, rgba(255, 61, 189, .16), transparent 70%), linear-gradient(170deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02)); box-shadow: 0 1px 0 rgba(255, 255, 255, .08) inset, 0 30px 60px -30px rgba(0, 0, 0, .9), 0 0 50px -24px rgba(255, 61, 189, .5); }
.h-champ-tag { display: inline-flex; align-items: center; gap: 6px; padding: 6px 13px; border-radius: 999px; background: var(--grad-btn); color: #fff; font: 800 .64rem/1 "Inter", sans-serif; letter-spacing: .16em; text-transform: uppercase; box-shadow: 0 6px 20px -6px var(--roxo-glow); }
.h-champ-tag .ico { width: 13px; height: 13px; }
.h-champ.guilda .h-champ-tag { background: linear-gradient(120deg, #9b5cff, #ff3dbd); }
.h-champ-av { position: relative; margin: 18px 0 6px; }
.h-champ-av .coroa { position: absolute; top: -24px; left: 50%; transform: translateX(-50%); z-index: 2; font-size: 26px; line-height: 1; color: var(--ouro); text-shadow: 0 0 14px rgba(255, 209, 102, .9); }
.h-champ-av .medalha { position: absolute; bottom: -6px; right: -8px; z-index: 2; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: linear-gradient(180deg, #ffe7a3, var(--ouro)); color: #3b2a05; font: 800 .72rem/1 "Inter", sans-serif; box-shadow: 0 0 0 3px var(--fundo), 0 0 16px rgba(255, 209, 102, .6); }
.h-champ-nome { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 800 1.35rem/1.2 var(--fonte-tit); color: var(--prata); }
.h-champ-nome a { color: inherit; text-decoration: none; }
.h-champ-nome a:hover { color: #fff; text-shadow: 0 0 14px var(--azul-glow); }
.h-champ-meta { font-size: .82rem; color: var(--texto-2); }
.h-champ-meta.forte { font: 700 .95rem/1.2 "Inter", sans-serif; color: var(--ouro); text-shadow: 0 0 12px rgba(255, 209, 102, .35); }
.h-champ.guilda .h-champ-meta.forte { color: #ff8fd8; text-shadow: 0 0 12px rgba(255, 61, 189, .35); }
.h-champ-pe { margin-top: 4px; font: 700 .66rem/1.4 "Inter", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--ciano); }
.h-champ-lista { width: 100%; margin: 8px 0 0; padding: 0; list-style: none; counter-reset: d 1; text-align: left; }
.h-champ-lista li { display: flex; justify-content: space-between; gap: 8px; padding: 6px 4px; border-top: 1px solid var(--borda); font-size: .8rem; counter-increment: d; }
.h-champ-lista li::before { content: counter(d) "º"; width: 22px; color: var(--texto-2); font-weight: 700; }
.h-champ-lista span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.h-champ-lista a { color: var(--texto); text-decoration: none; }
.h-champ-lista em { font-style: normal; color: #ff8fd8; }
.h-champ-btn { margin-top: 12px; padding: 9px 16px; border: 1px solid var(--borda-2); border-radius: 10px; background: rgba(255, 255, 255, .04); color: var(--prata); font: 700 .7rem/1 "Inter", sans-serif; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; transition: .2s; }
.h-champ-btn:hover { border-color: var(--azul); color: #fff; box-shadow: 0 0 20px -6px var(--azul-glow); }

/* Faixa do servidor */
.h-faixa { position: relative; z-index: 2; display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 10px; margin-top: -36px; }
.h-faixa > * { border: 1px solid var(--borda-2); border-radius: 16px; background: linear-gradient(160deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .02)); -webkit-backdrop-filter: var(--vidro); backdrop-filter: var(--vidro); box-shadow: 0 24px 60px -30px rgba(43, 109, 255, .5); }
.h-online { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 12px; border-color: rgba(56, 242, 160, .35) !important; background: linear-gradient(160deg, rgba(56, 242, 160, .12), rgba(56, 242, 160, .03)) !important; }
.h-online i { width: 9px; height: 9px; border-radius: 50%; background: var(--verde); box-shadow: 0 0 0 4px rgba(56, 242, 160, .15), 0 0 14px var(--verde); animation: pulsar 2s infinite; }
.h-online b { font: 800 1.5rem/1.1 var(--fonte-marca); color: #c9ffe6; text-shadow: 0 0 16px rgba(56, 242, 160, .6); }
.h-online span { font: 700 .62rem/1 "Inter", sans-serif; letter-spacing: .2em; text-transform: uppercase; color: var(--verde); }
.h-info { display: grid; grid-template-columns: 1.6fr repeat(4, minmax(0, 1fr)); margin: 0; padding: 16px 18px; }
@media (max-width: 1360px) { .marca small { display: none; } .menu a { padding: 8px 9px; } }
.h-info div { padding: 0 14px; border-left: 1px solid var(--borda); min-width: 0; }
.h-info div:first-child { border-left: 0; }
.h-info dt { font: 700 .62rem/1 "Inter", sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--texto-2); }
.h-info dd { margin: 8px 0 0; font: 800 1rem/1.2 var(--fonte-tit); color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: 0 0 14px rgba(63, 160, 255, .45); }
.h-plat { display: flex; padding: 0 !important; overflow: hidden; }
.h-plat a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 92px; border-left: 1px solid var(--borda); color: var(--prata); font: 700 .7rem/1 "Inter", sans-serif; text-decoration: none; transition: .2s; }
.h-plat a:first-child { border-left: 0; }
.h-plat a:hover { background: rgba(63, 160, 255, .12); color: #fff; }
.h-plat .ico { width: 22px; height: 22px; color: var(--ciano); filter: drop-shadow(0 0 8px rgba(38, 232, 255, .5)); }
.h-plat a.breve { opacity: .55; }

/* Seções */
.h-sec { padding: 64px 0 0; }
.h-cab { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 22px; flex-wrap: wrap; }

/* Novidades (banner com abas) */
.h-news { display: grid; grid-template-columns: minmax(0, 1fr) 330px; border: 1px solid var(--borda-2); border-radius: 20px; overflow: hidden; background: linear-gradient(160deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .02)); -webkit-backdrop-filter: var(--vidro); backdrop-filter: var(--vidro); box-shadow: 0 30px 70px -36px var(--roxo-glow); }
.h-slides { position: relative; min-height: 400px; background: #05050f; }
.h-slide { position: absolute; inset: 0; display: block; opacity: 0; visibility: hidden; transition: opacity .6s, visibility .6s; color: inherit; text-decoration: none; }
.h-slide.on { opacity: 1; visibility: visible; }
.h-slide .img { position: absolute; inset: 0; background: #000 center/cover; }
.h-slide .img.nenhuma {
  background:
    url(/img/logo-claus.jpg) center 34%/min(520px, 70%) no-repeat,
    radial-gradient(50% 60% at 50% 38%, rgba(43, 109, 255, .35), transparent 70%),
    radial-gradient(40% 50% at 85% 10%, rgba(155, 92, 255, .35), transparent 70%),
    radial-gradient(40% 50% at 10% 90%, rgba(255, 61, 189, .2), transparent 70%), #05050f;
  background-blend-mode: screen, normal, normal, normal, normal;
}
.h-slide .cap { position: absolute; left: 0; right: 0; bottom: 0; display: grid; gap: 8px; justify-items: start; padding: 80px 28px 28px; background: linear-gradient(180deg, transparent, rgba(4, 4, 11, .9) 45%, #04040b); }
.h-slide .cap b { font: 800 clamp(1.4rem, 2.6vw, 2rem)/1.15 var(--fonte-tit); color: #fff; text-shadow: 0 2px 14px #000; }
.h-slide .cap small { max-width: 640px; font-size: .9rem; color: var(--texto-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.h-slide .mais { margin-top: 6px; padding: 11px 20px; border-radius: 10px; background: var(--grad-btn); color: #fff; font: 700 .74rem/1 "Inter", sans-serif; letter-spacing: .1em; text-transform: uppercase; box-shadow: 0 10px 26px -8px var(--roxo-glow); }
.h-barra { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255, 255, 255, .06); }
.h-barra i { display: block; height: 100%; width: 100%; transform-origin: left; background: var(--grad); box-shadow: 0 0 10px var(--azul-glow); animation: hbarra 7s linear; }
.h-news.pausado .h-barra i { animation-play-state: paused; }
@keyframes hbarra { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.h-abas { display: flex; flex-direction: column; gap: 8px; padding: 14px; border-left: 1px solid var(--borda); }
.h-abas button { display: grid; gap: 4px; padding: 12px 14px; text-align: left; border: 1px solid var(--borda); border-radius: 12px; background: rgba(255, 255, 255, .03); color: var(--texto); cursor: pointer; font: inherit; transition: background .2s, border-color .2s, box-shadow .2s; }
.h-abas button b { font: 700 .82rem/1.3 "Inter", sans-serif; text-transform: uppercase; letter-spacing: .02em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.h-abas button small { justify-self: end; font-size: .72rem; color: var(--texto-2); }
.h-abas button:hover { border-color: var(--borda-2); }
.h-abas button.on { border-color: rgba(63, 160, 255, .55); background: linear-gradient(120deg, rgba(43, 109, 255, .2), rgba(155, 92, 255, .12)); color: #fff; box-shadow: inset 3px 0 0 var(--ciano), 0 0 22px -10px var(--azul-glow); }
.h-todas { margin-top: auto; align-self: center; padding: 10px 16px; border: 1px solid var(--borda-2); border-radius: 10px; color: var(--prata); font: 600 .82rem/1 "Inter", sans-serif; text-decoration: none; }
.h-todas:hover { border-color: var(--azul); color: #fff; }

/* Rankings em colunas */
.h-rank-banner {
  position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 30px 32px; border: 1px solid var(--borda-2); border-radius: 20px;
  background: url(/img/logo-claus.jpg) right 240px center/auto 140% no-repeat, radial-gradient(60% 120% at 65% 50%, rgba(43, 109, 255, .3), transparent 70%), linear-gradient(90deg, #070716 30%, rgba(14, 10, 40, .9));
  background-blend-mode: screen, normal, normal;
}
.h-rank-banner h2 { font-size: clamp(1.9rem, 3.4vw, 2.8rem); color: #fff; text-shadow: 0 0 24px rgba(63, 160, 255, .5); }
.h-rank-banner .sobre-titulo { margin-bottom: 4px; }
.h-switch { display: flex; justify-content: center; gap: 8px; margin: 24px 0 20px; }
.h-switch button { min-width: 160px; height: 44px; padding: 0 18px; border: 1px solid var(--borda-2); border-radius: 12px; background: rgba(255, 255, 255, .04); color: var(--texto-2); font: 700 .76rem/1 "Inter", sans-serif; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; transition: .2s; }
.h-switch button:hover { color: #fff; }
.h-switch button.on { border-color: transparent; background: var(--grad-btn); color: #fff; box-shadow: 0 10px 26px -8px var(--roxo-glow); }
.h-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.h-col { border: 1px solid var(--borda); border-radius: 18px; overflow: hidden; background: linear-gradient(170deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .015)); -webkit-backdrop-filter: var(--vidro); backdrop-filter: var(--vidro); transition: border-color .2s, transform .2s, box-shadow .2s; }
.h-col:hover { border-color: rgba(63, 160, 255, .45); transform: translateY(-3px); box-shadow: 0 24px 50px -26px var(--azul-glow); }
.h-col h3 { padding: 13px 10px; text-align: center; font: 700 .78rem/1 "Inter", sans-serif; letter-spacing: .16em; text-transform: uppercase; background: linear-gradient(120deg, rgba(43, 109, 255, .22), rgba(155, 92, 255, .16)); border-bottom: 1px solid var(--borda-2); color: var(--ciano); }
.h-col h3 a { color: inherit; text-decoration: none; }
.h-top { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 22px 12px 16px; text-align: center; text-decoration: none; }
.h-top .av, .h-top .gmark { margin-bottom: 6px; }
.h-top b { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 800 1.15rem/1.2 var(--fonte-tit); color: #fff; }
.h-top small { font: 700 .7rem/1 "Inter", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--ouro); text-shadow: 0 0 10px rgba(255, 209, 102, .4); }
a.h-top:hover b { text-shadow: 0 0 14px var(--azul-glow); }
.h-col ol { margin: 0; padding: 0 0 8px; list-style: none; counter-reset: r 1; }
.h-col li { display: flex; justify-content: space-between; gap: 8px; padding: 8px 14px; border-top: 1px solid var(--borda); font-size: .84rem; counter-increment: r; }
.h-col li::before { content: counter(r) "º"; width: 22px; color: var(--texto-2); font-weight: 700; }
.h-col li a { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--texto); text-decoration: none; }
.h-col li a:hover { color: #fff; }
.h-col li span { color: var(--texto-2); font-variant-numeric: tabular-nums; }
.h-gm { margin: 0 0 16px; text-align: center; font-size: .8rem; color: var(--texto-2); }
.h-vazio { margin: 0; padding: 34px 14px; text-align: center; color: var(--texto-2); font-size: .88rem; }
.h-vazio.largo { border: 1px dashed var(--borda-2); border-radius: 16px; }

/* Atalhos */
.h-rapido { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.h-rapido a { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 24px 10px; text-align: center; border: 1px solid var(--borda); border-radius: 18px; background: linear-gradient(170deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .015)); text-decoration: none; transition: border-color .2s, transform .2s, box-shadow .2s; }
.h-rapido a:hover { border-color: rgba(63, 160, 255, .55); transform: translateY(-3px); box-shadow: 0 20px 44px -24px var(--azul-glow); }
.h-rapido .ico { width: 44px; height: 44px; padding: 10px; border-radius: 14px; color: #fff; background: var(--grad-btn); box-shadow: 0 8px 22px -8px var(--roxo-glow); }
.h-rapido b { font: 700 .76rem/1 "Inter", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--prata); }
.h-rapido small { font-size: .76rem; color: var(--texto-2); }

/* Perguntas */
.h-faq-lista { display: grid; gap: 10px; max-width: 860px; margin: 0 auto; }
.h-faq details { border: 1px solid var(--borda); border-radius: 14px; background: linear-gradient(170deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .015)); transition: border-color .2s, box-shadow .2s; }
.h-faq details[open] { border-color: rgba(63, 160, 255, .45); box-shadow: 0 0 30px -14px var(--azul-glow); }
.h-faq summary { display: flex; align-items: center; gap: 14px; padding: 17px 20px; cursor: pointer; list-style: none; font: 700 .86rem/1.3 "Inter", sans-serif; text-transform: uppercase; letter-spacing: .04em; color: var(--prata); }
.h-faq summary::-webkit-details-marker { display: none; }
.h-faq summary::after { content: "+"; margin-left: auto; font-size: 1.3rem; color: var(--ciano); }
.h-faq details[open] summary::after { content: "–"; }
.h-faq summary span { font: 800 1.2rem/1 var(--fonte-marca); background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.h-faq details p { margin: 0; padding: 0 20px 18px 58px; color: var(--texto-2); }

/* Baixe agora / Comunidade */
.h-cta { display: grid; grid-template-columns: 1fr 1fr; margin-top: 80px; border-top: 1px solid var(--borda-2); }
.h-cta .metade { position: relative; isolation: isolate; display: flex; align-items: center; padding: 64px 7vw; min-height: 400px; overflow: hidden; }
.h-cta .metade::before { content: ""; position: absolute; inset: 0; z-index: -2; background: url(/img/logo-claus.jpg) center/140% auto no-repeat; opacity: .18; mix-blend-mode: screen; }
.h-cta .jogar { justify-content: flex-end; }
.h-cta .jogar::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(70% 80% at 80% 50%, rgba(43, 109, 255, .35), transparent 70%), linear-gradient(135deg, rgba(10, 18, 60, .92), rgba(6, 6, 20, .96)); }
.h-cta .comunidade { border-left: 1px solid var(--borda-2); }
.h-cta .comunidade::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(70% 80% at 20% 50%, rgba(155, 92, 255, .35), transparent 70%), radial-gradient(50% 60% at 90% 90%, rgba(255, 61, 189, .2), transparent 70%), linear-gradient(135deg, rgba(14, 6, 30, .96), rgba(30, 8, 40, .92)); }
.h-cta p { margin: 0; font: 700 clamp(1rem, 1.8vw, 1.3rem)/1 var(--fonte-tit); color: var(--ciano); text-shadow: 0 0 14px rgba(38, 232, 255, .5); }
.h-cta .comunidade p { color: #ff8fd8; text-shadow: 0 0 14px rgba(255, 61, 189, .5); }
.h-cta h2 { margin: 6px 0 24px; font-size: clamp(2.2rem, 4.4vw, 3.6rem); color: #fff; text-shadow: 0 0 30px rgba(63, 160, 255, .45); }
.h-cta .lista { display: grid; gap: 10px; width: min(320px, 100%); }
.h-cta .lista > * { display: flex; align-items: center; justify-content: space-between; height: 56px; padding: 0 20px; border: 1px solid var(--borda-2); border-radius: 12px; background: rgba(4, 4, 11, .6); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: var(--prata); font: 700 .8rem/1 "Inter", sans-serif; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; transition: border-color .2s, background .2s, box-shadow .2s; }
.h-cta .lista > a:hover { border-color: var(--azul); background: rgba(43, 109, 255, .16); box-shadow: 0 0 24px -8px var(--azul-glow); }
.h-cta .comunidade .lista > a:hover { border-color: var(--magenta); background: rgba(255, 61, 189, .12); box-shadow: 0 0 24px -8px rgba(255, 61, 189, .6); }
.h-cta .lista .ico { width: 20px; height: 20px; color: var(--ciano); }
.h-cta .lista em { font-style: normal; font-size: .66rem; letter-spacing: .12em; color: var(--texto-2); }
.h-cta .lista .breve { opacity: .6; }
.h-cta + .rodape { border-top: 0; }

@media (max-width: 1100px) {
  .h-faixa { grid-template-columns: 1fr 1fr; }
  .h-info { grid-column: 1 / -1; order: -1; }
  .h-plat a { flex: 1; width: auto; }
  .h-rapido { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1000px) {
  .h-hero-grid { grid-template-columns: 1fr 1fr; gap: 14px; align-items: stretch; }
  .h-hero-grid .h-hero-in { grid-column: 1 / -1; order: -1; margin-bottom: 8px; }
  .h-champ { justify-content: flex-start; }
  .h-champ .h-champ-btn { margin-top: auto; }
  .h-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .h-news { grid-template-columns: 1fr; }
  .h-slides { min-height: 0; aspect-ratio: 16 / 10; }
  .h-abas { border-left: 0; border-top: 1px solid var(--borda); flex-direction: row; overflow-x: auto; }
  .h-abas button { flex: 0 0 210px; }
  .h-todas { margin: auto 0; flex: none; }
  .h-cta { grid-template-columns: 1fr; }
  .h-cta .metade, .h-cta .jogar { justify-content: center; padding: 48px 20px; min-height: 0; }
  .h-cta .comunidade { border-left: 0; border-top: 1px solid var(--borda-2); }
}
@media (max-width: 640px) {
  .h-hero-grid { padding: 28px 16px 64px; }
  .h-champ { padding: 18px 10px 14px; border-radius: 16px; }
  .h-champ-nome { font-size: 1.05rem; }
  .h-champ .av-g, .h-champ .gmark-g { width: 66px; height: 66px; font-size: 1rem; }
  .h-champ-lista { display: none; }
  .h-champ-tag { font-size: .56rem; padding: 5px 9px; letter-spacing: .1em; }
  .h-champ-pe { font-size: .58rem; }
  .h-faixa { margin-top: -30px; }
  .h-info { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 14px; padding: 14px 8px; }
  .h-info div { padding: 0 10px; }
  .h-info div:first-child { grid-column: 1 / -1; text-align: center; }
  .h-info div:nth-child(2n) { border-left: 0; }
  .h-info dd { font-size: .9rem; }
  .h-cols { grid-template-columns: 1fr; }
  .h-rank-banner { flex-direction: column; align-items: flex-start; padding: 24px 20px; background-position: right -30px top 6px, 65% 50%, 0 0; background-size: auto 70%, auto, auto; }
  .h-switch button { min-width: 0; flex: 1; padding: 0 8px; letter-spacing: .08em; }
  .h-slide .cap { padding: 50px 18px 20px; }
  .h-slide .cap small { display: none; }
  .h-rapido { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .h-faq details p { padding-left: 20px; }
}

/* ---------- Responsivo ---------- */
@media (max-width: 1120px) {
  .menu-btn { display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 0 10px; background: rgba(255, 255, 255, .04); border: 1px solid var(--borda-2); border-radius: 12px; cursor: pointer; }
  .menu-btn span { display: block; height: 2px; background: var(--prata); border-radius: 2px; transition: .2s; }
  .menu-btn[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-btn[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .menu-btn[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .menu { display: none; position: absolute; left: 0; right: 0; top: 70px; flex-direction: column; align-items: stretch; gap: 0; background: rgba(6, 6, 16, .96); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); border-bottom: 1px solid var(--borda); padding: 8px 16px 18px; max-height: calc(100vh - 70px); overflow-y: auto; }
  .menu.aberto { display: flex; }
  .menu a { padding: 13px 8px; border-bottom: 1px solid var(--borda); border-radius: 0; }
  .menu a.ativo { box-shadow: inset 3px 0 0 var(--azul); padding-left: 14px; }
  .menu a.ativo::after { display: none; }
  .menu-sep { display: none; }
  .menu a.menu-conta { justify-content: center; border-radius: 12px; margin-top: 14px; border: 1px solid var(--borda-2); }
  .menu a.menu-cta { justify-content: center; margin: 10px 0 0; border-radius: 12px; border: 0; }
  .numeros { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .numero:nth-child(4) { border-left: 0; }
  .numero:nth-child(n+4) { border-top: 1px solid var(--borda); }
  .mini-rankings { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wrap.numeros { margin: 0 16px; }
}
@media (max-width: 900px) {
  .destaques { grid-template-columns: 1fr 1fr; }
  .destaque-meio { grid-column: 1 / -1; order: 3; }
  .noticias-home, .cadastro-grade { grid-template-columns: 1fr; }
  .cadastro-grade { gap: 32px; }
  .cards, .atalhos, .sistemas, .trilha, .instalar { grid-template-columns: 1fr 1fr; }
  .comandos, .eventos-grade, .eventos-lista, .classes { grid-template-columns: 1fr; }
  .plataformas, .passos { grid-template-columns: 1fr; max-width: 520px; margin-left: auto; margin-right: auto; }
  .rodape-grade { grid-template-columns: 1fr 1fr; }
  .rodape-marca { grid-column: 1 / -1; }
  .hero-orbe.o1 { width: 380px; height: 380px; margin-left: -190px; margin-top: -190px; }
}
@media (max-width: 640px) {
  .topo-inner { height: 62px; }
  .menu { top: 62px; max-height: calc(100vh - 62px); }
  .marca { font-size: 1.1rem; }
  .marca small { display: none; }
  .secao { padding: 64px 0; }
  .secao-curta { padding: 36px 0 56px; }
  .pg-cab { padding: 48px 0 36px; }
  .hero { min-height: auto; padding: 48px 16px 88px; }
  .hero-sub { font-size: 1.02rem; }
  .hero-acoes .btn { width: 100%; }
  .hero-orbe { filter: blur(50px); }
  .hero-orbe.o1 { width: 280px; height: 280px; margin-left: -140px; margin-top: -140px; }
  .hero-orbe.o2, .hero-orbe.o3 { width: 220px; height: 220px; }
  .faixa-numeros { margin-top: -40px; }
  .numeros { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .numero { padding: 16px 8px; }
  .numero strong { font-size: 1.1rem; }
  .numero:nth-child(odd) { border-left: 0; }
  .numero:nth-child(4) { border-left: 1px solid var(--borda); }
  .numero:nth-child(n+3) { border-top: 1px solid var(--borda); }
  .destaques { grid-template-columns: 1fr; }
  .destaque-meio { order: 0; }
  .mini-rankings { grid-template-columns: 1fr; }
  .cards, .atalhos, .sistemas, .trilha, .instalar, .grade-2, .perfil-grade, .cta-plataformas { grid-template-columns: 1fr; }
  .podio { grid-template-columns: 1fr; max-width: 360px; gap: 28px; }
  .podio .p1 { order: -1; }
  .abas { border-radius: 18px; }
  .tabela th, .tabela td { padding: 10px 8px; font-size: .9rem; }
  .tabela .pos { width: 36px; }
  .col-esconde { display: none; }
  .cel-nome { gap: 8px; }
  .perfil-topo { flex-direction: column; text-align: center; gap: 16px; }
  .selos { justify-content: center; }
  .perfil-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pstat strong { font-size: 1.3rem; }
  .cmd-grupo dl > div { grid-template-columns: 1fr; gap: 4px; }
  .rodape-grade { grid-template-columns: 1fr 1fr; gap: 24px; }
  .secao-topo .mudo { text-align: left; }
  .busca { flex-direction: column; }
  .classe-card { flex-direction: column; text-align: center; }
  .destaque-acoes, .pos-cadastro { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body::before, .hero-orbe, .hero-chao, .logo::before, .neon-txt, .status.on .status-ponto { animation: none; }
  .js .rv { opacity: 1; transform: none; transition: none; }
  video.hero-video { display: none; }
  .btn, .noticia, .atalho, .podio-item, .cta-plat, .card, .destaque-card { transition: none; }
}
