/* Clean esports pass: fewer decorative effects, stronger information hierarchy. */
.tapes,
.embers,
.fire {
  display: none !important;
}

.hero {
  background:
    linear-gradient(90deg, rgba(255, 90, 10, 0.035) 1px, transparent 1px),
    linear-gradient(rgba(255, 90, 10, 0.025) 1px, transparent 1px),
    linear-gradient(180deg, #0b0807 0%, #0e0a08 100%);
  background-size: 72px 72px, 72px 72px, auto;
}

.hero-stripes {
  width: 42%;
  right: -4%;
  opacity: .45;
  clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%);
}

.hero-ghost {
  -webkit-text-stroke-color: #1d1714;
  font-size: 27vw;
  top: 18%;
}

.hero-chips,
.hero-lede,
.hero-actions,
.hero .socials,
.hero-art,
.hero-stats,
.ht-1,
.ht-2,
.hero-logo {
  animation: none !important;
}

.hero-plate {
  opacity: .055;
}

.hero-logo {
  max-width: 520px;
}

.hero-copy {
  min-width: 0;
}

.reveal {
  transform: translateY(12px);
  transition-duration: .35s;
}

.player.is-in:hover {
  translate: 0 -2px;
}

.join {
  background: #0b0807;
  border-top: 1px solid var(--line);
  padding-bottom: clamp(100px, 12vw, 150px);
}

.join-logo {
  opacity: .035;
  filter: grayscale(1);
}

@media (width <= 880px) {
  .hero-stripes {
    width: 70%;
    right: -30%;
  }

  .hero-ghost {
    font-size: 46vw;
  }

  .hero-art {
    width: min(56vw, 240px);
  }
}

@media (width <= 560px) {
  .hero {
    padding-top: 100px;
  }

  .hero-title {
    font-size: clamp(3rem, 15vw, 3.55rem);
  }

  .hero-actions {
    align-items: center;
    flex-direction: column;
  }

  .hero-actions .btn {
    width: min(280px, 100%);
  }
}