/*!
 * i18n-ui.css — 语言切换控件样式
 *
 * 原则：只为本控件新增样式，**完全不覆盖**官方 CSS 的任何规则。
 * 字号/字重/颜色/圆角全部复用模板自身的 CSS 变量，保证与 Schedule 按钮同源、
 * 在浅色/深色主题与各断点下都与站点视觉一致。
 */

/* 包裹层与既有 .nav-button 保持一致 */
.lang-toggle-wrap {
  display: flex;
  align-items: center;
}

/* 按钮本体：复用 .button 的视觉语言（模板 .button 已有背景/圆角/内边距） */
.lang-toggle {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
  background-color: var(--_semantics---background-default, #fff);
  color: var(--_semantics---text, #101828);
  border: 1px solid var(--_semantics---border, #e5e7eb);
  border-radius: var(--_ui-styles---borderradius--xsmall, 0rem);
  padding: .5rem .75rem;
  font-family: var(--_ui-styles---fonts--text, Rubik, sans-serif);
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.2;
  transition: opacity .3s, background-color .3s, color .3s;
}

.lang-toggle:hover {
  opacity: .8;
  text-decoration: none;
}

.lang-toggle:focus-visible {
  outline: 2px solid var(--_semantics---text, #101828);
  outline-offset: 2px;
}

.lang-toggle-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 1rem;
  height: 1rem;
}

.lang-toggle-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* 使标签文字继承按钮字号，避免 .text-simple 在大菜单里的差异 */
.lang-toggle .text-simple {
  font-size: inherit;
  line-height: inherit;
  margin: 0;
}

/* ---- 浮动兜底控件 ----
   仅用于没有导航栏的页面（401 / 404 / template-style-guide）。
   放在右下角，与被移除的 Webflow 水印位置不重叠（水印在 inset 12px，此处 20px）。 */
.lang-toggle-float {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 9998;
  display: flex;
  align-items: center;
}

.lang-toggle-float .lang-toggle {
  box-shadow: 0 1px 4px rgba(0, 0, 0, .12);
}

/* ---- FOUC 守卫 ----
   非默认语言（中文）首屏：i18n.js 在 <head> 同步执行时 body 还没解析，
   文案替换只能等 DOMContentLoaded，浏览器可能已经先画出英文。
   这里在守卫期间暂隐 body，替换完成后由 i18n.js 摘掉 data-i18n-pending。
   i18n.js 内有 1500ms 超时兜底 + try/catch，页面不会永久空白。
   注意：只在非默认语言时命中，英文首屏完全不受影响。 */
html[data-i18n-pending] body {
  visibility: hidden;
}

/* ---- 断点适配：与官方导航行为保持一致 ---- */
/* ≤991px：导航右侧区域改为纵向堆叠（官方 .nav_buttons-wrap 同断点行为） */
@media screen and (max-width: 991px) {
  .lang-toggle-wrap {
    width: 100%;
  }
  .lang-toggle {
    width: 100%;
    justify-content: flex-start;
  }
}

/* ≤479px：官方 `.nav-button { display:none }`，
   但语言切换是功能性入口，此处**保留显示**（仅此一处刻意与官方不同），
   并收缩内边距以适配窄屏。 */
@media screen and (max-width: 479px) {
  .lang-toggle-wrap {
    display: flex !important;
  }
  .lang-toggle {
    padding: .4rem .6rem;
    font-size: .8125rem;
  }
}

/* [wg] 页脚去模板化（2026-10-01）
   这一块是页脚覆盖规则的唯一出处，改页脚布局只改这里。
   已移除：①「Powered by Webflow…」署名 ②「Utilities / 实用工具」列 ③「Other Pages / 其他页面」列。
   页脚只剩「Pages / 页面」一列链接 → 在原有链接上重新排成两列（3 + 2），标题只保留一份。
   注意：重复写类名把特异性提到 (0,2,0) > vendor 的 (0,1,0)，从而不依赖样式表加载顺序 ——
   index.html 把本文件排在 vendor CSS 之前，单类名在首页会被 vendor 规则反压（实测过）。 */
.footer_09-grid.footer_09-grid { grid-template-columns: 1fr; place-items: start stretch; }
.footer_09-grid.footer_09-grid .footer_list-wrap {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(3, auto);
  grid-auto-flow: column;
  column-gap: 3rem;
  row-gap: .6rem;
  align-items: start;
  justify-items: start;
}
@media screen and (max-width: 479px) {
  .footer_09-grid.footer_09-grid .footer_list-wrap { column-gap: 1.5rem; }
}

/* [wg] 导航大菜单去列（2026-10-02） ——
   删掉大菜单第 2 列「Other Pages / 其他页面」后，.big_menu-grid 由 3 个子元素变 2 个。
   vendor 桌面值是 grid-template-columns: 1fr 1fr 1fr（仅 >991px），右侧会空出 1/3。
   重复写类名把特异性提到 (0,2,0) > vendor 的 (0,1,0) —— index.html 把本文件排在
   vendor CSS 之前，单类名在首页会被反压（页脚那轮实测踩过）。
   只在桌面断点生效：≤991px 时 vendor 已是 grid-template-columns: 1fr，无需干预。 */
@media screen and (min-width: 992px) {
  .big_menu-grid.big_menu-grid { grid-template-columns: 1fr 1fr; }
}

/* [wg] Solastrio 公司 logo（2026-10-02） ——
   导航左上角品牌标与页脚品牌标用**同一份图片**（`images/68a85c7c…Type light logo.svg`，
   已由同名覆盖换成 Solastrio 白色字标）。两处都是深色底，所以都用白色版。
   页脚 logo 是新加的元素，需要显式高度；`.footer_09-top-content` 是 column flex，
   flex gap 会自动给出与标题的间距，此处不用再写 margin。 */
.footer-brand-wrap { display: flex; }
.footer-brand-logo { display: block; width: auto; height: 1.75rem; }
@media screen and (max-width: 991px) {
  .footer-brand-logo { height: 1.5rem; }
}

/* 导航品牌标是长字标（≈9.3:1），而模板原来的「ENERGY」只有 ≈4.75:1。
   窄屏（375）导航可用宽度 315px、菜单占 151px，logo 只分到 164px —— 少于它的自然宽度，
   flex 会把它**横向压扁**（实测 164×21 而不是 164×17.7，字形变形）。
   加 contain 让它在盒内等比缩放：宽屏盒比例与图一致（223×24）时无影响，
   窄屏则自动缩到 164×17.7，永不拉伸。
   注：`.nav-logo-wrap .logo-image` 是 (0,2,0)，压过 vendor 的 `.logo-image` (0,1,0)，
   不受 index.html 样式表顺序影响。 */
.nav-logo-wrap .logo-image { object-fit: contain; }