/* =====================================================================
   CN-only font stack override (2026-05-15 phase 17c)
   --dn-font 기본값(Inter + Noto Sans KR)에는 중국어 글리프가 없어
   CN 페이지에서 한자가 KR 폰트 fallback으로 렌더링되어 형태가 어색해 보임.
   html[lang="zh-CN"] 스코프에서 --dn-font 자체를 CN 우선으로 재정의.
   ===================================================================== */
html[lang="zh-CN"] {
  --dn-font: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', 'Source Han Sans SC', 'Hiragino Sans GB', 'Heiti SC', 'WenQuanYi Micro Hei', 'Noto Sans KR', -apple-system, sans-serif;
}
/* 한자 직접 노출 핵심 엘리먼트 — 시스템 폰트 fallback이 한자를 못 그려도 강제로 CN 폰트 사용 */
html[lang="zh-CN"] body,
html[lang="zh-CN"] h1,
html[lang="zh-CN"] h2,
html[lang="zh-CN"] h3,
html[lang="zh-CN"] h4,
html[lang="zh-CN"] p,
html[lang="zh-CN"] span,
html[lang="zh-CN"] li,
html[lang="zh-CN"] a,
html[lang="zh-CN"] div,
html[lang="zh-CN"] td,
html[lang="zh-CN"] th,
html[lang="zh-CN"] button,
html[lang="zh-CN"] input,
html[lang="zh-CN"] textarea,
html[lang="zh-CN"] .dn-doctor-intro__name,
html[lang="zh-CN"] .dn-page-hero__title,
html[lang="zh-CN"] .dn-page-hero__sub,
html[lang="zh-CN"] .dn-page-hero__label,
html[lang="zh-CN"] .cont_title,
html[lang="zh-CN"] .cont_title .big,
html[lang="zh-CN"] .cont_sub_title,
html[lang="zh-CN"] .cont_text,
html[lang="zh-CN"] .cont_text_title {
  font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', 'Source Han Sans SC', 'Hiragino Sans GB', 'Heiti SC', 'WenQuanYi Micro Hei', 'Noto Sans KR', -apple-system, sans-serif !important;
}

/* =====================================================================
   CN-only mobile UI hardening — 2026-05-15 v6
   Scope: html[lang="zh-CN"] (KR/EN/JP 영향 없음)
   목적:
     1. 모바일 상단 여백 확보 (헤더~제목 답답함 해소)
     2. 카드/박스 내 글씨 잘림 방지 + word-break
     3. CTA 버튼 최소 48px 높이 + 줄바꿈 허용
     4. 가로 스크롤 차단
     5. 카드 고정 height 해제
     6. FAQ 아코디언 모바일 줄바꿈
   디자인 기준 (사용자 룰 §6):
     - 모바일 본문 좌우 padding: 20px
     - 섹션 간격: 56~72px
     - 카드 내부 padding: 20~24px
     - H1 line-height: 1.25~1.35
     - 본문 line-height: 1.55~1.65
     - 버튼 최소 높이: 48px+
     - 카드 고정 height 금지
   ===================================================================== */

/* ───────────────────────────────────────────────────────────────
   [A] 가로 스크롤 차단 — 모든 viewport
   =================================================================== */
html[lang="zh-CN"],
html[lang="zh-CN"] body {
  overflow-x: hidden;
}
html[lang="zh-CN"] img,
html[lang="zh-CN"] video,
html[lang="zh-CN"] iframe,
html[lang="zh-CN"] table,
html[lang="zh-CN"] .slider,
html[lang="zh-CN"] .swiper,
html[lang="zh-CN"] .swiper-container,
html[lang="zh-CN"] .carousel,
html[lang="zh-CN"] .dn-cards__list,
html[lang="zh-CN"] .dn-implant-tabs {
  max-width: 100%;
}

/* ───────────────────────────────────────────────────────────────
   [B] 모바일 (≤ 768px) — 일반 보정
   =================================================================== */
@media (max-width: 768px) {

  /* ─ 본문 좌우 padding 통일 (.cont, .cont w1000 등) ─ */
  html[lang="zh-CN"] .cont,
  html[lang="zh-CN"] .cont_wrap {
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
  }

  /* ─ Hero 상단 여백 — dn-hero / dn-sub-hero / dn-page-hero ─ */
  html[lang="zh-CN"] .dn-hero,
  html[lang="zh-CN"] .dn-sub-hero,
  html[lang="zh-CN"] .dn-page-hero {
    padding-top: 64px;
    padding-bottom: 48px;
  }
  html[lang="zh-CN"] main > section:first-child,
  html[lang="zh-CN"] .content_wrap > section:first-child,
  html[lang="zh-CN"] .content_wrap > div:first-child {
    margin-top: 0;
  }

  /* ─ H1 / Hero 제목 라인높이 + 자연 줄바꿈 ─ */
  html[lang="zh-CN"] h1,
  html[lang="zh-CN"] .dn-hero__h1,
  html[lang="zh-CN"] .dn-sub-hero__title,
  html[lang="zh-CN"] .dn-page-hero__title {
    line-height: 1.3;
    margin-bottom: 14px;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  /* H1 자체 크기는 페이지별 clamp() 유지하되, 모바일 안전 상한 */
  html[lang="zh-CN"] .dn-hero__h1 {
    font-size: clamp(1.35rem, 5.5vw, 1.8rem);
  }
  html[lang="zh-CN"] .dn-sub-hero__title {
    font-size: clamp(1.25rem, 5vw, 1.7rem);
  }

  /* ─ Hero CTA — 48px+ 높이, 줄바꿈 허용 ─ */
  html[lang="zh-CN"] .dn-hero__cta-btn,
  html[lang="zh-CN"] .dn-view-more-btn,
  html[lang="zh-CN"] .dn-outline-btn,
  html[lang="zh-CN"] .ev_viewmore,
  html[lang="zh-CN"] .btn,
  html[lang="zh-CN"] .cta-button,
  html[lang="zh-CN"] .hero-cta a {
    min-height: 48px;
    height: auto;
    padding: 13px 18px;
    white-space: normal;
    line-height: 1.35;
    text-align: center;
    overflow-wrap: anywhere;
    word-break: break-word;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  html[lang="zh-CN"] .dn-hero__cta-wrap {
    gap: 10px;
    flex-wrap: wrap;
  }

  /* ─ 박스/카드 안 글씨 잘림 방지 + 고정 height 해제 ─
     실제 사용 클래스 + 사용자 명시 generic 클래스 동시 매칭 */
  html[lang="zh-CN"] .dn-card,
  html[lang="zh-CN"] .dn-proc-card,
  html[lang="zh-CN"] .dn-rv-card,
  html[lang="zh-CN"] .dn-insight-card,
  html[lang="zh-CN"] .dn-implant-panel,
  html[lang="zh-CN"] .dn-implant-method,
  html[lang="zh-CN"] .dn-faq__item,
  html[lang="zh-CN"] .cn-wk-card,
  html[lang="zh-CN"] .casebook-card,
  html[lang="zh-CN"] .ba-related__card,
  html[lang="zh-CN"] .rr-card,
  html[lang="zh-CN"] .rr-related__item,
  html[lang="zh-CN"] .wune-faq-accordion__item,
  html[lang="zh-CN"] .answer-summary,
  html[lang="zh-CN"] .card,
  html[lang="zh-CN"] .info-box,
  html[lang="zh-CN"] .procedure-card,
  html[lang="zh-CN"] .timeline-card,
  html[lang="zh-CN"] .implant-card,
  html[lang="zh-CN"] .quick-answer-card,
  html[lang="zh-CN"] .faq-item,
  html[lang="zh-CN"] .review-card,
  html[lang="zh-CN"] .event-card {
    height: auto !important;
    min-height: auto !important;
    overflow: visible;
    box-sizing: border-box;
  }

  /* 카드 내부 텍스트 줄바꿈 */
  html[lang="zh-CN"] .dn-card *,
  html[lang="zh-CN"] .dn-proc-card *,
  html[lang="zh-CN"] .dn-rv-card *,
  html[lang="zh-CN"] .dn-insight-card *,
  html[lang="zh-CN"] .dn-implant-panel *,
  html[lang="zh-CN"] .dn-implant-method *,
  html[lang="zh-CN"] .dn-faq *,
  html[lang="zh-CN"] .cn-wk-card *,
  html[lang="zh-CN"] .casebook-card *,
  html[lang="zh-CN"] .ba-related__card *,
  html[lang="zh-CN"] .rr-card *,
  html[lang="zh-CN"] .wune-faq-accordion__item *,
  html[lang="zh-CN"] .answer-summary *,
  html[lang="zh-CN"] .card *,
  html[lang="zh-CN"] .info-box *,
  html[lang="zh-CN"] .procedure-card *,
  html[lang="zh-CN"] .timeline-card *,
  html[lang="zh-CN"] .implant-card *,
  html[lang="zh-CN"] .quick-answer-card *,
  html[lang="zh-CN"] .faq-item *,
  html[lang="zh-CN"] .review-card *,
  html[lang="zh-CN"] .event-card * {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* ─ 본문 line-height 1.55~1.65 적용 (사용자 룰 §6) ─ */
  html[lang="zh-CN"] .dn-card p,
  html[lang="zh-CN"] .dn-proc-card p,
  html[lang="zh-CN"] .dn-insight-card p,
  html[lang="zh-CN"] .dn-implant-method p,
  html[lang="zh-CN"] .dn-faq__answer,
  html[lang="zh-CN"] .answer-summary p,
  html[lang="zh-CN"] .cn-wk-card p,
  html[lang="zh-CN"] .wune-faq-accordion__answer p {
    line-height: 1.65;
  }

  /* ─ FAQ 아코디언 — summary 2줄 대응, 글자 잘림 방지 ─ */
  html[lang="zh-CN"] .wune-faq-accordion__summary,
  html[lang="zh-CN"] .dn-faq__question {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.5;
    align-items: flex-start;
  }
  html[lang="zh-CN"] .wune-faq-accordion__answer,
  html[lang="zh-CN"] .dn-faq__answer {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* ─ Procedure 그리드 (메인 시술 카드) — 모바일 1열 ─ */
  html[lang="zh-CN"] .dn-procedures__grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  html[lang="zh-CN"] .dn-proc-card__caption {
    padding: 16px 18px 18px;
  }

  /* ─ Insight slider (시술 페이지 회복 타임라인) — 카드 width auto ─ */
  html[lang="zh-CN"] .dn-insight-card {
    min-width: 240px;
  }

  /* ─ Implant 비교 패널 — 카드 정렬 / overflow ─ */
  html[lang="zh-CN"] .dn-implant-panel {
    padding: 20px 18px;
  }
  html[lang="zh-CN"] .dn-implant-panel__grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* ─ Casebook (Before/After) 필터 버튼 줄바꿈 ─ */
  html[lang="zh-CN"] .casebook-finder a {
    white-space: normal;
    overflow-wrap: anywhere;
  }
  html[lang="zh-CN"] .casebook-finder__group {
    flex-wrap: wrap;
    gap: 6px;
  }

  /* ─ Realreview 카드 padding 통일 ─ */
  html[lang="zh-CN"] .rr-card__body {
    padding: 14px 16px 16px;
  }

  /* ─ 섹션 vertical 간격 56~72px (광범위 적용) ─ */
  html[lang="zh-CN"] .answer-summary {
    margin: 28px auto !important;
    padding: 24px 20px !important;
  }
  html[lang="zh-CN"] .cn-why-korea {
    padding: 56px 16px !important;
  }
  html[lang="zh-CN"] .dn-procedures {
    padding-top: 56px;
    padding-bottom: 56px;
  }

  /* ─ Map section — 모바일 iframe 높이 사용자 룰 (300px) 보존 ─ */
  html[lang="zh-CN"] .map_wrap iframe {
    border-radius: 14px;
  }
}

/* ───────────────────────────────────────────────────────────────
   [C] 작은 모바일 (≤ 480px / iPhone SE 375px) — 추가 보정
   =================================================================== */
@media (max-width: 480px) {
  html[lang="zh-CN"] .cont,
  html[lang="zh-CN"] .cont_wrap {
    padding-left: 16px;
    padding-right: 16px;
  }
  html[lang="zh-CN"] .dn-hero,
  html[lang="zh-CN"] .dn-sub-hero,
  html[lang="zh-CN"] .dn-page-hero {
    padding-top: 56px;
    padding-bottom: 40px;
  }
  html[lang="zh-CN"] .dn-hero__h1 {
    font-size: clamp(1.25rem, 6vw, 1.55rem);
    line-height: 1.32;
  }
  html[lang="zh-CN"] .dn-hero__cta-btn {
    width: 100%;          /* SE 폭에서 CTA 2개가 한 줄에 안 들어가면 1열 */
    max-width: 100%;
  }
  html[lang="zh-CN"] .dn-hero__cta-wrap {
    flex-direction: column;
    align-items: stretch;
  }

  /* casebook-finder 모바일 1열 stack */
  html[lang="zh-CN"] .casebook-finder__row {
    flex-direction: column;
    align-items: stretch;
  }
}

/* ───────────────────────────────────────────────────────────────
   [D] 라인 길이 안전 보정 — 영문/숫자 토큰 줄바꿈
   (모든 viewport — 이상태 디자인 안전성)
   =================================================================== */
html[lang="zh-CN"] .dn-hero__h1,
html[lang="zh-CN"] .dn-sub-hero__title,
html[lang="zh-CN"] .dn-page-hero__title,
html[lang="zh-CN"] .dn-insight-card__title,
html[lang="zh-CN"] .dn-proc-card__title,
html[lang="zh-CN"] .dn-implant-method__name,
html[lang="zh-CN"] .casebook-card__title,
html[lang="zh-CN"] .rr-card__title,
html[lang="zh-CN"] .cn-wk-card h3,
html[lang="zh-CN"] .wune-faq-accordion__summary {
  overflow-wrap: anywhere;
  word-break: break-word;
}
