/* ============================================================================
   PeakCare — Localisation styles
   1) 语言切换器
   2) 防溢出兜底
   3) 德语 / 英语的排版差异
   ========================================================================== */

/* ── 1. 语言切换器 ─────────────────────────────────────────────────────── */
.pc-lang {
  display: inline-flex;
  align-items: stretch;
  gap: 2px;
  padding: 3px;
  border: 1px solid rgba(201, 169, 110, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  flex-shrink: 0;
}

.pc-lang-btn {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 0.34rem 0.85rem;
  border-radius: 999px;
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.2;
  color: rgba(232, 234, 240, 0.55);
  transition: color 0.25s, background 0.25s, box-shadow 0.25s;
  white-space: nowrap;
}

.pc-lang-btn:hover { color: #E8C97A; }

.pc-lang-btn.is-active {
  color: #0A0D14;
  background: linear-gradient(135deg, #E8C97A 0%, #C9A96E 100%);
  box-shadow: 0 2px 10px rgba(201, 169, 110, 0.28);
  font-weight: 600;
}

.pc-lang-btn:focus-visible {
  outline: 2px solid #C9A96E;
  outline-offset: 2px;
}

/* 移动端顶栏内的紧凑切换器（汉堡按钮左侧） */
.pc-lang--compact .pc-lang-btn { padding: 0.3rem 0.55rem; font-size: 0.68rem; }
@media (max-width: 359px) { .pc-lang--compact .pc-lang-btn { padding: 0.26rem 0.4rem; font-size: 0.64rem; } }

/* 移动端菜单内的切换器：整行铺开，触控区足够大 */
.pc-lang--mobile {
  display: flex;
  width: 100%;
  margin-top: 0.75rem;
}
.pc-lang--mobile .pc-lang-btn {
  flex: 1 1 0;
  padding: 0.65rem 0.5rem;
  font-size: 0.8125rem;
}

/* 报告页 / 法务页：固定在右上角 */
#lang-switch.lang-switch--floating .pc-lang {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 900;
}

@media (max-width: 479px) {
  .pc-lang-btn { padding: 0.3rem 0.6rem; font-size: 0.7rem; }
}

/* ── 2. 防溢出兜底（两种语言都适用） ─────────────────────────────────── */
p, h1, h2, h3, h4, h5, h6, li, a, span, button, label, td, th, figcaption, dd, dt {
  overflow-wrap: break-word;
  word-break: normal;
}

/* 标题：text-wrap:balance 让多行标题自动均衡行长，避免"末行单词孤儿";
   平板/桌面下比 pretty 更能主动把末词上移到前一行，对短句标语效果最好 */
h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}
/* 正文段落：pretty 避免段尾单词孤儿 */
p, li, .lead, .body-text, figcaption {
  text-wrap: pretty;
}

/* 按钮与胶囊标签：过长时允许折行，绝不撑破容器 */
.btn, .btn-primary, .btn-secondary, .btn-green, .btn-ghost,
.cytoprime-cta-btn, .hero-badge, .cert-badge, .chip, .badge,
.nav-link, .mobile-nav-link {
  white-space: normal;
  text-align: center;
  max-width: 100%;
}

/* ── 3. 德语 / 英语排版差异 ───────────────────────────────────────────── */

/* 德语：启用连字符断词，复合词可在音节处断开（仅正文，展示标题除外） */
html[lang="de"] body {
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  hyphenate-limit-chars: 8 4 4;
  letter-spacing: 0.004em;
}

/* 展示标题（h1-h3）：禁用连字符断词。
   —— 标题是展示级文字，mid-word 断词（如 "Lebens-/qualität"）观感很差，
      改用 overflow-wrap:break-word 兜底 + text-wrap:pretty 让行末更均衡。
      正文（p/li）仍保留 hyphens:auto 以处理超长德语复合词。 */
html[lang="de"] h1,
html[lang="de"] h2,
html[lang="de"] h3,
html[lang="en"] h1,
html[lang="en"] h2,
html[lang="en"] h3 {
  -webkit-hyphens: manual;
  -ms-hyphens: manual;
  hyphens: manual;
  overflow-wrap: break-word;
}

/* 德语文本偏长：放松行高、让容器容得下更长的词 */
html[lang="de"] p,
html[lang="de"] li,
html[lang="de"] .lead,
html[lang="de"] .body-text {
  line-height: 1.74 !important;
}

html[lang="de"] .btn,
html[lang="de"] .btn-primary,
html[lang="de"] .btn-secondary,
html[lang="de"] .btn-green,
html[lang="de"] .btn-ghost,
html[lang="de"] .cytoprime-cta-btn {
  /* 按钮禁用自动断词：避免 "Veränderung" 拆成 "Ver-än-de-rung" 形成 3 行
     改用 overflow-wrap:break-word 兜底，必要时仅在极端长词处断开 */
  hyphens: manual;
  -webkit-hyphens: manual;
  -ms-hyphens: manual;
  overflow-wrap: break-word;
  line-height: 1.35;
}

/* FAQ 折叠项标题（legal-support 页）：同样禁用自动断词 */
.faq-q-text,
.faq summary {
  hyphens: manual;
  -webkit-hyphens: manual;
  -ms-hyphens: manual;
}

/* 德语：覆盖页面内建的 nowrap —— 长词必须能折行，宁可换行也不溢出 */
html[lang="de"] .chip,
html[lang="de"] .badge,
html[lang="de"] .cert-badge,
html[lang="de"] .sci-label,
html[lang="de"] .nav-back,
html[lang="de"] .dropdown-link,
html[lang="de"] .nav-link,
html[lang="de"] .mobile-nav-link,
html[lang="de"] .nav-brand,
html[lang="de"] table.ing th,
html[lang="de"] .chart-head,
html[lang="de"] .ing-name,
html[lang="de"] .ing-origin {
  white-space: normal;
}

/* 首屏价值胶囊：德/英文都比中文长得多，窄屏允许折行（宽屏保持单行美观） */
@media (max-width: 900px) {
  .hero-value-item { white-space: normal; }
  .hero-value-item span { overflow-wrap: break-word; }
  .hero-value-sep { display: none; }
}

/* 德语导航与标签更长：略收字号与字距，避免换行挤压 */
@media (min-width: 1024px) {
  html[lang="de"] .nav-link {
    font-size: 0.78rem;
    letter-spacing: 0.005em;
  }
  html[lang="de"] .sci-label { font-size: 0.8rem; }
  html[lang="de"] .cert-badge { min-width: 150px; }
}

/* 德语表格单元格更易换行 */
html[lang="de"] td,
html[lang="de"] th {
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  line-height: 1.55;
}

/* 英语：文本偏短，收紧行高与字距，留白更紧凑 */
html[lang="en"] body { letter-spacing: -0.004em; }

html[lang="en"] p,
html[lang="en"] li,
html[lang="en"] .lead,
html[lang="en"] .body-text {
  line-height: 1.6 !important;
}

/* ── 4. 断点收窄：德/英文比中文长，中尺寸与小屏需要额外让位 ───────────── */

/* 展示标题字号地板：德/英文比中文长，压一档字号让 text-wrap:balance
   能把末词上移、标题缩回到 2 行，避免单字孤儿行（如 "essence."/"engine."）。
   仅作用于小屏/中屏；宽屏容器够宽，balance 自己就够。 */
@media (max-width: 1023px) {
  html[lang="de"] h1,
  html[lang="de"] h2,
  html[lang="en"] h1,
  html[lang="en"] h2 {
    font-size: calc(clamp(1.5rem, 4.6vw, 2.75rem) * 0.92);
  }
}
@media (max-width: 767px) {
  html[lang="de"] h1,
  html[lang="de"] h2,
  html[lang="en"] h1,
  html[lang="en"] h2 {
    font-size: calc(clamp(1.5rem, 4.6vw, 2.75rem) * 0.9);
  }
}

/* 平板 768–1023px：导航条目变长，压缩间距与字号，避免撑出视口 */
@media (min-width: 768px) and (max-width: 1023px) {
  #site-header > div { gap: 0.75rem !important; padding-left: 1rem !important; padding-right: 1rem !important; }
  #site-header nav   { gap: 0.9rem !important; }
  .nav-link          { font-size: 0.72rem !important; letter-spacing: 0.01em !important; }
  #site-header .btn-primary { padding: 0.5rem 1rem !important; font-size: 0.75rem !important; }
  .pc-lang-btn       { padding: 0.3rem 0.6rem; font-size: 0.7rem; }
}

/* CytoPrime 顶部导航：窄屏隐藏导航内的咨询按钮（底部吸底栏已提供同样入口） */
@media (max-width: 600px) {
  #cp-nav { gap: 0.5rem; }
  #cp-nav > .btn-green { display: none; }
  #cp-nav .nav-brand { min-width: 0; }
  .pc-lang-btn { padding: 0.28rem 0.5rem; font-size: 0.68rem; }
}

/* 法务 / 支持页顶栏：标题过长时省略，Logo 与返回键不被挤出 */
@media (max-width: 620px) {
  #top-nav { padding: 0 1rem; gap: 0.6rem; }
  /* 顶栏空间不足：页面标题让位（侧边栏仍可导航），避免被截成碎片 */
  #top-nav .nav-page-title { display: none; }
  #top-nav .nav-logo, #top-nav .back-link { flex-shrink: 0; }
  #top-nav .nav-divider { display: none; }
}

/* 首屏切换前的防闪烁：由 i18n.js 移除该 class */
html.i18n-pending body { visibility: hidden; }