/* Home: hero over the datacenter art, latest-prize strip, tiers, how, NVDA pair, game teaser, leaderboard, army. */
.h-hero { position: relative; min-height: min(88vh, 820px); display: flex; align-items: center; overflow: hidden; border-bottom: 1px solid var(--line); }
.h-bg { position: absolute; inset: 0; }
.h-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; }
@media (min-width: 761px) { .h-bg { left: 34%; } }
.h-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--bg) 0%, var(--bg) 34%, rgba(4, 8, 6, .55) 44%, rgba(4, 8, 6, 0) 60%), linear-gradient(0deg, var(--bg) 0%, transparent 22%); }
.h-in { position: relative; z-index: 2; padding: 60px 0 80px; }
.h-in h1 { margin: 16px 0 0; max-width: 600px; font-size: clamp(40px, 5.4vw, 72px); line-height: .98; text-transform: uppercase; }
.h-in h1 em { font-style: normal; color: var(--accent); }
.h-in .big-n { color: var(--gold); }
.lede { max-width: 520px; margin: 18px 0 0; color: #c2d0c6; font-size: 18px; }
.h-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }
.big-cta, .big-cta2 { min-height: 58px; padding: 18px 28px; font-size: 18px; }
.big-cta { animation: glow 2.4s ease-in-out infinite; }
@keyframes glow { 50% { transform: scale(1.03); } }
.h-stats { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 22px; }
@media (max-width: 760px) {
  .h-hero { display: block; min-height: 0; }
  .h-bg { position: relative; height: 340px; }
  .h-bg img { object-position: 50% 40%; }
  .h-hero::after { background: linear-gradient(0deg, var(--bg) 6%, rgba(4, 8, 6, .55) 46%, transparent 70%); height: 340px; bottom: auto; }
  .h-in { margin-top: -96px; padding: 0 0 46px; }
  .h-in h1 { font-size: clamp(36px, 10.5vw, 48px); }
  .lede { font-size: 16px; }
  .h-cta .btn { flex: 1 1 100%; }
}

.strip { overflow: hidden; border-bottom: 1px solid var(--line); background: rgba(10, 19, 14, .7); }
.strip-run { display: flex; gap: 28px; width: max-content; padding: 14px 0; animation: run 48s linear infinite; font: 600 13.5px/1 var(--f-mono); white-space: nowrap; color: var(--mute); }
.strip-run b { color: var(--text); } .strip-run i { font-style: normal; color: var(--accent); }
.strip-run .tier { margin-left: 6px; }
@keyframes run { to { transform: translateX(-50%); } }

.crate-img { width: 150px; filter: drop-shadow(0 10px 40px rgba(157, 255, 58, .35)); }
@media (max-width: 560px) { .crate-img { display: none; } }
.tiers { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 980px) { .tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tiers li:last-child { grid-column: 1 / -1; } }
.tiers li { position: relative; display: grid; gap: 8px; padding: 18px; border-radius: var(--r); border: 1px solid color-mix(in srgb, var(--tc) 40%, transparent); background: linear-gradient(180deg, color-mix(in srgb, var(--tc) 9%, var(--card)), var(--card)); overflow: hidden; }
.tiers .pc { font: 700 34px/1 var(--f-display); color: var(--tc); }
.tiers .rg { font: 600 13px/1.4 var(--f-mono); color: var(--text); }
.tiers .bar { height: 4px; border-radius: 4px; background: var(--line2); overflow: hidden; }
.tiers .bar i { display: block; height: 100%; background: var(--tc); transform-origin: left; }
.tiers .note { color: var(--mute); font-size: 12.5px; }

.how { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 980px) { .how { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .how { grid-template-columns: 1fr; } }
.how li { padding: 22px; }
.how .n { color: var(--accent); font-size: 13px; }
.how b { display: block; margin: 10px 0 6px; font: 700 21px/1.1 var(--f-display); text-transform: uppercase; }
.how p { margin: 0; color: var(--mute); font-size: 14.5px; }

.nv { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 24px; padding: 34px; overflow: hidden; }
@media (max-width: 820px) { .nv { grid-template-columns: 1fr; padding: 24px; } }
.nv h2 { margin: 10px 0 12px; font-size: clamp(28px, 4.4vw, 42px); line-height: 1.02; text-transform: uppercase; }
.nv p { color: #c2d0c6; margin: 0 0 12px; }
.nv .nv-state { display: inline-block; padding: 10px 14px; border-radius: 12px; border: 1px dashed var(--line); color: var(--mute); font-size: 14px; }
.nv .nv-state.live { border-style: solid; border-color: var(--accent); color: var(--text); }
.nv-price { position: relative; display: grid; align-content: center; gap: 6px; padding: 24px; border-radius: 16px; border: 1px solid var(--line); background: #050b07; overflow: hidden; }
.nv-price .mono { color: var(--mute); font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; }
.nv-price b { font: 700 clamp(42px, 7vw, 60px)/1 var(--f-mono); color: var(--accent); }
.nv-price .up { color: var(--ok); } .nv-price .dn { color: var(--bad); }
.nv-bars { display: flex; align-items: end; gap: 7px; height: 70px; margin-top: 14px; }
.nv-bars i { flex: 1; height: 100%; border-radius: 3px; background: linear-gradient(180deg, var(--accent), rgba(157, 255, 58, .15)); transform-origin: bottom; animation: bar 2.8s ease-in-out infinite; }
.nv-bars i:nth-child(2n) { animation-delay: -.7s; } .nv-bars i:nth-child(3n) { animation-delay: -1.4s; background: linear-gradient(180deg, var(--cyan), rgba(63, 242, 255, .12)); } .nv-bars i:nth-child(5n) { animation-delay: -2.1s; }
@keyframes bar { 0%, 100% { transform: scaleY(.35); } 50% { transform: scaleY(1); } }

.game-tease { position: relative; display: flex; align-items: center; min-height: 340px; padding: 36px; overflow: hidden; text-decoration: none; }
.gt-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; opacity: .55; }
.game-tease::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(4, 8, 6, .95), rgba(4, 8, 6, .5) 60%, rgba(4, 8, 6, .2)); }
.gt-txt { position: relative; z-index: 2; max-width: 520px; }
.gt-txt h2 { margin: 10px 0; font-size: clamp(30px, 5vw, 48px); line-height: 1; text-transform: uppercase; }
.gt-txt p { color: #c2d0c6; margin: 0 0 20px; }
.gt-cat { position: absolute; z-index: 2; right: 12%; top: 38%; width: 110px; animation: flap 1.6s ease-in-out infinite; filter: drop-shadow(0 8px 24px rgba(0, 0, 0, .6)); }
@keyframes flap { 0%, 100% { transform: translateY(0) rotate(-8deg); } 50% { transform: translateY(-36px) rotate(10deg); } }
@media (max-width: 640px) { .game-tease { padding: 24px; min-height: 380px; align-items: end; } .gt-cat { right: 12%; top: 14%; width: 84px; } }

.army { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); overflow: hidden; }
.army img { width: 100%; height: 100%; object-fit: cover; }
.army-txt { padding: 34px; display: grid; align-content: center; justify-items: start; }
.army-txt h2 { margin: 10px 0; font-size: clamp(30px, 4.6vw, 44px); line-height: 1; text-transform: uppercase; }
.army-txt p { color: #c2d0c6; margin: 0 0 20px; }
@media (max-width: 820px) { .army { grid-template-columns: 1fr; } .army-txt { padding: 24px; } }

.final { text-align: center; padding-top: 90px; }
.final h2 { margin: 0 0 22px; font-size: clamp(36px, 7vw, 64px); text-transform: uppercase; }

.vid { overflow: hidden; padding: 0; }
.vid video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #000; }