/* MU GAME Hard: página da estreia (inauguracao.html). Mesmo visual claro do site: papel, placas brancas, linhas finas,
   cantoneiras, vermelho só como sinal e dourado nos detalhes. Os palcos 3D são claros, com luz quente e sombra no chão. */
.body.ig-body { display: block; }
.ig { --ig-luz: 255, 196, 140; display: grid; gap: 22px; color: var(--ink-2); }
.ig *, .ig *::before, .ig *::after { box-sizing: border-box; }
.ig [hidden] { display: none !important; }
.ig h1, .ig h2, .ig h3, .ig p { margin: 0; }
.ig b { color: var(--ink); font-weight: 600; }

/* ---------------- palco 3D claro: foto pronta atrás, o modelo por cima quando chega */
.ig-3d { --palco: radial-gradient(60% 50% at 50% 46%, rgba(var(--ig-luz), .5), rgba(var(--ig-luz), 0) 72%), linear-gradient(180deg, #fafbfc, #eceff2);
  position: relative; isolation: isolate; background: var(--foto, none) var(--fpos, 50% 80%) / var(--fsz, auto 80%) no-repeat, var(--palco); }
.ig-3d canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.ig-chao { position: absolute; left: 50%; bottom: 7%; width: 60%; height: 12%; transform: translateX(-50%); border-radius: 50%; pointer-events: none; z-index: -1;
  background: radial-gradient(closest-side, rgba(20, 26, 32, .32), rgba(20, 26, 32, .12) 55%, transparent); }

/* ---------------- abertura */
.ig-abre { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); min-height: 460px;
  background: var(--plate); border: 1px solid var(--line); border-top: 3px solid var(--red); }
.ig-abre::after { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 37.5%; z-index: -1; pointer-events: none;
  background: radial-gradient(60% 52% at 52% 44%, rgba(var(--ig-luz), .55), rgba(var(--ig-luz), 0) 72%),
    radial-gradient(70% 30% at 50% 92%, rgba(211, 18, 44, .08), transparent 70%), linear-gradient(180deg, #fbfbfc, #eef1f4);
  border-left: 1px solid var(--line); }
.ig-abre-txt { display: flex; flex-direction: column; justify-content: center; gap: 14px; padding: 30px 26px 32px 34px; }
.ig-crumbs { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-3); }
.ig-crumbs a:hover { color: var(--red); }
.ig-crumbs .i { width: 12px; height: 12px; }
.ig-pre { display: inline-flex; align-items: center; gap: 8px; font: 600 14px var(--f-disp); letter-spacing: .16em; text-transform: uppercase; color: var(--red); }
.ig-pre i { width: 8px; height: 8px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 4px var(--red-soft); }
.ig-abre h1 { font: 700 58px/.95 var(--f-disp); letter-spacing: .02em; text-transform: uppercase; color: var(--ink); }
.ig-abre h1 span { display: block; margin-top: 8px; font-size: 22px; font-weight: 600; letter-spacing: .14em; color: var(--gold); }
.ig-data { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.ig-data b { font: 700 28px/1.1 var(--f-disp); letter-spacing: .02em; color: var(--ink); }
.ig-data span { font: 500 15px var(--f-body); color: var(--ink-3); }
.ig-chama { max-width: 46ch; font-size: 15px; line-height: 1.6; color: var(--ink-2); }
/* a contagem */
.ig-conta { display: grid; grid-template-columns: repeat(4, 94px); gap: 8px; }
.ig-conta div { position: relative; display: grid; justify-items: center; gap: 2px; padding: 12px 6px 9px; background: var(--plate-2); border: 1px solid var(--line); }
.ig-conta div::before { content: ""; position: absolute; left: -1px; right: -1px; top: -1px; height: 2px; background: var(--red); }
.ig-conta b { font: 700 42px/1 var(--f-disp); color: var(--ink); font-variant-numeric: tabular-nums; }
.ig-conta span { font: 500 11px var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.ig-aberto { font: 700 22px var(--f-disp); color: var(--ok); }
.ig-obs { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-3); }
.ig-obs::before { content: ""; width: 14px; height: 1.5px; background: var(--gold); }
.ig-acoes { display: flex; flex-wrap: wrap; gap: 10px; }
.ig-abre .ig-acoes { gap: 8px; }
.ig-abre .ig-acoes .btn { padding: 0 13px; letter-spacing: .05em; font-size: 14px; }
.ig-bt-zap { background: #1faa57; color: #fff; }
.ig-bt-zap:hover { background: #158a45; }
.ig-abre-3d { --palco: none; --fsz: auto 70%; min-height: 400px; }

/* ---------------- títulos e seções */
.ig-tit { display: flex; align-items: center; gap: 12px; font: 600 20px/1 var(--f-disp); letter-spacing: .1em; text-transform: uppercase; color: var(--ink); }
.ig-tit::after { content: ""; flex: 1; height: 1px; background: var(--line-2); }
.ig-in { padding: 18px 18px 20px; display: grid; gap: 16px; }
.ig-lead { font: 600 21px/1.2 var(--f-disp); letter-spacing: .02em; color: var(--ink); }
.ig-intro { max-width: 76ch; font-size: 14px; line-height: 1.6; color: var(--ink-2); }

/* passos */
.ig-passos { display: grid; gap: 12px; }
.ig-passos ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; counter-reset: pp; }
.ig-passos li { counter-increment: pp; }
.ig-passos li > a, .ig-passo-fim { position: relative; display: grid; align-content: start; gap: 5px; height: 100%; padding: 16px 14px 15px 54px; color: inherit;
  background: var(--plate); border: 1px solid var(--line); transition: border-color .15s, transform .15s, box-shadow .15s; }
.ig-passos li > a:hover { border-color: var(--red); transform: translateY(-2px); box-shadow: 0 12px 24px -18px rgba(20, 26, 32, .5); }
.ig-passos li > a::before, .ig-passo-fim::before { content: counter(pp); position: absolute; left: 14px; top: 15px; display: grid; place-items: center; width: 28px; height: 28px;
  font: 700 16px var(--f-disp); color: #fff; background: var(--ink); clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px); }
.ig-passo-fim { background: var(--red-soft); border-color: rgba(211, 18, 44, .3); }
.ig-passo-fim::before { background: var(--red); }
.ig-passos b { font: 600 17px/1.15 var(--f-disp); letter-spacing: .04em; text-transform: uppercase; color: var(--ink); }
.ig-passos a span, .ig-passo-fim > span { font-size: 12.5px; line-height: 1.5; color: var(--ink-2); }

/* o servidor */
.ig-srv { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 22px; align-items: start; }
.ig-srv-txt { display: grid; gap: 10px; font-size: 14px; line-height: 1.65; }
.ig-ficha { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: 0; border: 1px solid var(--line); }
.ig-ficha div { padding: 8px 12px; border-bottom: 1px solid var(--line); }
.ig-ficha div:nth-child(odd) { border-right: 1px solid var(--line); }
.ig-ficha div:nth-last-child(-n+2) { border-bottom: 0; }
.ig-ficha dt { font: 500 11px var(--f-body); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.ig-ficha dd { margin: 1px 0 0; font: 600 17px/1.2 var(--f-disp); letter-spacing: .02em; color: var(--ink); }
.ig-classes { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.ig-classes li { display: grid; justify-items: center; align-content: start; gap: 4px; padding: 14px 8px 12px; text-align: center; background: var(--plate-2); border: 1px solid var(--line); }
.ig-classes img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--gold), 0 8px 16px -8px rgba(20, 26, 32, .6); margin-bottom: 4px; }
.ig-classes b { font: 600 16px/1.1 var(--f-disp); letter-spacing: .03em; text-transform: uppercase; }
.ig-classes span { font-size: 12px; line-height: 1.45; color: var(--ink-2); }

/* joias */
.ig-joias { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.ig-joias li { position: relative; display: grid; justify-items: center; align-content: start; gap: 4px; padding: 0 10px 14px; text-align: center; background: var(--plate); border: 1px solid var(--line); }
.ig-j3d { --palco: radial-gradient(50% 55% at 50% 50%, rgba(var(--ig-luz), .45), rgba(var(--ig-luz), 0) 75%), linear-gradient(180deg, #fafbfc, #eef0f3); --fsz: auto 46%; --fpos: 50% 50%;
  width: calc(100% + 20px); height: 118px; margin-bottom: 6px; border-bottom: 1px solid var(--line); }
.ig-j3d.ig-foto { background: var(--palco); }
.ig-j3d.ig-foto { display: grid; place-items: center; }
.ig-j3d.ig-foto img { width: 72px; height: 72px; object-fit: contain; filter: drop-shadow(0 6px 8px rgba(20, 60, 140, .35)); animation: igFlutua 3.2s ease-in-out infinite; }
@keyframes igFlutua { 50% { transform: translateY(-6px); } }
.ig-joias b { font: 600 16px/1.15 var(--f-disp); letter-spacing: .03em; }
.ig-joias span { font-size: 12.5px; line-height: 1.45; color: var(--ink-2); }
.ig-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ig-nota { display: grid; gap: 4px; padding: 12px 16px; background: var(--plate-2); border: 1px solid var(--line); border-left: 3px solid var(--gold); font-size: 13px; line-height: 1.55; }
.ig-nota b { font: 600 17px var(--f-disp); letter-spacing: .04em; text-transform: uppercase; }

/* black e white */
.ig-bw { grid-template-columns: 290px minmax(0, 1fr); align-items: center; gap: 24px; }
.ig-bw-3d { --fsz: auto 62%; --fpos: 50% 48%; height: 330px; border: 1px solid var(--line); }
.ig-bw-txt { display: grid; gap: 12px; font-size: 14px; line-height: 1.6; }
.ig-fontes { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ig-fontes li { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 12px; padding: 10px 12px; background: var(--plate-2); border: 1px solid var(--line); }
.ig-fontes b { font: 600 16px/1.3 var(--f-disp); letter-spacing: .03em; text-transform: uppercase; color: var(--red); }
.ig-fontes span { font-size: 13px; line-height: 1.55; }
.ig-bw-troca { display: flex; gap: 0; }
.ig-bw-troca button { height: 34px; padding: 0 20px; cursor: pointer; font: 600 14px var(--f-disp); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2);
  background: var(--plate); border: 1px solid var(--line-2); }
.ig-bw-troca button + button { border-left: 0; }
.ig-bw-troca button[aria-pressed="true"] { color: #fff; background: var(--ink); border-color: var(--ink); }
.ig-bw-set { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.ig-bw-set li { display: grid; justify-items: center; gap: 6px; text-align: center; }
.ig-bw-set li > span { display: grid; place-items: center; width: 100%; height: 86px; border: 1px solid var(--line);
  background: radial-gradient(60% 60% at 50% 45%, rgba(var(--ig-luz), .35), transparent 75%), #f2f4f6; }
.ig-bw-set.black li > span { background: radial-gradient(60% 60% at 50% 45%, rgba(255, 255, 255, .9), transparent 75%), #e6e9ed; }
.ig-bw-set.white li > span { background: radial-gradient(60% 60% at 50% 45%, rgba(60, 70, 85, .5), transparent 80%), #8d97a3; }
.ig-bw-set img { max-width: 60px; max-height: 70px; object-fit: contain; filter: drop-shadow(0 4px 5px rgba(20, 26, 32, .4)); transition: transform .2s; }
.ig-bw-set li:hover img { transform: scale(1.08); }
.ig-bw-set small { font: 500 11px/1.3 var(--f-body); color: var(--ink-2); }

.ig-link { justify-self: start; display: inline-flex; align-items: center; gap: 6px; font: 600 14px var(--f-disp); letter-spacing: .08em; text-transform: uppercase; color: var(--red); border-bottom: 1px solid rgba(211, 18, 44, .3); }
.ig-link:hover { border-color: var(--red); }

/* boxes com 3D ou ícone */
.ig-ev { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ig-nov { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ig-cx { position: relative; isolation: isolate; display: grid; grid-template-columns: 160px minmax(0, 1fr); align-items: stretch; min-height: 176px; overflow: hidden; color: inherit;
  background: var(--plate); border: 1px solid var(--line); transition: border-color .15s, transform .15s, box-shadow .15s; }
.ig-cx::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--line-2); transition: background .15s; }
.ig-cx:hover { border-color: var(--line-2); transform: translateY(-2px); box-shadow: 0 14px 26px -18px rgba(20, 26, 32, .55); }
.ig-cx:hover::after { background: var(--red); }
.ig-cx-3d { --fsz: auto 76%; position: relative; min-height: 176px; border-right: 1px solid var(--line); }
.ig-ic { background: radial-gradient(60% 50% at 50% 46%, rgba(var(--ig-luz), .45), rgba(var(--ig-luz), 0) 72%), linear-gradient(180deg, #fafbfc, #eceff2); }
.ig-cx-3d .ig-chao { width: 72%; bottom: 6%; }
.ig-ic { display: grid; place-items: center; }
.ig-ic .i { box-sizing: content-box; width: 40px; height: 40px; padding: 20px; color: var(--red); stroke-width: 1.5; background: var(--plate);
  border: 1px solid var(--line-2); border-radius: 50%; box-shadow: 0 0 0 6px rgba(255, 255, 255, .7), 0 12px 24px -14px rgba(20, 26, 32, .55); }
.ig-cx-t { display: grid; align-content: center; gap: 7px; padding: 16px 18px; }
.ig-cx-t h3 { font: 600 21px/1.1 var(--f-disp); letter-spacing: .04em; text-transform: uppercase; color: var(--ink); }
.ig-cx-t p { font-size: 13px; line-height: 1.55; color: var(--ink-2); }
.ig-ir { display: inline-flex; align-items: center; gap: 6px; justify-self: start; font: 600 14px var(--f-disp); letter-spacing: .08em; text-transform: uppercase; color: var(--red); }
.ig-ir::after { content: ""; width: 6px; height: 6px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); transition: transform .15s; }
.ig-cx:hover .ig-ir::after { transform: translateX(3px) rotate(45deg); }
.ig-cx-larga { grid-column: 1 / -1; }

/* fechamento */
.ig-fim { position: relative; isolation: isolate; display: grid; justify-items: center; gap: 14px; padding: 38px 24px 36px; text-align: center; background: var(--plate);
  border: 1px solid var(--line); border-bottom: 3px solid var(--red); }
.ig-fim::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(50% 80% at 50% 0%, rgba(var(--ig-luz), .35), transparent 70%); }
.ig-fim h2 { font: 700 40px/1 var(--f-disp); letter-spacing: .03em; text-transform: uppercase; color: var(--ink); }
.ig-fim-p { max-width: 56ch; font-size: 15px; line-height: 1.6; }
.ig-fim .ig-acoes { justify-content: center; }

@media (max-width: 860px) {
  .ig-abre { grid-template-columns: 1fr; }
  .ig-abre::after { width: 100%; top: auto; height: 320px; border-left: 0; border-top: 1px solid var(--line); }
  .ig-abre-3d { min-height: 320px; }
  .ig-srv, .ig-bw, .ig-duo { grid-template-columns: 1fr; }
  .ig-passos ol, .ig-ev, .ig-nov { grid-template-columns: 1fr 1fr; }
  .ig-joias { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ig-classes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) and (max-width: 0px) { .ig-cx, .ig-passos li > a { transition: none; } }

/* ---------- corrida de resets e prêmios desde o primeiro dia (31/10) ---------- */
.ig-cr { scroll-margin-top: 80px; }
.ig-cr .ig-in, .ig-sec .ig-in { display: grid; gap: 14px; }
.ig-cr-lead { max-width: 75ch; font-size: 14.5px; line-height: 1.6; }
.ig-cr-st { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 12px; align-items: stretch; }
.ig-cr-ficha { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0; }
.ig-cr-ficha div { padding: 10px 12px; background: var(--plate-2); border: 1px solid var(--line); }
.ig-cr-ficha dt { font-size: 12px; color: var(--ink-3); }
.ig-cr-ficha dd { margin: 3px 0 0; font: 600 17px/1.2 var(--f-disp); color: var(--ink); }
.ig-cr-vivo { display: grid; align-content: center; gap: 8px; padding: 12px 16px; background: var(--plate); border: 1px solid var(--line); border-left: 3px solid var(--red); }
.ig-cr-vivo-t { font-size: 14px; color: var(--ink-2); }
.ig-cr-vivo-t b { font: 700 22px var(--f-mono); color: var(--ink); font-variant-numeric: tabular-nums; }
.ig-cr-barra { height: 8px; overflow: hidden; background: var(--line); }
.ig-cr-barra i { display: block; height: 100%; width: 0; background: var(--red); transition: width .6s; }
.ig-cr h3 { margin: 0 0 10px; font: 600 18px var(--f-disp); letter-spacing: .02em; color: var(--ink); }
.ig-cr-pr { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ig-cr-pr li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; background: var(--plate-2); border: 1px solid var(--line); font: 600 16px var(--f-disp); color: var(--ink); }
.ig-cr-pr li img { width: 28px; height: 28px; object-fit: contain; image-rendering: pixelated; }
.ig-cr-cols { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 14px; }
.ig-cr-como ol { margin: 0; padding: 0; list-style: none; counter-reset: cr; display: grid; gap: 8px; }
.ig-cr-como li { position: relative; padding: 2px 0 2px 38px; font-size: 14px; line-height: 1.5; counter-increment: cr; }
.ig-cr-como li::before { content: counter(cr); position: absolute; left: 0; top: 0; width: 26px; height: 26px; display: grid; place-items: center;
  font: 700 14px var(--f-disp); color: #fff; background: var(--ink); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%); }
.ig-cr-como a { color: var(--red); font-weight: 600; }
.ig-cr-obs { font-size: 13px; line-height: 1.5; color: var(--ink-3); }
.ig-cr-obs:not(:first-child) { margin-top: 10px; }
.ig-cr-l { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.ig-cr-l li { display: flex; align-items: baseline; gap: 8px; min-width: 0; padding: 6px 9px; font-size: 13px; background: var(--plate-2); border: 1px dashed var(--line-2); }
.ig-cr-l li .p { flex: none; width: 26px; font: 700 13px var(--f-disp); color: var(--ink-3); }
.ig-cr-l li a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; color: var(--ink); }
.ig-cr-l li a:hover { color: var(--red); }
.ig-cr-l li small { margin-left: auto; flex: none; font-size: 11.5px; color: var(--ink-3); }
.ig-cr-l li.livre { color: var(--ink-3); font-style: italic; }
.ig-cr-l li.ok { border-style: solid; border-color: var(--line); background: var(--plate); }
.ig-cr-l li.ok .p { color: var(--red); }
.ig-val { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.ig-val li { display: grid; align-content: start; gap: 6px; padding: 14px; background: var(--plate-2); border: 1px solid var(--line); border-top: 2px solid var(--ink); }
.ig-val li > b { font: 600 17px var(--f-disp); color: var(--ink); }
.ig-val span { font-size: 13.5px; line-height: 1.5; }
@media (max-width: 1000px) { .ig-val { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .ig-cr-st, .ig-cr-cols { grid-template-columns: 1fr; } .ig-cr-ficha { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .ig-val, .ig-cr-l { grid-template-columns: 1fr; } .ig-cr-l li small { display: none; } }