/* 한국어·중국어·일본어 페이지(/ko/ /cn/ /ja/)에만 붙는다 — live/build_live.py 가 head 에 넣는다(영문 /en/ 은 원장님 site.css 그대로).
   2026-11-07 사용자 «한국어·중국어·일본어 폰트를 체크해 한 단계 낮추고, 이미지 안쪽으로 텍스트가 가리지 않게 이미지와 텍스트 사이 패딩을 지킨다». */

/* 글자 크기 한 단계 아래. 숫자(--fs-numeral)는 라틴 글꼴이라 그대로, 가장 작은 글자는 12px 아래로 내리지 않는다 */
html:lang(ko),html:lang(zh),html:lang(ja){
  --fs-display:clamp(2.25rem,4.6vw,4.5rem);    /* 46~92px → 36~72px */
  --fs-h2:clamp(1.625rem,2.7vw,2.625rem);      /* 32~52px → 26~42px */
  --fs-h3:clamp(1.1875rem,1.45vw,1.5rem);      /* 22~28px → 19~24px */
  --fs-h4:clamp(1rem,1.05vw,1.125rem);         /* 17~20px → 16~18px */
  --fs-lead:clamp(.9375rem,1.05vw,1.0625rem);  /* 16~19px → 15~17px */
  --fs-body:clamp(.875rem,.95vw,1rem);         /* 15~17px → 14~16px */
  --fs-caption:clamp(.75rem,.8vw,.8125rem);    /* 13~14px → 12~13px */
}

/* 글꼴: 한국어 명조(Noto Serif KR)에는 간체 598자·일본 한자 172자가 없어 PC 기본 글꼴이 섞여 나왔다.
   본문(Pretendard)에는 한자·가나가 없어 한국어 글꼴(맑은 고딕 등) 대신 그 나라 기본 고딕으로 */
html:lang(zh){
  --font-display:"Cormorant Garamond","Noto Serif SC","Noto Serif KR",Georgia,serif;
  --font-serif-kr:"Noto Serif SC","Noto Serif KR","Cormorant Garamond",Georgia,serif;
  --font-body:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",
              "Noto Sans SC",system-ui,sans-serif;
}
html:lang(ja){
  --font-display:"Cormorant Garamond","Noto Serif JP","Noto Serif KR",Georgia,serif;
  --font-serif-kr:"Noto Serif JP","Noto Serif KR","Cormorant Garamond",Georgia,serif;
  --font-body:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN",
              "Yu Gothic UI","Yu Gothic",Meiryo,"Noto Sans JP",system-ui,sans-serif;
}

/* 줄바꿈: site.css 의 keep-all(한국어 낱말 단위)은 띄어쓰기 없는 중국어·일본어 문장을 한 덩어리로 만들어 상자 밖·사진 위로 밀어냈다 */
html:lang(zh) body,html:lang(ja) body{word-break:normal;line-break:strict}
/* 칸보다 긴 낱말은 칸 안에서 끊는다 — 글자가 옆 사진으로 넘어가지 않게 */
html:lang(ko) body,html:lang(zh) body,html:lang(ja) body{overflow-wrap:break-word}

/* 첫 화면: 제목을 글자 칸(사진 왼쪽, 오른쪽 여백 24~64px) 안에 맞춘다. 가장 긴 낱말 «자연스러움,» ≈ 5.6자 → 칸 너비의 17% */
html:lang(ko) .hero__copy,html:lang(zh) .hero__copy,html:lang(ja) .hero__copy{container-type:inline-size}
html:lang(ko) .hero__copy .display,html:lang(zh) .hero__copy .display,html:lang(ja) .hero__copy .display{
  max-width:none;font-size:min(var(--fs-display),17cqi)}
/* 중국어·일본어는 띄어쓰기가 없어 낱말 중간에서 갈린다(«源自精/准设计的») → 한 줄(중국어 «源自精准设计的» 7자, 일본어 «綿密な設計が導く、» 9자)이 칸에 들어가는 크기 */
html:lang(zh) .hero__copy .display{font-size:min(var(--fs-display),13.5cqi)}
html:lang(ja) .hero__copy .display{font-size:min(var(--fs-display),10.5cqi)}

/* 머리글 메뉴도 한 단계 아래(16px → 15px, 1439px 이하 15px → 14px).
   일본어는 메뉴 이름이 길어 «お問い合わせ»가 언어 단추(KR·EN·中文) 위에 겹쳤다 → 자간 0·메뉴 사이 간격을 좁힌다 */
html:lang(ko) .nav .nav__link,html:lang(zh) .nav .nav__link,html:lang(ja) .nav .nav__link{font-size:.9375rem}
@media (max-width:1439px){
  html:lang(ko) .nav .nav__link,html:lang(zh) .nav .nav__link,html:lang(ja) .nav .nav__link{font-size:.875rem}
}
html:lang(ja) .nav .nav__link{letter-spacing:0}
html:lang(ja) .nav__list{gap:clamp(10px,.9vw,16px)}