/* Japanese typography extends the approved SAYA visual design. */
html[lang="ja"] body{font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.85;word-break:normal;line-break:strict;overflow-wrap:break-word}
html[lang="ja"] :is(h1,h2,h3,h4,.banner){letter-spacing:.015em;line-height:1.55;font-weight:700;word-break:normal;overflow-wrap:break-word}
html[lang="ja"] h2{font-size:clamp(1.875rem,3.2vw,3.125rem);margin-bottom:28px}
html[lang="ja"] .hero{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:3%;padding-top:80px;padding-bottom:75px;min-height:0}
html[lang="ja"] .hero-copy{max-width:760px}
html[lang="ja"] .hero h1{font-size:clamp(2rem,3.25vw,3.5rem);line-height:1.65;letter-spacing:0;max-width:none;margin:20px 0 28px}
html[lang="ja"] .hero .lead{font-size:clamp(1rem,1.25vw,1.25rem);line-height:1.95;max-width:660px}
html[lang="ja"] :is(.eyebrow,.tag,.path-kicker,.model-kicker,.film-kicker,.film-caption){letter-spacing:.06em;line-height:1.7;font-size:.875rem}
html[lang="ja"] :is(.intro,.global-lead,.about-saya-intro,.model-heading>p,.section-top>p){font-size:1.0625rem;line-height:1.95}
html[lang="ja"] .hero-graph-caption{font-size:.75rem;letter-spacing:.04em;white-space:normal;flex-wrap:wrap}
html[lang="ja"] .model-tabs button{font-size:.9375rem;line-height:1.7;padding:16px;min-height:116px}
html[lang="ja"] .model-task h3{font-size:clamp(1.375rem,2.15vw,2rem);line-height:1.65;letter-spacing:.015em}
html[lang="ja"] :is(.model-task>p,.model-decisions p,.model-specs dd,.model-gain p,.architecture-flow p,.proof-list p,.compare-grid.three p,.application-grid p,.access-grid p,.faq-answer p,.partner-paths p,.about-saya-grid p){font-size:1rem;line-height:1.9;letter-spacing:normal}
html[lang="ja"] :is(.model-decisions h4,.model-specs dt){font-size:1rem;line-height:1.7}
html[lang="ja"] .model-specs{grid-template-columns:1fr;gap:18px}
html[lang="ja"] .model-specs dd{margin-left:0}
html[lang="ja"] :is(.model-note,.architecture-note,.note,.global-rights,.film-disclosure,small){font-size:.9375rem;line-height:1.9}
html[lang="ja"] :is(.architecture-flow h3,.compare-grid.three h3,.partner-paths h3,.application-grid h3,.access-grid h3,.about-saya-grid h3){font-size:1.375rem;line-height:1.7;letter-spacing:.015em}
html[lang="ja"] .chips span{font-size:.875rem}
html[lang="ja"] .path-flow{gap:10px;line-height:1.7}
html[lang="ja"] .path-flow :is(b,strong){font-size:.9375rem}
html[lang="ja"] .banner{font-size:clamp(1.5rem,3vw,2.75rem)}
html[lang="ja"] .faq-question{font-size:1.125rem;line-height:1.8;letter-spacing:normal}
html[lang="ja"] .faq-heading h2{font-size:clamp(1.875rem,3.2vw,3.125rem)}
html[lang="ja"] .film-stage{height:auto;min-height:420px;aspect-ratio:16/9}
html[lang="ja"] .film-content{left:5%;width:46%;top:50%;transform:translateY(-50%)}
html[lang="ja"] .film-content h3{font-size:clamp(1.375rem,2.6vw,2.5rem);line-height:1.65;letter-spacing:0}
html[lang="ja"] .film-content p{font-size:clamp(1rem,1.3vw,1.125rem);line-height:1.9}
html[lang="ja"] .film-watermark{font-size:.75rem;letter-spacing:.04em}
html[lang="ja"] .film-controls button{font-size:1rem;white-space:nowrap}
html[lang="ja"] .about-saya .family-heading h2{font-size:clamp(1.875rem,3.2vw,3.125rem)}
html[lang="ja"] .about-intelligence text{font-family:"Noto Sans JP",sans-serif}
html[lang="ja"] .about-intelligence text:not(:first-child){font-size:14px}
html[lang="ja"] .final-cta p:not(.eyebrow){font-size:1.0625rem;line-height:1.9}
@media(min-width:1201px){html[lang="ja"] .nav{gap:18px;padding-left:3%;padding-right:3%}html[lang="ja"] .nav nav{gap:18px;font-size:.875rem}html[lang="ja"] .nav-cta{font-size:.875rem;padding:10px 12px}html[lang="ja"] .nav-cta span{display:none}}
@media(max-width:1100px){html[lang="ja"] .hero{grid-template-columns:1fr}html[lang="ja"] .hero-copy{max-width:850px}html[lang="ja"] .hero-rain{margin:24px auto 0}html[lang="ja"] .hero h1{font-size:clamp(2rem,4.8vw,3.5rem)}}
@media(max-width:900px){
 html[lang="ja"] .film-stage{display:flex;flex-direction:column;aspect-ratio:auto;height:auto;min-height:0}
 html[lang="ja"] .film-content{position:relative;left:auto;top:auto;transform:none;width:auto;padding:66px 6% 16px;order:0;min-height:270px}
 html[lang="ja"] .film-content h3{font-size:clamp(1.375rem,4.5vw,2rem);margin:12px 0}
 html[lang="ja"] .film-content p{font-size:1rem}
 html[lang="ja"] #knowledgeFilm{position:relative;inset:auto;order:1;width:100%;height:auto;aspect-ratio:600/650;max-height:450px}
 html[lang="ja"] .film-shade{display:none}
 html[lang="ja"] .film-watermark{position:relative;right:auto;bottom:auto;order:2;text-align:center;padding:0 12px 18px}
 html[lang="ja"] .film-time,html[lang="ja"] .film-scene-count{top:20px}
}
@media(max-width:520px){
 html[lang="ja"] .hero{padding:48px 6% 40px}
 html[lang="ja"] .hero h1{font-size:clamp(1.625rem,6.7vw,2.2rem)}
 html[lang="ja"] .hero .lead{font-size:1rem}
 html[lang="ja"] .hero-rain{width:100%;height:300px;margin:20px auto 0}
 html[lang="ja"] h2,html[lang="ja"] .faq-heading h2,html[lang="ja"] .global-learning h2{font-size:1.75rem}
 html[lang="ja"] .section{padding:60px 6%}
 html[lang="ja"] .model-tabs button{flex-basis:215px;min-height:110px}
 html[lang="ja"] .model-task h3{font-size:1.5rem}
 html[lang="ja"] .faq-answer{padding-left:0;padding-right:0}
 html[lang="ja"] .about-saya .family-heading h2{font-size:1.75rem}
 html[lang="ja"] .film-content{min-height:0;padding:62px 6% 16px}
 html[lang="ja"] .film-progress{flex-basis:100%;order:3;margin-bottom:8px}
 html[lang="ja"] #filmNext{margin-left:auto}
 html[lang="ja"] .film-caption{line-height:1.9}
}
@media(prefers-reduced-motion:reduce){html[lang="ja"]{scroll-behavior:auto}html[lang="ja"] *,html[lang="ja"] *::before,html[lang="ja"] *::after{animation:none!important;transition:none!important}}

/* Balanced Japanese headings avoid single-character final lines. */
html[lang="ja"] :is(h1,h2,h3,h4){text-wrap:balance}
@media(max-width:1100px){html[lang="ja"] .section-top{display:block}html[lang="ja"] .section-top>p{max-width:720px;padding-bottom:0;margin-bottom:32px}}

/* Let enlarged captions determine the film height; diagrams retain their proportions. */
@media(min-width:901px){html[lang="ja"] .film-stage{display:grid;grid-template-columns:48% 1fr;align-items:center;padding:0 5%}html[lang="ja"] .film-content{position:relative;left:auto;top:auto;transform:none;width:auto;grid-column:1;margin:80px 0}}
@media(min-width:901px){html[lang="ja"] .film-stage{aspect-ratio:auto;min-height:clamp(420px,49.5vw,1000px)}}