/* Japanese pages only (linked on /ja/ pages by the build), 1 Nov 2026. Rules from docs/japanese-localisation-guide.md section 8:
   Latin letters keep the site font (Carlito); Japanese characters fall to the system's Japanese fonts first, a Japanese-first
   stack so no Chinese glyph forms appear; taller line height for body text; strict line breaking (no 。、 or small kana at a
   line start); headings and buttons break at phrase edges where the browser can (Chrome 119 and later); no letter spacing. */
:root:lang(ja){--font:"Carlito","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI","Yu Gothic","Meiryo","Noto Sans JP",sans-serif}
html:lang(ja) body{line-height:1.8;line-break:strict;text-autospace:normal;word-break:auto-phrase}
html:lang(ja) :is(h1,h2,h3,h4,.btn,button,nav a,.eyebrow,.toc-a,.ex-name,.ov-go,.xlinks a){word-break:auto-phrase;line-height:1.45}
html:lang(ja) :is(.eyebrow,.label,.ex-kicker,.order,.lane-tag){letter-spacing:0}
html:lang(ja) :is(em,i,cite){font-style:normal}
/* drawings set their own Latin font stack (Carlito, Calibri, Segoe UI, system-ui): on Japanese pages their text uses the Japanese-first stack,
   or Windows draws the Japanese in a wide fallback font. !important because each drawing's own class rules are more specific */
html:lang(ja) svg text,html:lang(ja) svg tspan{font-family:"Carlito","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI","Yu Gothic","Meiryo","Noto Sans JP",sans-serif!important}
/* headings: balanced lines, so no character is left alone on the last line */
html:lang(ja) :is(h1,h2,h3,h4,.toc-a,.tc-tab){text-wrap:balance}
/* running text, lists and links: no single character left on the last line */
html:lang(ja) :is(p,li,dd,dt,figcaption,a,b,strong,span){text-wrap:pretty}
/* narrow columns (Contact topics): a heading may break inside a long katakana word, as Japanese typesetting allows */
html:lang(ja) .lg-row h3,html:lang(ja) .map-part b{word-break:keep-all;overflow-wrap:anywhere;text-wrap:balance}
/* large statements set as paragraphs (Home "why" line): break at phrase edges like the headings */
html:lang(ja) :is(.why-state,.lead,.op-lead,.ov-lead,.lead-in){word-break:auto-phrase}
/* a long katakana word (ターンキーソリューション, アプリケーション) is one phrase: on phones the largest headings step down so it fits one line */
@media (max-width:430px){
  html:lang(ja) main h1{font-size:28px}
  html:lang(ja) .door h3{font-size:22px}
  html:lang(ja) .glance dd{font-size:19px}
}
html:lang(ja) [lang="en"],html:lang(ja) [lang="id"]{line-break:auto;word-break:normal}
/* header from 961 to 1099 px: the Japanese menu is wider, so the language button shows the globe only (its name stays in the label) */
@media (min-width:961px) and (max-width:1099px){
  html:lang(ja) .lang-menu .lang span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  html:lang(ja) .nav button.lang{padding-inline:10px}
}
/* the header row ran past the content edge (measured 1 Nov 2026): 9 px at 961 px, and from 1280 px about 60 px once Share and the
   switch show their words. In Japanese, from 961 px the language button keeps the globe only and Share and the switch show their
   icons only (their names are still read out), and from 961 to 1099 px the menu links sit closer together. */
@media (min-width:961px){
  html:lang(ja) .site-header .lang-menu .lang span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  html:lang(ja) .site-header .nav button.lang{padding-inline:10px}
  html:lang(ja) .site-header .share-wide{width:44px;padding:0;justify-content:center;gap:0;font-size:0}
  html:lang(ja) .site-header .share-wide svg{width:20px;height:20px}
  html:lang(ja) .site-header .theme-wide{width:44px;padding:0;justify-content:center;gap:0}
  html:lang(ja) .site-header .theme-wide .gtheme-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media (min-width:961px) and (max-width:1099px){html:lang(ja) .site-header .nav ul{gap:6px}html:lang(ja) .site-header .nav{gap:8px}}
/* 会社概要 page: the company facts as a two-column table, one row per fact */
.co-hero{background:var(--surface-2);padding-block:64px 56px;border-bottom:1px solid var(--line)}
.co-hero h1{margin:0}
.co-sub{margin:12px 0 0;font-size:19px;color:var(--muted)}
@media (max-width:600px){.co-hero{padding-block:40px 36px}}
.co-tbl{margin:0;max-width:880px;border-top:1px solid var(--line)}
.co-row{display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:32px;padding-block:20px;border-bottom:1px solid var(--line)}
.co-row dt{font-weight:700;color:var(--muted);font-size:17px}
.co-row dd{margin:0;font-size:19px;line-height:1.7}
.co-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.co-lines{counter-reset:co}
.co-lines li{counter-increment:co;display:flex;gap:12px}
.co-lines li::before{content:counter(co,decimal-leading-zero);font-weight:700;color:var(--muted);min-width:2ch}
@media (max-width:600px){.co-row{grid-template-columns:1fr;row-gap:4px;padding-block:16px}}