/* ==========================================================================
   Haven Bridge · i18n.css
   只做"语言切换器 + 译文排版"的最小补充，不改动 site.css 的任何既有规则。
   ========================================================================== */

:root { color-scheme: dark; }

/* ---- 顶部语言切换器（原生 select，24 种语言，可无限扩展） ---- */
select.lang-switch {
  appearance: none;
  -webkit-appearance: none;
  background-color: transparent;
  background-image: none;
  border: 1px solid var(--line, rgba(255, 255, 255, .16));
  border-radius: 999px;
  color: var(--muted, #9aa4bf);
  cursor: pointer;
  font-family: "Space Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .68rem;
  letter-spacing: .06em;
  line-height: 1.2;
  max-width: 11.5rem;
  padding: .42em 1.7em .42em .85em;
  text-overflow: ellipsis;
  transition: color .18s ease, border-color .18s ease;
  background-repeat: no-repeat;
  background-position: right .6em center;
  background-size: 8px 5px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='5'><path d='M0 0h8L4 5z' fill='%239aa4bf'/></svg>");
}
select.lang-switch:hover,
select.lang-switch:focus-visible {
  border-color: var(--accent, #c08cff);
  color: var(--ink, #f2f4fa);
  outline: none;
}
select.lang-switch option {
  background: #0e1118;
  color: #eef1f8;
  font-family: system-ui, -apple-system, "Segoe UI", "Noto Sans", sans-serif;
  font-size: .95rem;
  letter-spacing: 0;
  padding: .3em .5em;
}
html[dir="rtl"] select.lang-switch {
  padding: .42em .85em .42em 1.7em;
  background-position: left .6em center;
}

/* ---- Step 0 模块（沿用 .service-row 组件，仅补一点间距） ---- */
.stage0 { margin: 0 0 1.6rem; }
.stage0 .service-row:last-child { border-bottom: 0; }

/* ---- 表单补充说明 ---- */
.form-hint {
  color: var(--muted, #8c96ae);
  font-size: .82rem;
  line-height: 1.55;
  margin: .9rem 0 0;
  max-width: 46em;
}

/* ---- 非英语页底部：以英文版为准 ---- */
.prevails-note {
  border-top: 1px solid rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .42);
  font-size: .74rem;
  letter-spacing: .01em;
  margin: 1.1rem 0 0;
  padding-top: .85rem;
}

/* ---- RTL 基本镜像（阿/波斯/乌尔都） ---- */
html[dir="rtl"] body { text-align: right; }
html[dir="rtl"] .nav-links,
html[dir="rtl"] .footer-col,
html[dir="rtl"] .faq-q { direction: rtl; }
html[dir="rtl"] .service-row { direction: rtl; }
html[dir="rtl"] ul, html[dir="rtl"] ol { padding-left: 0; padding-right: 1.15em; }
html[dir="rtl"] .hero-panel,
html[dir="rtl"] .card { text-align: right; }
html[dir="rtl"] .arrow, html[dir="rtl"] .btn .ar { transform: scaleX(-1); }

/* ---- 长语言名不撑破导航 ---- */
@media (max-width: 560px) {
  select.lang-switch { max-width: 8.4rem; font-size: .64rem; }
}


/* ============================================================
   终端适配补丁（2026-11）—— 只补断点与断行，不动配色/字体/结构
   问题来源：站点自带 72 条互相覆盖的 .hero h1 规则 + 首屏 JS 强制两列，
             导致 ≤430px 首列宽度被压成 0；长语言标题过高；981–1200 导航溢出。
   ============================================================ */

/* ---- A · 导航：先压缩，再收进汉堡菜单（沿用站点已有的 body.menu-open 交互） ---- */
.nav { flex-wrap: nowrap; }
.nav-links { min-width: 0; flex-wrap: nowrap; }
select.lang-switch { flex: 0 0 auto; max-width: 9.2rem; }
.nav-cta { flex: 0 0 auto; }

@media (max-width: 1280px) {
  .nav { gap: 16px; }
  .nav-links { gap: 12px; }
  .nav-links a { font-size: .93rem; }
  .nav-cta { padding: .68em 1em; font-size: .78rem; }
  select.lang-switch { padding: .34em .58em; font-size: .66rem; letter-spacing: 0; }
}

@media (max-width: 1080px) {
  .nav { gap: .5rem; }
  .nav-links { display: none; }
  .nav-toggle { display: flex; order: 6; margin-left: .45rem; }
  .nav-cta { display: none; }
  select.lang-switch { order: 5; margin-left: auto; }
  body.menu-open .nav-links {
    display: flex; flex-direction: column; gap: 1rem;
    position: fixed; top: 70px; left: 0; right: 0;
    background: var(--paper); border-bottom: 1px solid var(--line);
    padding: 1.3rem 24px 1.7rem; z-index: 70;
    box-shadow: 0 24px 40px -28px rgba(10, 22, 34, .45);
  }
  body.menu-open .nav-links a { font-size: 1rem; padding: .22em 0; }
  body.menu-open .nav-links a::after { display: none; }
}

/* ---- B · 文字不许被裁：按钮换行、卡片与 kicker 允许断词 ---- */
.btn, .btn-primary, .btn-ghost { white-space: normal; max-width: 100%; overflow: visible; text-align: center; }
.hero-actions, .cta-inner { flex-wrap: wrap; }
.card, .card *, .pkg, .hero-panel, .hero-panel * { overflow-wrap: anywhere; }
.kicker, .eyebrow { white-space: normal; overflow: visible; }

/* ---- C · 窄屏表格：固定布局按列宽断行，不再冲出屏幕 ---- */
@media (max-width: 760px) {
  table.fact-table { table-layout: fixed; width: 100%; }
  table.fact-table th, table.fact-table td { overflow-wrap: anywhere; padding-left: .45rem; padding-right: .45rem; }
  table.fact-table th { font-size: .62rem; letter-spacing: .04em; }
}

/* ---- D · 长语言首屏字号回收（英文版保持原样） ---- */
html:not([lang="en"]) body section.hero.hero h1 {
  font-size: clamp(1.95rem, 4.2vw, 3.35rem) !important;
  line-height: 1.1 !important;
  max-width: none !important;
}
html:is([lang="ru"], [lang="uk"], [lang="hy"], [lang="bn"], [lang="hi"], [lang="pa"], [lang="ur"], [lang="fa"]) body section.hero.hero h1 {
  font-size: clamp(1.7rem, 3.45vw, 2.8rem) !important;
  line-height: 1.16 !important;
}
html:not([lang="en"]) body section.page-hero.page-hero h1,
html:not([lang="en"]) body section.hero.hero h2 { font-size: clamp(1.7rem, 3.6vw, 2.9rem) !important; line-height: 1.16 !important; }

/* ---- E · 中文/日文/韩文断行更自然（避免单字落尾） ---- */
html:is([lang="zh"], [lang="zh-Hant"], [lang="ja"], [lang="ko"]) body p,
html:is([lang="zh"], [lang="zh-Hant"], [lang="ja"], [lang="ko"]) body li { line-height: 1.78 !important; }
html:is([lang="zh"], [lang="zh-Hant"], [lang="ja"], [lang="ko"]) body h1,
html:is([lang="zh"], [lang="zh-Hant"], [lang="ja"], [lang="ko"]) body h2 { letter-spacing: 0 !important; }

/* ---- F · 窄屏首屏容器：section.hero 是 flex，.wrap 带 auto margin 会缩成 fit-content（实测 390px 视口只剩 285） ---- */
@media (max-width: 980px) {
  html body section.hero.hero { display: block !important; align-items: stretch !important; }
  html body section.hero.hero > .wrap { width: 100% !important; max-width: 100% !important; }
}

/* ---- F2 · 窄屏首屏标题占满可用宽度（含英文版 20ch 限宽），长词不再顶到边 ---- */
@media (max-width: 640px) {
  html body section.hero.hero h1,
  html body section.page-hero.page-hero h1 {
    max-width: 100% !important;
    overflow-wrap: break-word;
  }
  html body section.hero.hero h1 { text-wrap: balance; }
}

