/* 다국어 공용 — 라틴 글자는 기존 Pretendard(라틴 부분)만 따로 이름 붙여 쓴다.
   언어별 글꼴은 render 가 --font-sans 등을 'KW Latin', '<언어 글꼴>' 로 바꿔 끼운다. */
@font-face{font-family:'KW Latin';src:url('https://channel-static.rebeauty.co.kr/kowonps/en/assets/fonts/PretendardVariable.latin.woff2') format('woff2');font-weight:45 920;font-style:normal;font-display:swap;unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20A9,U+20AC,U+2122,U+2190-21FF,U+2212,U+2215,U+2248,U+2260-2265}

/* ── 언어 스위처 (데스크톱: 메뉴 줄 위 오른쪽 모서리, 모바일: 햄버거 왼쪽) ──
   데스크톱에서 메뉴 줄에 끼우면 1024~1279px 에서는 EN 메뉴만으로도 줄이 꽉 차 스위처가 화면 밖으로 밀린다
   → 헤더 위쪽 빈 띠(메뉴는 top 40px 부터)에 띄워 메뉴 폭을 전혀 쓰지 않게 한다. */
.lang-switch{position:relative;flex:none;z-index:2}
@media (min-width:1024px){
  .site-header__inner{position:relative}
  .lang-switch{position:absolute;top:6px;right:var(--gutter)}
}
.lang-switch__btn{
  display:flex;align-items:center;gap:6px;height:26px;padding:0 9px;
  border:1px solid currentColor;border-radius:999px;
  color:var(--text-inverse);background:transparent;
  font-family:var(--font-ui);font-weight:600;font-size:12px;letter-spacing:.04em;line-height:1;cursor:pointer;
}
.lang-switch__globe{width:15px;height:15px;flex:none}
/* 넓은 화면(1560px~): 메뉴 줄 오른쪽 바깥 빈자리(화면 오른쪽 끝)에 메뉴 글줄 높이로 — 그보다 좁으면 메뉴와 겹쳐 위쪽 띠에 둔다 */
@media (min-width:1560px){
  .lang-switch{top:36px;right:calc((1328px - 100vw) / 2 + 28px)}
  .lang-switch__btn{height:30px;padding:0 11px 0 9px;font-size:13px}
}
.lang-switch__caret{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.lang-switch.is-open .lang-switch__caret{transform:translateY(1px) rotate(-135deg)}
.site-header--solid .lang-switch__btn,.site-header.is-stuck .lang-switch__btn{color:var(--text-primary)}

.lang-switch__list{
  position:absolute;right:0;top:calc(100% + 8px);min-width:200px;padding:6px;
  background:#fff;border-radius:12px;box-shadow:0 12px 32px rgba(10,18,40,.18);
  opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .18s,transform .18s,visibility .18s;
}
.lang-switch.is-open .lang-switch__list{opacity:1;visibility:visible;transform:none}
.lang-switch__list a{
  display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;
  color:var(--text-primary);font-size:var(--fs-15, 15px);line-height:1.2;white-space:nowrap;
}
.lang-switch__list a:hover{background:#f3f4f8}
.lang-switch__list a[aria-current]{color:var(--brand);font-weight:700}
.lang-switch__c{display:inline-block;min-width:24px;font-family:'KW Latin',sans-serif;font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--text-secondary)}

@media (max-width:1023px){
  .lang-switch{margin:14px 6px 0 auto}
  .lang-switch__btn{height:30px;padding:0 9px;font-size:13px}
}
@media (max-width:767px){
  .lang-switch{margin-top:12px}
}

/* 중·일문은 띄어쓰기가 없어 원본의 word-break:keep-all 이면 한 줄로 이어져 화면을 넘는다 */
html:is([lang="ja"],[lang="zh-CN"],[lang="zh-TW"]) body *{word-break:normal!important;line-break:strict}
/* 홈 GNB 는 영문 길이에 맞춘 고정 폭이다 — 번역문은 내용 폭으로 */
html:not([lang="en"]) .gnb li{width:auto!important}
/* 로고 아래 태그라인은 124px(모바일 84px) 한 줄 — 긴 언어는 짧은 표기(~/kowon-i18n/overrides.json, RU·MN 은 영어 그대로) + 베트남어는 자간 0 */
html[lang="vi"] .brand__tagline{letter-spacing:0}
html:is([lang="ru"],[lang="mn"]) .brand__tagline{font-family:"Inter Tight","KW Latin",sans-serif}   /* 영어 그대로 — EN 과 같은 글꼴 */
/* 1024~1279px 는 EN 메뉴도 줄이 꽉 찬다 — 번역 메뉴는 항목 간격을 26→18px 로 좁혀 EN 과 같은 여유를 둔다 */
@media (min-width:1024px) and (max-width:1279px){
  html:not([lang="en"]) .gnb ul{gap:18px}
  html[lang="mn"] .gnb > ul > li > a{font-size:16px}   /* 몽골어는 짧은 표기로도 1024px 에서 46px 넘친다 */
}

/* 이미지 아래 번역 글(환자 질문 글 캡처 등) — 영어 이미지는 그대로, 그 아래에 이 언어 글 */
.kw-qtext{margin-top:12px;padding:16px 18px;background:var(--surface-muted,#f5f5f5);border:1px solid var(--line-soft,#d9d9d9);border-radius:10px;
  color:var(--text-primary,#333);font-family:var(--font-sans);font-size:15px;line-height:1.75;text-align:start;overflow-wrap:anywhere}
.kw-qtext p{margin:0 0 .55em}
.kw-qtext p:last-child{margin-bottom:0}
.kw-qtext__t{font-weight:700;font-size:16px}
.kw-qtext__a{margin-top:1em!important;padding-top:.8em;border-top:1px solid var(--line-soft,#d9d9d9);font-size:13px;font-weight:600;color:var(--text-secondary,#666)}
.kw-notice{margin:0;padding:18px 20px;background:var(--surface-muted,#f5f5f5);border:1px solid var(--line-soft,#d9d9d9);border-radius:10px;
  color:var(--text-secondary,#666);font-family:var(--font-sans);font-size:14px;line-height:1.7;text-align:center;overflow-wrap:anywhere}
.kw-notice p{margin:0}
.kw-notice p:first-child{color:var(--text-primary,#333);font-weight:600;padding-bottom:.7em;margin-bottom:.7em;border-bottom:1px solid var(--line-soft,#d9d9d9)}

/* 10-19 전수 점검 — 번역 글이 길어 넘치는 곳 */
/* 의사 역사 타임라인(about/doctor/history): 긴 라벨이 양끝에서 화면 밖으로 나가고 가운데끼리 겹친다 —
   라벨은 줄바꿈, 첫·끝 마디는 점을 축 끝에 둔 채 라벨을 안쪽으로 연다(점 위치 그대로). 아랍어는 flip_css.js 가 거울로 뒤집는다 */
html:not([lang="en"]) .dha__lab{white-space:normal;width:max-content;max-width:180px;text-align:center;line-height:1.35}
html:not([lang="en"]) .dha__node:first-of-type{transform:translateX(-13px);align-items:flex-start}
html:not([lang="en"]) .dha__node:last-of-type{transform:translateX(calc(-100% + 13px));align-items:flex-end}
html:not([lang="en"]) .dha__node:first-of-type .dha__lab{text-align:start}
html:not([lang="en"]) .dha__node:last-of-type .dha__lab{text-align:end}
@media (max-width:1279px){html:not([lang="en"]) .dha__lab{max-width:120px}}
@media (max-width:767px){html:not([lang="en"]) .dha__lab{max-width:150px}}
/* 러시아어 등 긴 낱말이 카드 제목 칸을 넘는다(blog 목록 모바일) — 칸을 넘는 낱말만 안에서 끊는다 */
html:not([lang="en"]) .card__title{overflow-wrap:anywhere}
/* tv 주제별 편수 줄은 한 줄 고정 — 몽골어는 모바일 폭을 넘는다 */
html:not([lang="en"]) .tv-cat__count{white-space:normal}
/* 칸보다 긴 낱말(번역문이 '·' 로 띄어쓰기 없이 이어 붙인 목록 등)은 그 낱말 안에서만 줄을 바꾼다 —
   들어가는 줄은 그대로(넘칠 때만 작동) */
html:not([lang="en"]) main :is(p,li,dd,dt,td,th,h1,h2,h3,h4,h5,figcaption,blockquote,.card__title,.hubcard__title){overflow-wrap:break-word}

/* WhatsApp 대신 LINE 을 쓰는 언어(JP)의 상담 버튼 — lang.js 가 kw-line 을 붙인다(LINE 초록) */
.qc__item--wa.kw-line .qc__label{border-color:#06c755;background:#f2fcf6;color:#05a046}
.qc__item--wa.kw-line .qc__icon{border-color:#06c755;background:#06c755}
