/* Japanese typography for /ja/. Loaded after ../styles.css and ../lang.css; layout is unchanged.
   - Inter Tight first keeps the brand's Latin letters and numbers; kana and kanji fall through
     to Noto Sans JP (Google Fonts, subsetted slices), then the system Japanese fonts.
   - Headlines run at roughly 72-86% of the English size with looser leading, "palt" spacing and
     word-break: auto-phrase (Chrome/Edge 119+) so lines break between phrases, not mid-word. */

html[lang='ja'] {
  --font: 'Inter Tight', 'Noto Sans JP', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', YuGothic, Meiryo, sans-serif;
}

html[lang='ja'] body {
  line-height: 1.8;
  letter-spacing: 0.02em;
  line-break: strict;
}

/* Phrase-level line breaking for anything set large or short. */
html[lang='ja'] :is(h1, h2, h3, .t-lede, .hero-tagline, .statement-text, .solutions-lead, .btn, .eyebrow, .faq-q span, .voice-quote p, .voice-badge, .work-caption p, .quote-lede, .quote-fine, .foot-brand p) {
  word-break: auto-phrase;
}

/* Even line lengths on headings; no one- or two-character last lines in body copy. */
html[lang='ja'] :is(h2, h3, .t-lede, .hero-tagline, .solutions-lead, .quote-steps li, .voice-name) {
  text-wrap: balance;
}

html[lang='ja'] p {
  text-wrap: pretty;
}

html[lang='ja'] :is(.t-display, .hero-title, .statement-text, .solutions-lead, .svc-title, .t-h3, .voices-title, .why-stat, .mobile-menu nav a) {
  font-feature-settings: 'palt';
  letter-spacing: 0.01em;
}

/* ---------- headline sizes ---------- */
html[lang='ja'] .t-display {
  font-size: clamp(34px, 5.8vw, 112px);
  line-height: 1.25;
}

html[lang='ja'] .hero-title {
  font-size: clamp(60px, 12vw, 232px);
  line-height: 1.3;
}

html[lang='ja'] .statement-text {
  max-width: 15em;
  font-size: clamp(30px, 5.6vw, 106px);
  line-height: 1.32;
}

html[lang='ja'] .solutions-lead {
  max-width: 16em;
  font-size: clamp(24px, 3.3vw, 60px);
  line-height: 1.36;
}

html[lang='ja'] .svc-title {
  font-size: clamp(22px, 2.6vw, 46px);
  line-height: 1.3;
}

html[lang='ja'] .t-h3 {
  font-size: clamp(22px, 2.6vw, 46px);
  line-height: 1.3;
}

html[lang='ja'] .voices-title {
  font-size: clamp(26px, 2.5vw, 46px);
  line-height: 1.35;
}

html[lang='ja'] .cta-title {
  max-width: 13em;
}

html[lang='ja'] .why-stat small {
  margin-left: 0.08em;
  font-size: 0.32em;
  letter-spacing: 0.04em;
}

html[lang='ja'] .mobile-menu nav a {
  font-size: clamp(24px, 7vw, 44px);
  line-height: 1.35;
}

html[lang='ja'] .header-nav a {
  font-size: clamp(14px, 1.15vw, 19px);
  letter-spacing: 0.02em;
}

/* ---------- body copy ---------- */
html[lang='ja'] :is(.t-lede, .hero-tagline, .quote-lede) {
  line-height: 1.75;
  letter-spacing: 0.02em;
}

html[lang='ja'] :is(.svc-desc, .step-copy p, .why-card p, .faq-a p, .work-note, .foot-brand p, .quote-fine) {
  line-height: 1.85;
  letter-spacing: 0.03em;
}

html[lang='ja'] .voice-quote p {
  line-height: 1.7;
  letter-spacing: 0.02em;
}

html[lang='ja'] .faq-q {
  line-height: 1.6;
}

html[lang='ja'] .eyebrow {
  letter-spacing: 0.06em;
}

/* Long Latin strings (email, quote-app host) may wrap on narrow phones instead of overflowing. */
html[lang='ja'] :is(.cta-mail a, .foot-col a, .work-caption a) {
  overflow-wrap: anywhere;
}

/* Japanese runs without spaces: the closing headline's phrases sit flush, keeping the gap only around the pill. */
html[lang='ja'] .cta-word {
  margin-right: 0;
}

html[lang='ja'] .cta-word:has(+ .cta-pill) {
  margin-right: 0.24em;
}