/* The badge stays inside the existing full-screen hero; it never changes page height. */
.taiwan-made-badge {
  display: block;
  width: clamp(124px, 10vw, 168px);
  flex: 0 0 auto;
  line-height: 0;
  border-radius: 16px;
  filter: drop-shadow(0 5px 15px rgba(2, 13, 28, .24));
  transition: transform .2s ease, filter .2s ease;
}

.taiwan-made-badge img {
  display: block;
  width: 100%;
  height: auto;
}

.taiwan-made-badge:hover {
  transform: translateY(-3px);
  filter: drop-shadow(0 7px 18px rgba(255, 101, 31, .24));
}

.taiwan-made-badge:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 5px;
}

.hero-title-lockup {
  position: relative;
  font-size: clamp(76px, min(10vw, calc(var(--hero-height) * .185)), 190px);
}

.hero .hero-title-lockup h1 { font-size: inherit; }

@media (min-width: 801px) {
  .hero .hero-title-lockup h1 > span { min-height: 1.3em; }
}

.hero-venue-jerseys > .taiwan-made-badge {
  position: absolute;
  z-index: 4;
  left: 40.2%;
  top: auto;
  /* Align with the tank hem at source row 1013 of the 1470x1070 hero artwork.
     Pair width is min(66vw, hero-height * 1.2); its bottom is -2% of hero height. */
  bottom: calc(min(2.5592vw, calc(var(--hero-height) * .046531)) - var(--hero-height) * .02);
  width: clamp(96px, 8.2vw, 156px);
  border-radius: 12px;
}

@media (min-width: 801px) and (max-height: 720px) {
  .hero-title-lockup { font-size: clamp(64px, min(9vw, calc(var(--hero-height) * .17)), 112px); }
}

@media (max-width: 800px) {
  .hero-title-lockup { position: static; font-size: clamp(56px,18vw,88px); }
  .hero-venues .hero-content { position: static; transform: none; }
  .hero-venue-jerseys > .taiwan-made-badge {
    width: 104px;
    left: var(--taiwan-badge-left, 24px);
    bottom: var(--taiwan-badge-bottom, 3.4122vw);
    top: auto;
    border-radius: 10px;
  }
}

@media (max-width: 800px) and (max-height: 740px) {
  .hero-title-lockup { font-size: clamp(48px,15vw,68px); }
}

@media (max-width: 800px) and (max-height: 700px) {
  .hero-venue-jerseys > .taiwan-made-badge {
    width: 86px;
    bottom: var(--taiwan-badge-bottom, 3.0245vw);
  }
}

@media (prefers-reduced-motion: reduce) {
  .taiwan-made-badge { transition: none; }
  .taiwan-made-badge:hover { transform: none; }
}