/* Japanese crowdfunding/cases hero spacing, independent of viewport height. */
.ja-crowdfunding .hero-cf,
.ja-cases .cases-hero {
  padding: calc(var(--nav-h) + clamp(32px, 4vw, 64px)) 0 clamp(40px, 5vw, 72px);
}

.ja-crowdfunding .hero-cf h1 {
  max-width: 22em;
  font-size: clamp(30px, 4vw, 56px);
  line-height: 1.3;
}

.ja-cases .cases-hero h1 {
  font-size: clamp(30px, 4.4vw, 60px);
  line-height: 1.3;
}

.ja-cases .ja-case-topic { white-space: nowrap; }
.ja-cases .cases-hero .ch-eyebrow { margin-bottom: 16px; }
.ja-cases .cases-hero .lede { margin-top: 20px; }
.ja-cases .cases-hero .ch-stats { margin-top: 36px; }

@media (max-width: 1024px) {
  .ja-crowdfunding .hero-cf,
  .ja-cases .cases-hero { min-height: 0; }
  .ja-cases .cases-hero > .wrap { padding-right: 104px; }
}

@media (max-width: 640px) {
  .ja-crowdfunding .hero-cf,
  .ja-cases .cases-hero {
    padding-top: calc(var(--nav-h) + 28px);
    padding-bottom: 40px;
  }
  .ja-crowdfunding .hero-cf h1 {
    max-width: 100%;
    font-size: clamp(24px, 7vw, 38px);
    line-height: 1.4;
  }
  .ja-cases .cases-hero h1 {
    font-size: clamp(21px, 6vw, 34px);
    line-height: 1.4;
  }
  /* Keep the existing market rail clear of the hero copy and metrics. */
  .ja-cases .cases-hero > .wrap {
    padding-right: calc(64px + env(safe-area-inset-right));
  }
  .ja-cases .cases-hero .ch-eyebrow { margin-bottom: 14px; }
  .ja-cases .cases-hero .ch-stats { margin-top: 28px; }
}
