/* ============================================================
   강남서연성형외과 한국어 타이포그래피 기준 v1 (2026-09-20) — 한국어 페이지 공통
   근거 문서: /design-guide/typo-standard/
   범위: html[lang="ko"] 의 본문(헤더·푸터·플로팅 바 제외). 다른 10개 언어는 기존 규칙 유지.
   원칙: 줄바꿈은 손이 아니라 규칙으로 — 제목은 균형(balance), 본문은 고아 방지(pretty),
        짧은 강조·조사·가운뎃점·의존어는 묶음째 이동(nowrap), 폰에서는 손으로 넣은 <br> 을 무시한다.
   서체·색·굵기·13×1.3 크기 사다리는 바꾸지 않는다. 폰 하한과 좁은 칸만 정한다. 브레이크포인트는 사이트와 같은 720px.
   ============================================================ */
html[lang="ko"]{
  --t-body-min: 1rem;       /* 폰 본문 하한 16px (사이트 기본 16.9px 유지) */
  --t-lh: 1.65;             /* 본문 줄간(사이트 기본값) */
  --t-measure: 720px;       /* 글 본문 폭(사이트 .prose/.def-block 과 같은 720) */
}

/* ── 공통 조판: 낱말 단위, 문단은 고아 방지, 제목은 균형 ── */
html[lang="ko"] body :is(p,li,dd,figcaption,blockquote){ word-break:keep-all; overflow-wrap:break-word; text-wrap-style:pretty }
html[lang="ko"] body :is(h1,h2,h3,h4,.sec-head h2,.sig-card h3,.col-title,.rel-title,.press-title,.hero-card-title,.qw-t,.fact-callout h3,.method-head-l h3,.art-h3,.article-h1,.subhero h1,.hero-quote-inner h2){ word-break:keep-all; text-wrap-style:balance }
html[lang="ko"] body :is(b,strong){ text-wrap-style:balance }
html[lang="ko"] body :is(.tv-slide-info h4,.conf-slide-info h4,.col-title,.press-title){ text-wrap-style:pretty }   /* JS 로 들어오는 영상·학회·칼럼 카드 제목(3~6줄)은 균형보다 고아 방지 */

/* ── 인라인 강조: 12자 이하는 줄 중간에서 안 끊긴다. 13자 이상(.u-long)은 낱말 단위로 ── */
html[lang="ko"] body :is(p,li,dd) :is(b,strong).u{ white-space:nowrap }
html[lang="ko"] body :is(p,li,dd) :is(b,strong).u-long{ white-space:normal }
html[lang="ko"] body :is(li,dd) > :is(b,strong).u:first-child{ white-space:normal }   /* 항목 첫 자리 라벨은 묶지 않는다 */
html[lang="ko"] body .nb{ white-space:nowrap }   /* 따옴표·괄호 뒤 조사, 가운뎃점, 의존어 묶음 */
html[lang="ko"] body .tx{ min-width:0 }          /* flex 항목 안 텍스트 묶음 */
html[lang="ko"] body .contact-list > li > strong{ white-space:nowrap; letter-spacing:1px }   /* 90px 라벨 칸의 ADDRESS 가 두 줄로 갈라지던 것 */

/* ── 카드 제목의 한 줄 말줄임(.sig-card h3 nowrap)은 폰에서 두 줄 균형으로 ── */
@media (max-width:720px){
  html[lang="ko"] body .sig-card h3{ white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; text-overflow:clip }
}

/* ── 텍스트 폭: 가운데 정렬 긴 문단은 720px 안에서 ── */
html[lang="ko"] body :is(.sec-head p,.method-desc,.fact-callout p,.def-block-text p){ max-width:var(--t-measure); margin-left:auto; margin-right:auto }

/* ── 폰(≤720px): 손 줄바꿈 무시, 본문 16px 하한, 좁은 칸 해소 ── */
@media (max-width:720px){
  html[lang="ko"] body br.mb-br{ display:none }
  /* 본문급 글자는 16px 아래로 내려가지 않는다 — 안내·눈썹·캡션·표 안 글자는 제외 */
  html[lang="ko"] body :where(p,li,dd):where(:not(.ba-theft-notice,.cf-hint,.footer-disclaimer,.col-card-foot,.sec-eyebrow,.subhero-eyebrow,.media-card-eyebrow,.fact-callout-eyebrow,[class*="eyebrow"],.breadcrumb-inner *,.qw-head *,.cal-tag,td *,th *)){ font-size:max(var(--t-body-min),1em) }
  html[lang="ko"] body .qw-head p{ font-size:var(--t-body-min) }
  html[lang="ko"] body .ab-philo-body p, html[lang="ko"] body .rm-card p{ font-size:var(--t-body-min) }
}
@media (max-width:560px){
  /* 「이런 분께」 2열 격자(칸 115px)·이유 격자·방법 머리 flex 는 1열 — 마지막 줄 한두 글자 고아를 만든다 */
  html[lang="ko"] body .target-num-list, html[lang="ko"] body .target-num-list[style*="grid-template-columns"]{ grid-template-columns:minmax(0,1fr) !important; max-width:420px; margin-left:auto; margin-right:auto }
  html[lang="ko"] body .target-num-item{ padding:16px 18px; text-align:left; display:grid; grid-template-columns:auto minmax(0,1fr); gap:0 12px; align-items:center }
  html[lang="ko"] body .method-head{ flex-direction:column; align-items:flex-start; gap:8px }
  html[lang="ko"] body .method-head p{ text-align:left }
  html[lang="ko"] body .timeline{ grid-template-columns:minmax(0,1fr) }
  html[lang="ko"] body .credibility-card, html[lang="ko"] body .dr-emphasis-item{ align-items:flex-start }
}