/* MU GAME Hard: box da estreia no topo da coluna principal da página inicial (contagem e o caminho para inauguracao.html) */
.igh { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr) 190px; align-items: stretch; color: inherit;
  background: var(--plate); border: 1px solid var(--line); border-top: 3px solid var(--red); transition: box-shadow .15s, border-color .15s; }
.igh:hover { border-color: var(--line-2); border-top-color: var(--red); box-shadow: 0 16px 30px -22px rgba(20, 26, 32, .6); }
.igh[hidden] { display: none; }
.igh-t { display: grid; align-content: center; gap: 10px; min-width: 0; padding: 18px 10px 18px 22px; }
.igh-pre { display: inline-flex; align-items: center; gap: 8px; margin: 0; font: 600 13px var(--f-disp); letter-spacing: .16em; text-transform: uppercase; color: var(--red); }
.igh-pre i { width: 7px; height: 7px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 4px var(--red-soft); animation: igh-pt 1.6s ease-in-out infinite; }
@keyframes igh-pt { 50% { box-shadow: 0 0 0 7px rgba(211, 18, 44, .08); } }
@media (pointer: coarse) { .igh-pre i { animation: none; } }
.igh h2 { margin: 0; font: 700 30px/1 var(--f-disp); letter-spacing: .03em; text-transform: uppercase; color: var(--ink); }
.igh h2 span { display: block; margin-top: 5px; font-size: 17px; font-weight: 600; letter-spacing: .06em; color: var(--gold); }
.igh-conta { display: flex; gap: 6px; }
.igh-conta div { position: relative; display: grid; justify-items: center; min-width: 62px; padding: 7px 4px 5px; background: var(--plate-2); border: 1px solid var(--line); }
.igh-conta div::before { content: ""; position: absolute; left: -1px; right: -1px; top: -1px; height: 2px; background: var(--red); }
.igh-conta b { font: 700 28px/1 var(--f-disp); color: var(--ink); font-variant-numeric: tabular-nums; }
.igh-conta small { font: 500 10px var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.igh-ir { justify-self: start; display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 16px; font: 600 14px var(--f-disp); letter-spacing: .1em; text-transform: uppercase;
  color: #fff; background: var(--red); clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px); transition: background .15s; }
.igh:hover .igh-ir { background: var(--red-2); }
.igh-img { position: relative; isolation: isolate; border-left: 1px solid var(--line);
  background: url(npc-drakan.png) 50% 72% / auto 82% no-repeat, radial-gradient(60% 50% at 50% 46%, rgba(255, 196, 140, .55), rgba(255, 196, 140, 0) 72%), linear-gradient(180deg, #fafbfc, #eceff2); }
.igh-img::after { content: ""; position: absolute; left: 50%; bottom: 8px; width: 70%; height: 16px; transform: translateX(-50%); border-radius: 50%; z-index: -1;
  background: radial-gradient(closest-side, rgba(20, 26, 32, .35), transparent); }
@media (max-width: 620px) { .igh { grid-template-columns: 1fr; } .igh-img { display: none; } }
.igh [hidden] { display: none !important; }
