/* Hero art direction: one typographic mark, with the game and photo supporting it. */
.hero--refresh::before { display: none; }

.hero--refresh .hero__content { padding-top: 142px; padding-bottom: 54px; }
.breakout__layout {
  grid-template-columns: minmax(0,1.35fr) minmax(220px,.65fr);
  gap: clamp(20px,3vw,58px);
}
.hero--refresh .hero__title {
  font-family: "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
  font-size: clamp(80px,9.7vw,140px);
  font-weight: 900;
  line-height: .92;
  letter-spacing: -.095em;
}
.hero--refresh .hero__title > span:nth-child(2) { margin-left: clamp(12px,2.6vw,38px); }
.hero--refresh .hero__title > span:nth-child(3) {
  margin: .1em 0 0 auto;
  font-size: .78em;
  letter-spacing: -.075em;
}
.hero--refresh .hero__title .breakout__brick { font-weight: 900; }
.hero--refresh .hero__title > span:nth-child(-n+2) .breakout__brick:is(:first-child,:nth-child(6)) {
  font-family: "Noto Sans JP", "Yu Gothic", sans-serif;
  font-size: .54em;
  font-weight: 900;
  letter-spacing: -.2em;
  vertical-align: .24em;
}
.hero--refresh .hero__title > span:nth-child(-n+2) .breakout__brick:nth-child(7) {
  margin-left: .03em;
  font-size: .54em;
  font-weight: 900;
  vertical-align: .17em;
}
.hero--refresh .hero__title > span:nth-child(3) .breakout__brick { -webkit-text-stroke: .8px currentColor; }

.breakout__photo {
  width: min(100%,400px);
  aspect-ratio: 1.25;
  box-shadow: 6px 7px 0 rgba(23,24,20,.18);
}
.hero--refresh .hero__lead { margin-top: 23px; }

@media (max-width: 767px) {
  .hero--refresh { min-height: 0; }
  .hero--refresh .hero__content { min-height: 0; padding-top: 137px; padding-bottom: 50px; }
  .breakout__layout { grid-template-columns: minmax(0,1fr); gap: 16px; }
  .hero--refresh .hero__title {
    font-size: clamp(48px,15vw,62px);
    line-height: .94;
    letter-spacing: -.10em;
  }
  .hero--refresh .hero__title > span:nth-child(2) { margin-left: 12px; }
  .hero--refresh .hero__title > span:nth-child(3) { margin-top: .14em; font-size: .76em; }
  .breakout__photo { width: min(46%,170px); aspect-ratio: 1.35; box-shadow: 5px 5px 0 rgba(23,24,20,.18); }
  .hero--refresh .hero__lead { margin-top: 18px; }
  .hero__line, .hero__scroll { display: none; }
}
