/* Team merch placeholder page: under-construction hero and future shop intro. */
.merch-hero {
  min-height: calc(100vh - 70px);
  display: grid;
  align-items: center;
  padding: 74px 0 72px;
  background:
    linear-gradient(90deg, rgba(5,7,12,.94), rgba(5,7,12,.7) 48%, rgba(5,7,12,.88)),
    url("../images/hero-gym.png") center center / cover no-repeat,
    radial-gradient(1000px 600px at 82% -15%, rgba(0,8,235,.42), transparent 60%),
    radial-gradient(820px 520px at -10% 115%, rgba(0,8,235,.22), transparent 55%),
    var(--bg);
}

.merch-panel {
  max-width: 720px;
}

.merch-head {
  margin-bottom: 0;
}

.merch-panel h1 {
  font-size: clamp(50px, 8vw, 88px);
  line-height: .96;
  margin: 22px 0 16px;
}

.merch-panel h1 span {
  color: #3243d8;
  display: block;
  margin-top: 12px;
  text-shadow: 0 0 8px rgba(0,8,235,.9), 0 0 34px rgba(0,8,235,.7);
}

.construction-box {
  margin-top: 26px;
  max-width: 560px;
  background: rgba(20,20,27,.78);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 24px;
  box-shadow: var(--shadow);
  backdrop-filter: blur(10px);
}

.construction-box p {
  color: var(--muted);
  margin-top: 10px;
}

@media (max-width: 760px) {
  .merch-hero {
    min-height: auto;
    padding: 58px 0 54px;
  }
}

@media (max-width: 520px) {
  .merch-panel h1 {
    font-size: clamp(42px, 15vw, 66px);
  }

  .construction-box {
    padding: 22px;
    border-radius: var(--radius-sm);
  }
}