/* Homepage-specific hero and navigation composition. */
.home-page .hero--portal { background: #101010; }
.home-page .hero-links a {
  background: #FFEA6A;
  color: #111;
  border: 1px solid rgba(17,17,17,.28);
  box-shadow: 0 10px 30px rgba(0,0,0,.42);
}
.home-page .hero-links a span { color: #111; }
.home-page .hero-links a em { color: #292300; }
.home-page .hero-links a span b { color: #111; }
.home-page .hero-links a:hover,
.home-page .hero-links a:focus-visible {
  background: #FFF08A;
  color: #111;
  box-shadow: 0 14px 34px rgba(0,0,0,.5);
}
.home-page .hero-links a:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.home-page .hero__inner--portal {
  min-height: max(680px, 100svh);
  padding-top: 140px;
  padding-bottom: 88px;
  justify-content: flex-end;
}
.home-page .hero__foot { margin: 0; padding: 0; align-items: center; }
.home-page .hero--portal h1.hero__sub-jp {
  margin: 0 0 28px;
  font-size: clamp(22px, 2.4vw, 34px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .06em;
  text-align: center;
  white-space: nowrap;
}
.home-page .hero-links { flex-shrink: 0; }
@media (min-width: 769px) {
  .home-page .hero-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-page .hero-links a { min-height: 72px; padding-block: 12px; }
}
.hero-brand-center {
  position: absolute;
  z-index: 3;
  top: 20%;
  left: 50%;
  width: calc(100% - 64px);
  transform: translate(-50%, -50%);
  color: var(--yellow);
  font: 800 clamp(20px, 2.7vw, 36px)/1.25 var(--ff-display);
  letter-spacing: .055em;
  text-align: center;
  text-shadow: 0 2px 18px #0008;
}
.hero-brand-center span,
.hero-brand-center small { display: block; }
.hero-brand-center small {
  margin-top: 8px;
  font-size: .27em;
  letter-spacing: .22em;
}
.home-page .hero--portal .hero-bg__video,
.home-page .hero--portal .hero-bg__still { object-position: center center; }

@media (max-width: 768px) {
  .home-page .hero-links > a:last-child { grid-column: auto; width: auto; justify-self: stretch; }
  .home-page .hero--portal { min-height: 0; }
  .home-page .hero--portal .hero-bg { inset: 80px 0 auto; height: 84vw; max-height: 490px; }
  .home-page .hero--portal .hero-bg__overlay {
    background: linear-gradient(0deg, #101010 0%, rgba(0,0,0,.06) 24%, rgba(0,0,0,.16) 100%);
  }
  .home-page .hero--portal .hero-bg__overlay::after { display: none; }
  .home-page .hero__inner--portal { min-height: 0; padding: calc(80px + min(84vw, 490px) + 24px) 24px 84px; }
  .hero-brand-center {
    top: calc(80px + 10vw);
    width: calc(100% - 32px);
    font-size: clamp(18px, 4.2vw, 27px);
    letter-spacing: .025em;
  }
  .hero-brand-center small { margin-top: 6px; font-size: 10px; }
  .home-page .hero__foot { margin: auto 0 0; padding: 0; }
  .home-page .hero--portal h1.hero__sub-jp {
    margin: 0 0 24px;
    font-size: clamp(16px, 4.2vw, 24px) !important;
    line-height: 1.6;
    letter-spacing: 0;
  }
  .home-page .hero__inner--portal { padding-left: 16px; padding-right: 16px; }
}
