/*
 * 번역 페이지 전용 글자 맞춤 보정 — 국문 페이지(lang="ko", 자동번역 아님)에는 적용되지 않음.
 * 한국어 길이에 맞춰 폭이 고정된 칸에 더 긴 번역문이 들어갈 때만 글자 크기·줄바꿈을 조정한다.
 * 애니메이션·전환 관련 속성(transition, translate, opacity, animation)은 건드리지 않는다.
 */

/* PC 상단 메뉴는 언어마다 필요한 폭이 달라 i18n-fit.js 가 넘칠 때만 간격·글자를 단계적으로 줄인다 */

/* 안전 PROCESS 카드: 문장이 길면 카드 아래로 잘리므로 아래쪽 기준으로 배치하고 글자를 조금 줄임 */
@media (min-width: 768px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .ms-pr-txt { top: auto; bottom: 6%; transform: none; padding-inline: .75rem; }
  :is(html:not([lang="ko"]), html.i18n-machine) .ms-pr-title { font-size: 1.0625rem; line-height: 1.3; }
  :is(html:not([lang="ko"]), html.i18n-machine) .ms-pr-desc { font-size: .8125rem; line-height: 1.45; }
}

/* 오른쪽 퀵메뉴(모바일 52×52 · PC 70×70 칸): 글자 크기는 원본 이하로만, 두 단어 이상이면 칸 안에서 줄바꿈 */
:is(html:not([lang="ko"]), html.i18n-machine) .ss-quick a {
  line-height: 1.15; text-align: center; padding-inline: .125rem;
}
@media (min-width: 992px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .ss-quick a { font-size: .6875rem; }
}

/* 하단 상담 바 */
:is(html:not([lang="ko"]), html.i18n-machine) .ss-consult-submit { line-height: 1.1; padding-inline: .375rem; }
@media (max-width: 767.98px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .ss-consult-agree { white-space: normal; line-height: 1.25; font-size: .6875rem; }
  :is(html:not([lang="ko"]), html.i18n-machine) .ss-consult-agree .ss-check { min-width: 0; }
}

/* 시그니처 카드 해시태그, 팝업 탭 */
:is(html:not([lang="ko"]), html.i18n-machine) .ms-sig-sub { white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 767.98px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .ms-sig-sub { font-size: .75rem; line-height: 1.35; }
  :is(html:not([lang="ko"]), html.i18n-machine) .ms-pop-tabs a,
  :is(html:not([lang="ko"]), html.i18n-machine) .ms-pop-tabs button { white-space: normal; line-height: 1.2; font-size: .8125rem; }
}

/* 본문 글 줄바꿈: 원본은 한국어 길이에 맞춰 일부 문단을 한 줄 고정(nowrap)+<br> 로 나눴다.
   번역문은 길이가 달라 화면 밖으로 나가므로, 번역 페이지의 본문 글만 칸 폭에서 줄바꿈하고 긴 단어는 칸 끝에서 끊는다.
   (메뉴·버튼·탭은 대상 아님 — 애니메이션 관련 속성도 건드리지 않음) */
:is(html:not([lang="ko"]), html.i18n-machine) :is(p, h1, h2, h3, h4, h5, h6, li, dt, dd, figcaption, blockquote, th, td) {
  white-space: normal !important;
  overflow-wrap: break-word;
  hyphens: auto;
}

/* 바디지방흡입 비교 그림의 라벨: 원본은 한 줄 고정이라 긴 번역문이 화면 밖으로 나감 → 두 줄까지 허용 */
:is(html:not([lang="ko"]), html.i18n-machine) .bd-tube-pill {
  white-space: normal; height: auto; min-height: 2.5rem; max-width: 46%; text-align: center; line-height: 1.15; padding-block: .35rem;
}
@media (max-width: 991.98px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .bd-tube-pill { min-height: 2rem; font-size: .875rem; padding-inline: .75rem; }
  :is(html:not([lang="ko"]), html.i18n-machine) .bd-tube-pills { height: 3.25rem; }
}

/* 띄어쓰기가 없는 언어(일본어·중국어·태국어): 원본의 word-break: keep-all 이면 문장 전체가 한 덩어리가 되어
   줄바꿈이 안 되므로 글자 단위 줄바꿈을 허용 (금칙 처리는 line-break: strict) */
html:is([lang="ja"], [lang="zh-Hans"], [lang="zh-Hant"], [lang="th"]) body,
html:is([lang="ja"], [lang="zh-Hans"], [lang="zh-Hant"], [lang="th"]) body * {
  word-break: normal !important;
  line-break: strict;
}

/* 그림 위 설명 라벨(복부거상 봉합 그림 등): 한 줄 고정 → 두 줄 허용 */
:is(html:not([lang="ko"]), html.i18n-machine) .bd-pin { white-space: normal; max-width: 46vw; }

/* 하단 상담 폼: 선택 상자 폭이 가장 긴 항목 이름에 맞춰 늘어나 폼이 화면보다 넓어짐 → 칸 폭 안으로 */
:is(html:not([lang="ko"]), html.i18n-machine) .ss-consult-form > * { min-width: 0; }
:is(html:not([lang="ko"]), html.i18n-machine) .ss-consult-form select { min-width: 0; max-width: 100%; text-overflow: ellipsis; }

/* 가슴 수술 타임라인 마지막 항목 제목: 한 줄 고정 → 줄바꿈 허용 */
:is(html:not([lang="ko"]), html.i18n-machine) .br-tl-item-end .br-tl-k { white-space: normal; }

/* 피부 시술 아이콘 라벨: 긴 합성어(독일어 등)가 칸을 넘으면 칸 끝에서 끊음 */
:is(html:not([lang="ko"]), html.i18n-machine) .sk-icons-t { min-width: 0; overflow-wrap: anywhere; }

/* 안전 시스템 목록(격자): 칸이 가장 긴 단어 폭만큼 늘어나지 않도록 */
:is(html:not([lang="ko"]), html.i18n-machine) .hi-sf > * { min-width: 0; }

/* 병원 안내 표: 왼쪽 항목명 칸은 번역문 길이만큼 넓히고, 오른쪽 진료시간은 칸 안에서 줄바꿈 */
:is(html:not([lang="ko"]), html.i18n-machine) .hi-info-row > * { min-width: 0; }
:is(html:not([lang="ko"]), html.i18n-machine) .hi-info-k { text-align: start; }
:is(html:not([lang="ko"]), html.i18n-machine) .hi-hours dt,
:is(html:not([lang="ko"]), html.i18n-machine) .hi-hours dd,
:is(html:not([lang="ko"]), html.i18n-machine) .hi-hours dd span { white-space: normal; }
@media (max-width: 575.98px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .hi-info-row { grid-template-columns: minmax(5.5rem, min-content) minmax(0, 1fr); }
  /* 요일·시간을 나란히 두면 오른쪽 시간이 잘게 쪼개지므로 요일 아래에 시간 */
  :is(html:not([lang="ko"]), html.i18n-machine) .hi-hours { grid-template-columns: minmax(0, 1fr); }
  :is(html:not([lang="ko"]), html.i18n-machine) .hi-hours dd + dt { margin-top: .375rem; }
}
@media (min-width: 992px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .hi-info-row { grid-template-columns: minmax(9rem, max-content) minmax(0, 1fr); }
}

/* 바디 지방흡입 부위 탭(PC 8rem 고정): 긴 부위명은 버튼을 글자만큼 넓힘 */
@media (min-width: 768px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .bd-kv-tab { width: auto; min-width: 8rem; white-space: nowrap; }
}

/* 가슴 상세 첫 화면 분홍 제목 상자: 긴 번역 제목(독일어 합성어 등)이 상자·화면 밖으로 나가지 않게 */
:is(html:not([lang="ko"]), html.i18n-machine) .br-kv-title { max-width: 100%; overflow-wrap: anywhere; hyphens: auto; }
@media (max-width: 575.98px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .br-kv-title { font-size: clamp(1.5rem, 7.5vw, 2.25rem); padding-inline: .75rem; }
}

/* 줄기세포 페이지 특징 칩(가운데 정렬 flex 칸): 긴 합성어는 칸 끝에서 끊음 */
:is(html:not([lang="ko"]), html.i18n-machine) .nv-proof-chips li { overflow-wrap: anywhere; hyphens: auto; }
@media (max-width: 575.98px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .nv-proof-chips li { font-size: .8125rem; padding-inline: .25rem; }
}

/* 안티에이징 비교표(중안면 거상 vs 하안검): 번역문은 한국어보다 길어 줄이 늘고 가운데 항목명 칸(폭 고정)을 넘으므로
   번역 페이지에서는 표 글자를 한 단계씩 줄이고, 세 칸 모두 가운데 정렬·같은 줄 간격으로 맞춤 (칸 높이·구조는 원본 그대로) */
:is(html:not([lang="ko"]), html.i18n-machine) :is(.aa-vs-a, .aa-vs-b, .aa-vs-k) {
  text-align: center; line-height: 1.3; overflow-wrap: break-word; hyphens: auto;
}
:is(html:not([lang="ko"]), html.i18n-machine) .aa-vs-k { padding-inline: .375rem; }
@media (min-width: 768px) {
  :is(html:not([lang="ko"]), html.i18n-machine) :is(.aa-vs-a, .aa-vs-b) { font-size: .875rem; }
  :is(html:not([lang="ko"]), html.i18n-machine) .aa-vs-k { font-size: .8125rem; }
}
@media (min-width: 992px) {
  :is(html:not([lang="ko"]), html.i18n-machine) :is(.aa-vs-a, .aa-vs-b) { font-size: .9375rem; }
  :is(html:not([lang="ko"]), html.i18n-machine) .aa-vs-k { font-size: .9375rem; }
}
@media (min-width: 1400px) {
  :is(html:not([lang="ko"]), html.i18n-machine) :is(.aa-vs-a, .aa-vs-b) { font-size: 1.0625rem; }
  :is(html:not([lang="ko"]), html.i18n-machine) .aa-vs-k { font-size: 1.0625rem; }
}

/* 안티에이징 원형 단계 그림(모바일 지름 약 90px): 긴 단어가 옆 원으로 넘어가지 않게 글자를 조금 줄이고 필요하면 끊음 */
@media (max-width: 767.98px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .aa-circ-c { font-size: max(.5625rem, 2.4cqw); overflow-wrap: anywhere; hyphens: auto; }
}

/* 병원 소개 글로벌 서비스 카드(폭 12.5rem 고정): 번역문 긴 단어가 카드 끝에 닿지 않게 글자를 한 단계 줄이고 필요하면 끊음 */
:is(html:not([lang="ko"]), html.i18n-machine) .ha-gcard-t { font-size: 1.0625rem; overflow-wrap: anywhere; hyphens: auto; }
:is(html:not([lang="ko"]), html.i18n-machine) .ha-gcard { padding-inline: .5rem; }

/* 하단 정보(오시는 길·상담 문의·진료 시간): 왼쪽 항목명 칸이 한국어 4~5글자 폭이라 번역 항목명이 단어 중간에서 끊기고
   값과 붙음 → 번역 페이지는 항목명 칸을 넓히고 칸 사이 간격을 둠 (항목명은 단어 단위로만 줄바꿈) */
:is(html:not([lang="ko"]), html.i18n-machine) .ss-footer-row { grid-template-columns: 7.5rem minmax(0, 1fr); column-gap: .75rem; }
:is(html:not([lang="ko"]), html.i18n-machine) .ss-footer-row dt { line-height: 1.35; padding-block: .2rem; overflow-wrap: normal; word-break: normal; }
@media (min-width: 768px) {
  :is(html:not([lang="ko"]), html.i18n-machine) .ss-footer-row { grid-template-columns: 8.5rem minmax(0, 1fr); }
}
/* 상담 바 "자세히" 링크는 두 단어 번역(Ver más 등)도 한 줄로 */
:is(html:not([lang="ko"]), html.i18n-machine) .ss-consult-more { white-space: nowrap; flex: none; }
