/**
 * SHI-SO TOP v2: Japanese typography pass.
 *
 * Keep this file scoped to the TOP content. Header and footer typography are
 * intentionally excluded. Text is sized and wrapped instead of being scaled,
 * so Japanese glyph proportions remain intact.
 */

body.home .shiso-v2 {
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
}

body.home .shiso-v2 :where(
  .shiso-v2-interview-feature,
  .shiso-v2-interview-card,
  .shiso-v2-insight-bar,
  .shiso-v2-knowledge-feature,
  .shiso-v2-knowledge-list,
  .shiso-v2-news-grid,
  .shiso-v2-release
) :where(h3, p, a, strong, time),
body.home .shiso-v2 .shiso-v2-section-heading,
body.home .shiso-v2 .shiso-v2-subheading {
  line-break: strict;
  word-break: normal;
  overflow-wrap: anywhere;
}

body.home .shiso-v2 :where(
  .shiso-v2-interview-feature,
  .shiso-v2-interview-card,
  .shiso-v2-knowledge-feature,
  .shiso-v2-knowledge-list,
  .shiso-v2-news-grid,
  .shiso-v2-release
) h3 {
  text-wrap: pretty;
}

body.home .shiso-v2 :where(
  .shiso-v2-section-heading,
  .shiso-v2-subheading
) {
  text-wrap: balance;
}

@supports (word-break: auto-phrase) {
  body.home .shiso-v2 :where(
    .shiso-v2-interview-feature,
    .shiso-v2-interview-card,
    .shiso-v2-insight-bar,
    .shiso-v2-knowledge-feature,
    .shiso-v2-knowledge-list,
    .shiso-v2-news-grid,
    .shiso-v2-release
  ) :where(h3, p, a, strong) {
    word-break: auto-phrase;
    overflow-wrap: normal;
  }
}

@media (min-width: 1001px) {
  /*
   * Interviews
   * Titles receive up to three lines and excerpts two lines. Card height grows
   * with the copy instead of shrinking the copy to 12px.
   */
  body.home .shiso-v2 .shiso-v2-interview-feature {
    height: auto !important;
    min-height: 272px;
  }

  body.home .shiso-v2 .shiso-v2-interview-feature__copy {
    height: auto !important;
    min-height: 270px;
    padding-block: 24px !important;
  }

  body.home .shiso-v2 .shiso-v2-interview-feature h3 {
    margin-bottom: 10px !important;
    font-size: 28px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
  }

  body.home .shiso-v2 .shiso-v2-interview-feature p {
    display: -webkit-box !important;
    height: auto !important;
    max-height: 59.2px;
    margin-bottom: 12px !important;
    overflow: hidden !important;
    font-size: 16px !important;
    line-height: 1.85 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  body.home .shiso-v2 .shiso-v2-interview-card {
    height: auto !important;
    min-height: 382px;
  }

  body.home .shiso-v2 .shiso-v2-interview-card__body {
    height: auto !important;
    min-height: 226px;
    padding: 18px !important;
  }

  body.home .shiso-v2 .shiso-v2-interview-card h3 {
    display: -webkit-box !important;
    height: auto !important;
    max-height: 83.7px;
    margin-bottom: 10px !important;
    overflow: hidden !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.55 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  body.home .shiso-v2 .shiso-v2-interview-card p {
    display: -webkit-box !important;
    height: auto !important;
    max-height: 50.8px;
    margin-bottom: 12px !important;
    overflow: hidden !important;
    font-size: 14.5px !important;
    line-height: 1.75 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  body.home .shiso-v2 .shiso-v2-pill {
    min-height: 24px;
    padding: 3px 10px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
  }

  body.home .shiso-v2 .shiso-v2-insight-bar {
    min-height: 100px;
    padding-block: 18px !important;
  }

  body.home .shiso-v2 .shiso-v2-insight-bar strong {
    font-size: 18px !important;
    line-height: 1.65 !important;
  }

  body.home .shiso-v2 .shiso-v2-insight-bar p,
  body.home .shiso-v2 .shiso-v2-insight-bar a {
    font-size: 14px !important;
    line-height: 1.75 !important;
  }

  /*
   * Knowledge and News
   * Card copy stays at or above 14px while titles use a Japanese-friendly
   * 1.55-1.6 line height.
   */
  body.home .shiso-v2 .shiso-v2-knowledge-feature h3 {
    font-size: 22px !important;
    font-weight: 600 !important;
    line-height: 1.55 !important;
  }

  body.home .shiso-v2 .shiso-v2-knowledge-feature p {
    font-size: 15px !important;
    line-height: 1.8 !important;
  }

  body.home .shiso-v2 .shiso-v2-knowledge-list h3 {
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
  }

  body.home .shiso-v2 .shiso-v2-knowledge-list p {
    font-size: 14.5px !important;
    line-height: 1.75 !important;
  }

  body.home .shiso-v2 .shiso-v2-news-grid h3 {
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
  }

  body.home .shiso-v2 .shiso-v2-news-grid time {
    font-size: 14px !important;
    line-height: 1.7 !important;
  }

  /*
   * Release notes
   * Previous visual-fidelity layers used unequal X/Y scaling. That physically
   * distorted Japanese glyphs, so all release copy is rendered at its real
   * size. The feed summary gets two natural lines instead of one ellipsis.
   */
  body.home .shiso-v2 .shiso-v2-releases time,
  body.home .shiso-v2 .shiso-v2-release h3,
  body.home .shiso-v2 .shiso-v2-release .shiso-v2-release__body > p:nth-of-type(2),
  body.home .shiso-v2 .shiso-v2-release .shiso-v2-text-link,
  body.home .shiso-v2
    .shiso-v2-releases
    > .shiso-v2-container
    > .shiso-v2-center-link
    .shiso-v2-text-link {
    transform: none !important;
  }

  body.home .shiso-v2 .shiso-v2-release.is-latest time {
    font-size: 18px !important;
    line-height: 1.7 !important;
    letter-spacing: 0.02em !important;
  }

  body.home .shiso-v2 .shiso-v2-release.is-latest h3 {
    max-inline-size: 30em;
    font-size: 36px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    letter-spacing: 0.01em !important;
  }

  body.home
    .shiso-v2
    .shiso-v2-release.is-latest
    .shiso-v2-release__body
    > p:nth-of-type(2) {
    display: -webkit-box !important;
    max-inline-size: 50em;
    height: auto !important;
    max-height: 64.8px;
    overflow: hidden !important;
    white-space: normal !important;
    text-overflow: clip !important;
    font-size: 18px !important;
    line-height: 1.8 !important;
    letter-spacing: 0 !important;
    text-wrap: pretty;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  body.home
    .shiso-v2
    .shiso-v2-release.is-latest
    .shiso-v2-text-link {
    font-size: 18px !important;
    line-height: 1.6 !important;
    letter-spacing: 0.01em !important;
  }

  body.home .shiso-v2 .shiso-v2-release:nth-child(2) h3,
  body.home .shiso-v2 .shiso-v2-release:nth-child(3) h3 {
    max-inline-size: 42em;
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
    letter-spacing: 0.01em !important;
  }

  body.home
    .shiso-v2
    .shiso-v2-releases
    > .shiso-v2-container
    > .shiso-v2-center-link
    .shiso-v2-text-link {
    font-size: 18px !important;
    line-height: 1.7 !important;
    letter-spacing: 0.01em !important;
  }
}

@media (max-width: 1000px) {
  body.home .shiso-v2 .shiso-v2-pill {
    min-height: 24px;
    padding: 3px 9px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
  }

  body.home .shiso-v2 .shiso-v2-interview-feature h3 {
    font-size: clamp(22px, 6vw, 24px) !important;
    font-weight: 600 !important;
    line-height: 1.55 !important;
  }

  body.home .shiso-v2 .shiso-v2-interview-feature p {
    display: -webkit-box !important;
    height: auto !important;
    max-height: 88.8px;
    overflow: hidden !important;
    font-size: 16px !important;
    line-height: 1.85 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  body.home .shiso-v2 .shiso-v2-interview-card h3 {
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.55 !important;
  }

  body.home .shiso-v2 .shiso-v2-interview-card p {
    font-size: 15px !important;
    line-height: 1.8 !important;
  }

  body.home .shiso-v2 .shiso-v2-insight-bar p,
  body.home .shiso-v2 .shiso-v2-insight-bar a {
    font-size: 15px !important;
    line-height: 1.75 !important;
  }

  body.home .shiso-v2 .shiso-v2-knowledge-feature h3 {
    font-weight: 600 !important;
    line-height: 1.55 !important;
  }

  body.home .shiso-v2 .shiso-v2-knowledge-list h3,
  body.home .shiso-v2 .shiso-v2-news-grid h3 {
    font-weight: 600 !important;
    line-height: 1.6 !important;
  }

  body.home .shiso-v2 .shiso-v2-knowledge-list p {
    font-size: 15px !important;
    line-height: 1.75 !important;
  }
}
