/* 기존 브랜드를 유지하는 언어 선택. 새 글꼴 파일은 들이지 않는다. */
.language-menu{position:relative;flex-shrink:0;font-size:14px;line-height:1.5}
.language-menu summary{display:flex;align-items:center;gap:8px;min-height:44px;padding:8px 12px;cursor:pointer;list-style:none;border:1px solid var(--line);border-radius:6px}
.language-menu summary::-webkit-details-marker{display:none}
.language-menu summary::after{content:"";width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);margin-top:-3px}
.language-menu[open] summary::after{transform:rotate(225deg);margin-top:3px}
.language-menu nav{position:absolute;right:0;top:calc(100% + 8px);min-width:168px;padding:8px;background:var(--surface);border:1px solid var(--line);border-radius:6px;z-index:60}
.language-menu ul{padding:0;margin:0;list-style:none}
.language-menu a{display:flex;align-items:center;min-height:44px;padding:8px 12px;white-space:nowrap}
.language-menu a:hover,.language-menu a[aria-current]{background:var(--selected);color:var(--ink);text-decoration:underline;text-underline-offset:5px}
.language-menu :focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.company-nav>.wrap{gap:24px}
.company-nav .language-menu{margin-left:0}
/* 일본어 · 간체는 기기 글꼴 그대로(2026-11-15 조정 결정: Noto 등 글꼴 파일을 들이지 않음). 이름만 적고 받지 않는다. */
:lang(ja){--font:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI","Yu Gothic",Meiryo,"Noto Sans JP",system-ui,sans-serif;word-break:normal;overflow-wrap:anywhere;line-break:strict}
:lang(zh-Hans){--font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei UI","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;word-break:normal;overflow-wrap:anywhere;line-break:strict}
html:lang(ja) .studio h1,html:lang(ja) .studio h2,html:lang(zh-Hans) .studio h1,html:lang(zh-Hans) .studio h2{font-family:var(--font)}
html:lang(en){overflow-wrap:anywhere}
html:lang(en) .company h1,html:lang(en) .company h2,html:lang(en) .company h3,html:lang(en) .company h4{text-wrap:balance}
@media(max-width:1100px){
  .top .menu{display:none}
  .top .right{margin-left:auto}
  .top .right>.link{display:none}
}
@media(max-width:760px){
  .company-nav>.wrap{gap:12px}
  .company-nav .language-menu{margin-left:auto}
  .top>.wrap{flex-wrap:wrap;height:auto;min-height:68px;gap:10px;padding-block:12px}
  .top .right{gap:8px}
  .top .right>.btn{display:none}
  .language-menu summary{padding-inline:10px}
  .company .product-name{flex-wrap:wrap;gap:12px}
  .model-pipeline li{min-width:0}
}
@media(prefers-reduced-motion:reduce){.language-menu *{transition:none}}
@media(max-width:760px){
  .mobile-nav summary .menu-label{font-size:14px;white-space:nowrap}
  .mobile-nav summary{gap:8px;min-width:44px;justify-content:center}
  .company-nav .brand{flex-shrink:1;min-width:0}
  .company-nav .brand img{max-width:100%;height:auto;max-height:19px}
}
@media(max-width:380px){
  .mobile-nav summary .menu-label{display:none}
  .company-nav>.wrap{gap:8px}
}
/* CJK 대체 글꼴도 줄 상자가 겹치지 않도록 Office 제목의 행간을 확보한다. */
html:lang(ja) .office h1,html:lang(zh-Hans) .office h1{line-height:1.25}
/* 흑백 홈 · 제품 소개(/, /design/, /earlysearch/ — home.css): 위 띠 오른쪽의 언어 메뉴, 일본어 · 간체 기기 글꼴 */
html:lang(ja) body.mono,html:lang(zh-Hans) body.mono{font-family:var(--font)}
.m-head .m-nav{margin-left:auto}
.mono .language-menu{--selected:#1d1d1d;--ink:#fff;--focus:#d4d4d4;color:#a6a6a6}
.mono .language-menu summary{border-color:#2d2d2d}
.mono .language-menu summary:hover,.mono .language-menu[open] summary{color:#fff}
.mono .language-menu nav{background:#151515;border-color:#3b3b3b}
.mono .language-menu a{color:#d8d8d8}
@media(max-width:860px){
  .m-head .language-menu{margin-left:auto}
  .js .m-head .menu-toggle{margin-left:4px}
}
/* 380px 아래: 회사 마크를 줄이지 않는다(규칙: 휴대폰 19px). 언어 · 메뉴 단추를 40px 정사각으로 줄이고 위 띠 여백을 좁혀 한 줄에 둔다. */
@media(max-width:380px){
  .language-menu summary{width:40px;padding:8px 0;justify-content:center;gap:0}
  .language-menu summary::after{display:none}
  .company-nav>.wrap{gap:6px;padding-inline:14px}
  .company-nav .brand,.m-head .brand{flex-shrink:0}
  .company-nav .brand img{max-width:none;height:19px;width:auto}
  .company-nav .mobile-nav summary{width:40px;min-width:40px;padding-inline:0}
  .m-head .wrap{gap:4px}
  .js .m-head .menu-toggle{width:40px;margin-left:0}
}
@media(max-width:400px){html:lang(ja) .mobile-nav summary .menu-label{display:none}}