@charset "utf-8";
/*基础重置*/
body { font-family: Arial, "微软雅黑"; font-weight: 400; color: var(--tncms-text); line-height: 1.6; -webkit-font-smoothing: antialiased; }
* { margin: 0; padding: 0; }
a { text-decoration: none; }
img { border: 0; }
ul li { list-style: none; }
/*覆盖 Bootstrap _reboot.scss 对 ul/ol 的默认 margin-bottom / padding-left*/
ul, ol { margin-bottom: 0; padding-left: 0; list-style: none; }
:root { --tncms-primary: #1ab8ec; --tncms-primary-dark: #1d4ed8; --tncms-primary-light: #eff6ff; --tncms-secondary: #64748b; --tncms-text: #1e293b; --tncms-text-muted: #64748b; --tncms-bg-light: #f8fafc; --tncms-border: #e2e8f0; --tncms-menu-border: rgba(0, 0, 0, 0.08); --tncms-radius: 0.75rem; --tncms-shadow: 0 0.25rem 1.25rem rgba(30, 41, 59, 0.08); --tncms-shadow-hover: 0 0.75rem 2.5rem rgba(37, 99, 235, 0.12); --tncms-header-height: 4.375rem; }
/*全局图标样式*/
.bi { display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; line-height: 1; }
/*图标缺失兜底：避免空白裂图*/
img[src=""], img:not([src]) { visibility: hidden; }
/*公共头部*/
/*顶部导航视觉统一*/
.tncms-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
  height: var(--tncms-header-height);
  background: #fff;
  box-shadow: 0 0.438rem 1.5rem rgba(37, 63, 103, .07);
  border-bottom: 1px solid rgba(215, 226, 241, .82);
  /*吸顶二级导航接管时页头滑出/淡入的过渡（隐藏状态见下方 *-nav-docked 规则及各页面 CSS）*/
  transition: transform .28s ease, opacity .22s ease;
  will-change: transform;
}
/*头部底部彩虹渐变彩条*/
.tncms-header::after { content: ''; position: absolute; left: 0; right: 0; bottom: -0.125rem; height: 2px; box-shadow: 0 0.375rem 1.5rem rgba(30, 41, 59, .08); background: linear-gradient(90deg, transparent 4%, #246bfd 30%, #13bfe5 70%, transparent 96%); background-size: 100% 100%; animation: none; opacity: .72; }
/*头部底部光扫效果：一束白光在彩条上从左往右循环跑动*/
.tncms-header::before { content: ''; position: absolute; left: 0; right: 0; bottom: -0.125rem; height: 0.25rem; z-index: 2; background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0) 46%, rgba(255, 255, 255, 0.65) 49%, rgba(255, 255, 255, 0.95) 50%, rgba(255, 255, 255, 0.65) 51%, rgba(255, 255, 255, 0) 54%, transparent 100% ); background-size: 300% 100%; filter: blur(1px); animation: header-light-sweep 2.5s linear infinite; pointer-events: none; display: none; }
/*头部占位：固定头部 + 底部 1px 彩条*/
.tncms-header-spacer { height: calc(var(--tncms-header-height) + 1px); flex-shrink: 0; }
.tncms-header .container { max-width: 87.5rem; }
.tncms-header .navbar { height: var(--tncms-header-height); padding-top: 0; padding-bottom: 0; }
.tncms-header .navbar-brand { display: inline-flex; align-items: center; gap: 0.875rem; font-size: 1.5rem; font-weight: 700; color: var(--tncms-primary) !important; }
.tncms-header .navbar-brand .header-logo { display: block; width: auto; height: 2.75rem; flex: 0 0 auto; object-fit: contain; }
.tncms-header .header-brand-lockup { display: inline-flex; flex: 0 0 auto; align-items: center; gap: .55rem; }
.tncms-header .header-brand-title { color: #17243d; font-size: 1.7rem; font-weight: 800; letter-spacing: .04em; line-height: 1; white-space: nowrap; }
.tncms-header .navbar-collapse { flex-grow: 1; margin-left: 1.25rem; margin-right: 0; align-items: center; }
.tncms-header .navbar-collapse > .header-actions { margin-left: auto; }
.tncms-header .navbar-nav { flex-direction: row; align-items: center; gap: 0.188rem; }
.tncms-header .nav-item { margin-left: 0; }
.tncms-header .nav-link { position: relative; font-size: .9375rem; color: #334155 !important; padding: 0 0.875rem !important; transition: color .2s ease, background-color .2s ease; display: inline-flex; min-height: 2.5rem; align-items: center; justify-content: center; border-radius: 0.625rem; font-weight: 500; line-height: 1; white-space: nowrap; flex: 0 0 auto; }
.tncms-header .nav-link-text { white-space: nowrap; }
/*头部霓虹渐变彩色线条*/
.tncms-header .nav-item .nav-link::before { content: ''; position: absolute; bottom: 0.125rem; left: 50%; transform: translateX(-50%) scaleX(0); width: 1.5rem; height: 2px; border-radius: 0.125rem; background: linear-gradient(90deg, #246bfd, #13bfe5); background-size: 100% 100%; animation: none; transition: transform .25s ease; }
.tncms-header .nav-link:hover, .tncms-header .nav-link.active, .tncms-header .nav-item.dropdown:hover > .nav-link, .tncms-header .nav-item.dropdown.show > .nav-link { color: #0066ff !important; }
.tncms-header .nav-item .nav-link:hover::before, .tncms-header .nav-item .nav-link.active::before, .tncms-header .nav-item.dropdown:hover > .nav-link::before, .tncms-header .nav-item.dropdown.show > .nav-link::before { transform: translateX(-50%) scaleX(1); }
/*为下拉面板提供定位上下文，使 JS 计算的位置以栏目菜单为基准*/
.tncms-header .nav-item.dropdown { position: relative; }
.tncms-header .dropdown-menu { background: #fff; border: 1px solid var(--tncms-menu-border); box-shadow: var(--tncms-shadow-hover); border-radius: var(--tncms-radius); padding: 0.625rem; min-width: 13.75rem; margin-top: 0.312rem; }
/*下拉面板上方箭头，指向对应栏目菜单（白色箭头 + 底部阴影箭头）*/
.tncms-header .dropdown-menu::before, .tncms-header .dropdown-menu::after { content: ''; position: absolute; top: -0.5rem; left: var(--dropdown-arrow-left, 50%); transform: translateX(-50%); width: 0; height: 0; border-left: 0.5rem solid transparent; border-right: 0.5rem solid transparent; border-bottom: 0.5rem solid #fff; opacity: 0; transition: opacity .2s; pointer-events: none; }
.tncms-header .dropdown-menu::before { z-index: 2; }
.tncms-header .dropdown-menu::after { top: -0.562rem; border-left: 0.562rem solid transparent; border-right: 0.562rem solid transparent; border-bottom: 0.562rem solid var(--tncms-menu-border); z-index: 1; border-bottom-color: #d7e2f1; }
.tncms-header .nav-item.dropdown:hover > .dropdown-menu::before, .tncms-header .dropdown-menu.show::before, .tncms-header .dropdown-submenu:hover > .dropdown-menu::before, .tncms-header .nav-item.dropdown:hover > .dropdown-menu::after, .tncms-header .dropdown-menu.show::after, .tncms-header .dropdown-submenu:hover > .dropdown-menu::after { opacity: 1; }
.tncms-header .dropdown-item { border-radius: 0.562rem; padding: 0.562rem 0.75rem; font-size: .875rem; color: #475569; transition: all .2s ease; min-height: 2.5rem; }
.tncms-header .dropdown-item:hover, .tncms-header .dropdown-item:focus, .tncms-header .dropdown-item.active { background: #eff6ff; color: #246bfd; }
.tncms-header .dropdown-item:active { background: #e6efff; color: #2576fb; }
/*顶部右侧操作区：语言切换 + 免费试用*/
.header-actions { display: inline-flex; align-items: center; gap: .75rem; margin-left: 1.5rem; }
.tncms-header .btn-trial { display: inline-flex; align-items: center; justify-content: center; height: 2.375rem; padding: 0 1.5rem; font-size: .875rem; font-weight: 600; border: none; border-radius: 624.938rem; background: linear-gradient(100deg, #246bfd, #3f8cff); color: #fff; box-shadow: 0 0.438rem 1.125rem rgba(36, 107, 253, .24); cursor: pointer; transition: all .2s ease; white-space: nowrap; }
.tncms-header .btn-trial:hover { background: linear-gradient(90deg, #1d65d8 0, #3a7fee 100%); box-shadow: 0 0.375rem 1.125rem rgba(37, 118, 251, .36); color: #fff; }
/*语言切换下拉：悬停/聚焦展开（多语言未上线，选项暂为占位）*/
.header-lang { position: relative; }
.header-lang-toggle { display: inline-flex; align-items: center; gap: .375rem; height: 2.375rem; padding: 0 1rem; font-size: .875rem; color: var(--tncms-text); background: #f4f8ff; border: 1px solid #dbe7fb; border-radius: 624.938rem; cursor: pointer; transition: all .2s ease; white-space: nowrap; }
.header-lang-toggle .bi-globe { color: #246bfd; font-size: 1rem; }
.header-lang-toggle .bi-chevron-down { font-size: .7rem; transition: transform .2s ease; }
.header-lang:hover .header-lang-toggle, .header-lang:focus-within .header-lang-toggle { border-color: #9fc2fb; color: #246bfd; background: #fff; }
.header-lang:hover .header-lang-toggle .bi-chevron-down, .header-lang:focus-within .header-lang-toggle .bi-chevron-down { transform: rotate(180deg); }
.header-lang-menu { position: absolute; top: calc(100% + .5rem); right: 0; min-width: 9.5rem; margin: 0; padding: .375rem; list-style: none; background: #fff; border: 1px solid #e6eefb; border-radius: .75rem; box-shadow: 0 .75rem 2rem rgba(38, 75, 128, .12); opacity: 0; visibility: hidden; transform: translateY(-.375rem); transition: all .2s ease; z-index: 1050; }
/*悬停桥：填补按钮与面板间隙，避免移出即收起*/
.header-lang-menu::before { content: ''; position: absolute; left: 0; right: 0; top: -.5rem; height: .5rem; }
.header-lang:hover .header-lang-menu, .header-lang:focus-within .header-lang-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.header-lang-menu a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .562rem .875rem; font-size: .875rem; color: #475569; border-radius: .5rem; transition: all .15s ease; }
.header-lang-menu a:hover { background: #eff6ff; color: #246bfd; }
.header-lang-menu a.is-active { color: #246bfd; font-weight: 600; }
/*一级栏目下拉箭头：细线 chevron
   注意：.nav-link 是 inline-flex（align-items: center），::after 作为 flex 子项时
   vertical-align 不生效，必须通过 translateY 补偿字形视觉中心（chevron 笔画集中在方框下半部）*/
.tncms-header .dropdown-toggle::after { content: ''; display: inline-block; width: .46em; height: .46em; border-style: solid; border-width: 0 0.075rem 0.075rem 0; border-color: currentColor; transform: translateY(-.15em) rotate(45deg); margin-left: .5em; transition: transform .2s ease; }
/*栏目悬停或面板展开时，箭头翻转指向上方并变为主题色（朝上时笔画集中在上半部，向下补偿）*/
.tncms-header .nav-item.dropdown:hover > .dropdown-toggle::after, .tncms-header .nav-item.dropdown.show > .dropdown-toggle::after { transform: translateY(.15em) rotate(-135deg); }
/*Mega Menu*/
.tncms-header .dropdown-menu.mega-menu { width: 56.25rem; max-width: calc(100vw - 2rem); left: 0; transform: none; padding: 1.5rem 1.625rem; border: 1px solid var(--tncms-menu-border); box-shadow: var(--tncms-shadow-hover); border-radius: var(--tncms-radius); margin-top: 0.312rem; overflow: hidden; background: radial-gradient(circle at 8% 0%, rgba(36, 107, 253, .07), transparent 30%), linear-gradient(180deg, #fff 0%, #fbfdff 100%); }
.mega-group-title { position: relative; font-size: .9375rem; font-weight: 700; color: #25334a; margin-bottom: 0.75rem; padding-left: 0.812rem; letter-spacing: .02em; }
.mega-group-title::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 0.188rem; height: 0.938rem; border-radius: 0.125rem; background: linear-gradient(180deg, #246bfd, #13bfe5); background-size: 100% 100%; animation: none; }
.mega-item { display: flex; align-items: center; gap: 0.688rem; padding: 0.562rem 0.625rem; border-radius: 0.75rem; color: var(--tncms-text); transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease; min-height: 3.625rem; border: 1px solid transparent; }
.mega-item:hover { background: #eef4ff; color: var(--tncms-text); }
.mega-item:hover .mega-item-title, .mega-item.active .mega-item-title { color: #2576fb; }
.mega-item.active { background: #eef4ff; }
.mega-item-body { flex: 1; min-width: 0; }
/*服务栏目菜单项：整行卡片结构不变，悬停/选中背景包裹内容并留出统一宽度，不铺满整列*/
.mega-service-item .mega-item { display: inline-flex; width: auto; max-width: 100%; min-width: 20rem; }
/*图标 PNG 自带圆角底板与浅色底，按原图铺满图标位，不再叠加内边距/底色/边框*/
.mega-item-icon { width: 3rem; height: 3rem; object-fit: cover; flex-shrink: 0; border-radius: 0.75rem; }
.mega-item-title { display: flex; align-items: center; font-weight: 650; font-size: .875rem; line-height: 1.3; white-space: nowrap; transition: color .2s; color: #24324a; }
.mega-item-desc { font-size: .75rem; color: #7a889d; line-height: 1.4; margin-top: 0.188rem; }
.mega-link { display: block; padding: .25rem 0; color: var(--tncms-text); font-size: .85rem; transition: color .2s; }
.mega-link:hover, .mega-link.active { color: #2576fb; }
/*未上线栏目保持可见，但不响应点击或键盘访问。*/
.tncms-header a.is-disabled { color: #9aa6b8 !important; cursor: not-allowed; opacity: .68; background: transparent !important; box-shadow: none !important; transform: none !important; }
.tncms-header .mega-item.is-disabled:hover,
.tncms-header .mega-link.is-disabled:hover,
.tncms-header .dropdown-item.is-disabled:hover,
.tncms-header .nav-link.is-disabled:hover { color: #9aa6b8 !important; background: transparent; }
/*解决方案 Mega Menu：全屏宽幅面板，6 组等宽列 + 轻量分隔构成三层信息层级；
   外观对齐产品菜单：顶部直角与头部贴合、纯白实底、底部圆角
   （选择器多叠一个 .mega-menu 以压过后方通用 mega 面板的色晕背景）*/
.tncms-header .dropdown-menu.mega-menu.mega-menu-solution { width: 100vw; max-width: 100vw; padding: 0; font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", Arial, sans-serif; border-color: #dce7f5; border-radius: 0 0 1.125rem 1.125rem; overflow: hidden; background: #fff; box-shadow: 0 1.375rem 3.625rem rgba(31, 61, 105, .14), 0 0.25rem 0.875rem rgba(31, 61, 105, .06); --solution-menu-accent: var(--tncms-primary, #246bfd); }
.solution-menu-content { padding: 1.625rem 2.5rem 1.875rem; }
/*面板头：左 eyebrow + 右关闭按钮，底部一条细分隔线*/
.solution-menu-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; padding-bottom: 1.125rem; border-bottom: 1px solid #eaf0f8; }
.solution-menu-close { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; padding: 0; border: 1px solid #e3ebf6; border-radius: 50%; background: #fff; color: #7a889d; font-size: .875rem; cursor: pointer; transition: color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.solution-menu-close:hover { color: var(--solution-menu-accent); border-color: color-mix(in srgb, var(--solution-menu-accent) 35%, #fff); box-shadow: 0 .375rem 1rem color-mix(in srgb, var(--solution-menu-accent) 16%, transparent); transform: rotate(90deg); }
.solution-menu-eyebrow { display: flex; align-items: center; gap: .875rem; }
.solution-menu-eyebrow span { display: inline-flex; align-items: center; gap: .5rem; color: color-mix(in srgb, var(--solution-menu-accent) 72%, #17243b); font-size: .75rem; font-weight: 700; line-height: 1; letter-spacing: .12em; }
.solution-menu-eyebrow span::before { content: ''; width: 1.125rem; height: 2px; border-radius: 624.938rem; background: linear-gradient(90deg, var(--solution-menu-accent), color-mix(in srgb, var(--solution-menu-accent) 65%, #fff)); }
.solution-menu-eyebrow small { color: #8a98ab; font-size: .75rem; line-height: 1.4; }
/*6 组等宽列:中屏 3×2,宽屏(≥1400px)一行 6 列*/
.solution-group-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.75rem 2.25rem; }
@media (min-width: 87.5rem) {
  .solution-group-grid { grid-template-columns: repeat(6, 1fr); gap: 0 1.75rem; }
}
.solution-group { position: relative; min-width: 0; }
/*组标题:图标 + 精简短名,整行可点进行业落地页,下方细分隔线*/
.solution-group-title { display: flex; align-items: center; gap: .625rem; margin-bottom: .875rem; padding-bottom: .75rem; border-bottom: 1px solid #e6edf6; color: #1f2d42; text-decoration: none; transition: color .2s ease; cursor: pointer; }
.solution-group-title:hover, .solution-group-title.active { color: var(--solution-menu-accent); }
/*组图标对齐产品菜单卡片图标:平涂软底方块,无边框无投影*/
.solution-group-title .mega-group-icon { width: 2.25rem; height: 2.25rem; padding: .1875rem; object-fit: contain; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 1rem; color: var(--solution-menu-accent); border: none; border-radius: .5rem; background: #eaf2ff; transition: background-color .2s ease; }
.solution-group-title:hover .mega-group-icon, .solution-group-title.active .mega-group-icon { background: color-mix(in srgb, var(--solution-menu-accent) 14%, #fff); }
/*当前解决方案所属的二级分类：与三级条目的选中状态形成清晰层级。*/
.solution-group-title.active { border-bottom-color: color-mix(in srgb, var(--solution-menu-accent) 42%, #fff); }
.solution-group-name { font-size: 1.0625rem; font-weight: 700; letter-spacing: .02em; line-height: 1.3; }
/*每组 7 条：单列紧凑清单纵向排布，宽度足够放下方案条目名*/
.solution-item-grid { display: flex; flex-direction: column; gap: .0625rem; }
.solution-item-link { position: relative; display: flex; align-items: center; min-height: 2rem; padding: .3125rem .5rem; border: 1px solid transparent; border-radius: .5rem; color: #66758a; font-size: .875rem; font-weight: 400; line-height: 1.35; white-space: nowrap; max-width: 100%; transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
/*标题完整不省略；新品角标跟随文字末尾（解决方案/产品菜单共用）*/
.solution-item-text, .mega-item-title-text { position: relative; white-space: nowrap; }
.solution-item-text .badge-new, .mega-item-title-text .badge-new { position: absolute; z-index: 2; left: 100%; top: 50%; margin: 0; transform: translate(.4375rem, -50%); }
/*条目 HOT 角标：内联跟随文字，与基线对齐*/
.solution-item-text .badge-hot { margin-left: .375rem; transform: translateY(-.0625rem); }
.solution-item-link:hover, .solution-item-link:focus, .solution-item-link.active { border-color: color-mix(in srgb, var(--solution-menu-accent) 20%, #fff); background: color-mix(in srgb, var(--solution-menu-accent) 7%, #fff); color: var(--solution-menu-accent); box-shadow: 0 .25rem .75rem color-mix(in srgb, var(--solution-menu-accent) 9%, transparent); transform: translateX(.125rem); }
.solution-menu-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3.75rem; padding: .75rem 2.5rem; border-top: 1px solid color-mix(in srgb, var(--solution-menu-accent) 12%, #fff); background: linear-gradient(90deg, color-mix(in srgb, var(--solution-menu-accent) 5%, #fff), #fff); }
/*左:联系电话;右:全部方案 + 咨询入口*/
.solution-menu-phone { display: inline-flex; align-items: center; gap: .5rem; color: #42506a; font-size: .875rem; font-weight: 600; transition: color .2s ease; }
.solution-menu-phone i { color: var(--solution-menu-accent); font-size: 1rem; }
.solution-menu-phone:hover { color: var(--solution-menu-accent); }
.solution-menu-actions { display: inline-flex; align-items: center; gap: 1.75rem; }
.solution-menu-actions > a { display: inline-flex; align-items: center; gap: .4375rem; color: var(--solution-menu-accent); font-size: .8125rem; font-weight: 600; transition: gap .2s ease, color .2s ease; }
.solution-menu-actions > a:hover { gap: .6875rem; color: color-mix(in srgb, var(--solution-menu-accent) 78%, #102451); }
.solution-menu-actions > .btn { display: inline-flex; align-items: center; gap: .4375rem; color: var(--solution-menu-accent); font-size: .8125rem; font-weight: 600; text-decoration: none; }
.solution-menu-actions > .btn:hover { color: color-mix(in srgb, var(--solution-menu-accent) 78%, #102451); }
.badge-hot { display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(90deg, #fc6e64, #d21f16); color: #fff; font-size: .55rem; font-weight: 600; padding: .04rem .22rem; border-radius: 0.188rem; line-height: 1; vertical-align: middle; }
/*一级栏目菜单 HOT 角标：带小尾巴指向菜单文字*/
.tncms-header .nav-link-text { position: relative; display: inline-block; }
.tncms-header .nav-link-text .badge-hot {
  position: absolute;
  /*上标式锚定在栏目文字右上角，不遮挡菜单文字*/
  top: -0.825rem;
  z-index: 1;
  margin: 0;
  right: -1.25rem;
  min-width: 1.75rem;
  height: .75rem;
  /*纯大写 HOT 字形底部无降部，顶部补一点 padding 让文字光学居中*/
  padding: .05rem .22rem 0;
  text-align: center;
  line-height: 1;
  border-radius: 0.188rem 0.188rem 0.188rem 0;
  -webkit-text-fill-color: initial;
  color: #fff;
}
/*HOT 角标左下方的小指向箭头，明确角标所属栏目。*/
.tncms-header .nav-link-text .badge-hot::after { content: ''; position: absolute; top: 100%; left: .2rem; width: .34rem; height: .24rem; border-radius: 0 0 0 .08rem; background: linear-gradient(135deg, #fc6e64, #d21f16); clip-path: polygon(0 0, 100% 0, 0 100%); filter: drop-shadow(0 .08rem .1rem rgba(210, 31, 22, .18)); }
.badge-new {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(77deg,#fd8378 0,#f63012 100%);
  color: #fff;
  font-size: .65rem;
  font-weight: 500;
  /*CJK 字形重心略低于 em 框中心，减顶加底让文字光学居中*/
  padding: .07rem .3rem .13rem;
  border-radius: 0.25rem;
  line-height: 1;
  vertical-align: middle;
}
/*Dropdown submenu for regular 3-level nav*/
.dropdown-submenu { position: relative; }
.dropdown-submenu > .dropdown-menu { top: 0; left: 100%; margin-top: -.5rem; margin-left: .1rem; }
.dropdown-submenu:hover > .dropdown-menu { display: block; }
/*通用业务组件类*/
.section-title { font-size: 2rem; font-weight: 700; color: var(--tncms-text); text-align: center; margin-bottom: .75rem; }
.section-padding { padding: 5rem 0; }
.card-hover { transition: all .3s ease; border: 1px solid var(--tncms-border); }
.card-hover:hover { transform: translateY(-0.375rem); box-shadow: var(--tncms-shadow-hover); border-color: #bfdbfe; }
.tncms-header .nav-link:hover, .tncms-header .nav-link.active, .tncms-header .nav-item.dropdown:hover > .nav-link, .tncms-header .nav-item.dropdown.show > .nav-link { background: #f2f7ff; color: #246bfd !important; }
.tncms-header .nav-link:focus-visible, .tncms-header .dropdown-item:focus-visible, .tncms-header .mega-item:focus-visible { outline: 2px solid rgba(36, 107, 253, .42); outline-offset: 0.125rem; }
/*下拉面板与头部同一纯白实底表面，不使用透明/磨砂*/
.tncms-header .dropdown-menu, .tncms-header .dropdown-menu.mega-menu { margin-top: 0.5rem; border: 1px solid rgba(215, 226, 241, .82); border-radius: 1rem; background: #fff; box-shadow: 0 1.375rem 3.625rem rgba(31, 61, 105, .14), 0 0.25rem 0.875rem rgba(31, 61, 105, .06); }
/*mega 面板（产品中心/解决方案）在白底上叠一层极淡主题色晕，统一中保留层次*/
.tncms-header .dropdown-menu.mega-menu { background: radial-gradient(circle at 8% 0%, rgba(36, 107, 253, .07), transparent 32%),
    radial-gradient(circle at 96% 100%, rgba(19, 191, 229, .055), transparent 26rem),
    #fff; }
.mega-item:hover, .mega-item.active { border-color: #dce9fb; background: #fff; box-shadow: 0 0.5rem 1.375rem rgba(38, 75, 128, .08); transform: translateY(-0.062rem); }
.badge-hot, .badge-new { box-shadow: 0 0.188rem 0.5rem rgba(246, 65, 45, .18); }
@keyframes header-light-sweep {
  0% { background-position: 200% 50%; }
  100% { background-position: -100% 50%; }
}
@media (max-width: 991.98px) {
  .tncms-header .navbar-brand .header-logo { width: auto; height: 2.25rem; }
  .tncms-header .header-brand-lockup { gap: .4rem; }
  .tncms-header .header-brand-title { font-size: 1.4rem; }
}
/*中等桌面宽度：压缩导航间距，避免一级栏目被 flex 压缩成竖排文字。*/
@media (min-width: 992px) and (max-width: 1199.98px) {
  .tncms-header .navbar-brand { gap: 0; }
  .tncms-header .navbar-brand .header-logo { height: 2.5rem; }
  .tncms-header .header-brand-title { font-size: 1.5rem; }
  .tncms-header .navbar-nav { gap: 0; }
  .tncms-header .nav-link { padding-right: .5625rem !important; padding-left: .5625rem !important; font-size: .875rem; }
  .tncms-header .dropdown-toggle::after { margin-left: .35em; }
  .tncms-header .header-actions { gap: .5rem; margin-left: .75rem; }
  .tncms-header .header-lang-toggle { padding-right: .625rem; padding-left: .625rem; font-size: .8125rem; }
  .tncms-header .btn-trial { padding-right: .875rem; padding-left: .875rem; font-size: .8125rem; }
}
@media (max-width: 767.98px) {
  .tncms-header .navbar-brand .header-logo { height: 2rem; }
  .tncms-header .header-brand-title { font-size: 1.2rem; letter-spacing: .02em; }
}
@media (min-width: 992px) {
  /** 产品菜单直接以固定头部为定位基准。这样首页的默认展开和后续 hover
   * 使用同一套视口居中规则，不再受“产品中心”导航项自身 left: 0 影响。*/
  .tncms-header .dropdown-menu.mega-menu-product { position: fixed; top: calc(var(--tncms-header-height) - 0.125rem); right: auto; left: 50%; margin-top: 0; transform: translateX(-50%); }
  /*解决方案菜单同样直接按视口居中，避免首次 hover 使用导航项 left: 0。*/
  .tncms-header .dropdown-menu.mega-menu-solution { position: fixed; top: calc(var(--tncms-header-height) - 0.125rem); right: auto; left: 50%; margin-top: 0; transform: translateX(-50%); }
  .tncms-header .nav-item.dropdown:hover > .dropdown-menu { display: block; }
  /*导航项与下拉面板之间的透明 hover 桥，避免鼠标缓慢移入面板时失焦关闭*/
  .tncms-header .nav-item.dropdown::after { content: ''; position: absolute; top: 100%; left: 0; width: 100%; height: 0.875rem; background: transparent; pointer-events: auto; z-index: 999; }
  /*mega-menu 面板较重，桥接区域稍大，确保从栏目文字移入面板不断连*/
  .tncms-header .nav-item.dropdown.has-mega-menu::after { height: 1.125rem; }
}
@media (min-width: 992px) {
  .tncms-header .dropdown-menu:not(.mega-menu) { animation: tncms-dropdown-in .2s ease; }
  .tncms-header .dropdown-menu.mega-menu { animation: tncms-mega-dropdown-in .2s ease; }
  @keyframes tncms-dropdown-in {
    from { opacity: 0; transform: translateY(-0.5rem); }
    to { opacity: 1; transform: translateY(0); }
  }
  @keyframes tncms-mega-dropdown-in {
    from { opacity: 0; transform: translateY(-0.5rem); }
    to { opacity: 1; transform: translateY(0); }
  }
  /*视口居中的巨型菜单在展开动画中必须保留水平位移。*/
  .tncms-header .dropdown-menu.mega-menu-product,
  .tncms-header .dropdown-menu.mega-menu-solution { animation-name: tncms-product-mega-dropdown-in; }
  @keyframes tncms-product-mega-dropdown-in {
    from { opacity: 0; transform: translate(-50%, -0.5rem); }
    to { opacity: 1; transform: translate(-50%, 0); }
  }
}
@media (max-width: 991.98px) {
  .tncms-header .dropdown-menu.mega-menu-solution { width: 100%; padding: 0; border-radius: 0; }
  .solution-menu-content { padding: 1rem; }
  .solution-menu-head { margin-bottom: 1rem; padding-bottom: .75rem; }
  .solution-menu-eyebrow { align-items: flex-start; flex-direction: column; gap: .375rem; }
  .solution-menu-close { display: none; }
  .solution-group-grid { grid-template-columns: 1fr; gap: 1.25rem; }
  .solution-group:nth-child(n + 2) { padding-top: 1.25rem; border-top: 1px solid #edf2f8; }
  .solution-group-title { margin-bottom: .75rem; }
  .solution-item-link { font-size: .85rem; }
  .solution-menu-footer { flex-direction: column; gap: .625rem; padding: .875rem 1rem; }
  .solution-menu-actions { gap: 1.25rem; }
}
@media (max-width: 991.98px) {
  :root { --tncms-header-height: 3.75rem; }
  .tncms-header .navbar-collapse { position: relative; z-index: 3; flex-grow: 0; margin-left: 0; background: #fff; padding: 1rem; border-radius: 0 0 var(--tncms-radius) var(--tncms-radius); box-shadow: var(--tncms-shadow); max-height: calc(100vh - var(--tncms-header-height)); overflow-y: auto; }
  .tncms-header .navbar-nav { flex-direction: column; align-items: stretch; gap: 0.25rem; }
  .tncms-header .nav-item { width: 100%; }
  .tncms-header .nav-link { width: 100%; min-height: 2.75rem; justify-content: flex-start; padding: 0 0.75rem !important; }
  .tncms-header .nav-item .nav-link::before { top: 50%; bottom: auto; left: 0.125rem; width: 0.188rem; height: 1.25rem; transform: translateY(-50%) scaleY(0); }
  .tncms-header .nav-item .nav-link:hover::before, .tncms-header .nav-item .nav-link.active::before, .tncms-header .nav-item.dropdown:hover > .nav-link::before, .tncms-header .nav-item.dropdown.show > .nav-link::before { transform: translateY(-50%) scaleY(1); }
  .section-title { font-size: 1.6rem; }
  .section-padding { padding: 3.5rem 0; }
  /*Mobile mega-menu*/
  .tncms-header .dropdown-menu.mega-menu { position: static; transform: none; width: 100%; max-width: 100%; box-shadow: none; border: none; border-radius: 0; padding: 1rem; margin-top: .5rem; background: var(--tncms-bg-light); }
  .tncms-header .dropdown-menu.mega-menu-solution { padding: 0; background: #fff; }
  .tncms-header .dropdown-menu.mega-menu::before, .tncms-header .dropdown-menu.mega-menu::after { display: none; }
  .tncms-header .dropdown-menu::before, .tncms-header .dropdown-menu::after { display: none; }
  .tncms-header .has-mega-menu .dropdown-toggle::after { float: right; margin-top: .5rem; margin-left: 0; }
  .mega-item { padding: .4rem; }
  .mega-item-icon { width: 2rem; height: 2rem; }
  .mega-item-title { font-size: .85rem; }
  .mega-item-desc { font-size: .7rem; }
  .dropdown-submenu > .dropdown-menu { position: static; left: auto; margin: 0; padding-left: 1rem; box-shadow: none; border: none; background: transparent; }
  /*移动端顶部：汉堡左、Logo 中、免费试用右*/
  .tncms-header .navbar > .container { position: relative; justify-content: flex-start; }
  .tncms-header .navbar-toggler { padding: .25rem .5rem; border: none; }
  .tncms-header .navbar-brand { gap: 0.5rem; margin-right: 0; padding-top: 0; padding-bottom: 0; }
  .tncms-header .header-actions { margin-left: auto; align-items: center; }
}
@media (max-width: 767.98px) {
  .solution-menu-eyebrow small { display: none; }
  .solution-group:nth-child(n + 2) { padding-top: 1.25rem; border-top: 1px solid #edf2f8; }
  .solution-menu-footer { min-height: 3.25rem; }
}
/*Mobile header controls and first-level navigation indicators.*/
@media (max-width:991.98px) {
  .tncms-header .navbar>.container>.header-actions .btn-trial { height: 2.125rem; padding: 0 1rem; font-size: .8rem; box-shadow: 0 .25rem .75rem rgba(38,75,128,.16); }
  .tncms-header .nav-item.dropdown>.nav-link.dropdown-toggle { position: relative; padding-right: 3rem !important; }
  .tncms-header .nav-item.dropdown>.nav-link.dropdown-toggle::after,
  .tncms-header .nav-item.dropdown:not(.show):hover>.nav-link.dropdown-toggle::after { position: absolute; top: 50%; right: 1rem; width: .5rem; height: .5rem; float: none; margin: 0; border-width: 0 .1rem .1rem 0; transform: translateY(-65%) rotate(45deg); vertical-align: 0; }
  .tncms-header .nav-item.dropdown.show>.nav-link.dropdown-toggle::after,
  .tncms-header .nav-item.dropdown>.nav-link.dropdown-toggle[aria-expanded="true"]::after { transform: translateY(-30%) rotate(-135deg); }
  .tncms-header .nav-link-text { display: inline-flex; align-items: center; min-width: 0; }
  .tncms-header .nav-link-text .badge-hot { position: static; flex: 0 0 auto; margin: 0 0 0 .5rem !important; padding: .18rem .35rem; border-radius: .25rem; font-size: .55rem; transform: none; }
  .tncms-header .nav-link-text .badge-hot::after { display: none; }
}
@media (max-width:399.98px) {
  .tncms-header .navbar>.container>.header-actions .btn-trial { height: 2rem; padding: 0 .75rem; font-size: .75rem; }
}
/*产品中心巨型菜单：按「分类 / 产品能力 / 精选推荐」三层信息组织。*/
.tncms-header .dropdown-menu.mega-menu-product {
  /*桌面端水平定位见上方媒体查询；此处只定义菜单自身尺寸和外观。*/
  width: min(87.5rem, calc(100vw - 2rem));
  max-width: calc(100vw - 2rem);
  padding: 0;
  overflow: hidden;
  border-color: #dce7f5;
  border-radius: 0 0 1.125rem 1.125rem;
  background: #fff;
  --product-menu-primary: var(--tncms-primary, #246bfd);
  --product-menu-dark: color-mix(in srgb, var(--product-menu-primary) 78%, #071b50 22%);
  --product-menu-soft: color-mix(in srgb, var(--product-menu-primary) 7%, #fff 93%);
  --product-menu-soft-strong: color-mix(in srgb, var(--product-menu-primary) 13%, #fff 87%);
  --product-menu-border: color-mix(in srgb, var(--product-menu-primary) 27%, #dce5f1 73%);
  --product-menu-shadow: color-mix(in srgb, var(--product-menu-primary) 16%, transparent);
}
.product-menu-detail { display: inline-flex; flex: 0 0 auto; align-items: center; gap: .375rem; color: var(--product-menu-primary, #246bfd); font-size: .78rem; font-weight: 600; }
.product-menu-detail:hover { color: var(--product-menu-dark, #1559d5); gap: .625rem; }
/*左侧分类列预留更舒展的阅读宽度，长分类名与新品标识均不会显得拥挤。*/
.product-menu-layout { display: grid; grid-template-columns: 11.5rem minmax(0, 1fr) 12.5rem; min-height: 23.75rem; }
.product-menu-categories { padding: 1.2rem .625rem; border-right: 1px solid #e7edf5; background: linear-gradient(180deg, #f7faff, #fbfcff 42%); }
.product-menu-category-heading { display: flex; align-items: center; min-height: 1.75rem; margin: 0 .5rem .65rem; padding-bottom: .45rem; border-bottom: 1px solid #e5edf8; }
.product-menu-category-heading strong { display: inline-flex; align-items: center; gap: .4rem; color: #223652; font-size: .9rem; font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
.product-menu-category-heading i { color: var(--product-menu-primary, #377cf4); font-size: .85rem; }
.product-menu-category { display: flex; width: 100%; min-height: 2.5rem; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .25rem; padding: .5rem .75rem; border: 0; border-radius: .625rem; background: transparent; color: #526176; font: inherit; font-size: .8125rem; text-align: left; white-space: nowrap; cursor: pointer; transition: color .18s ease, background-color .18s ease, box-shadow .18s ease; }
.product-menu-category i { opacity: 0; font-size: .9rem; transform: translateX(-.25rem); transition: opacity .18s ease, transform .18s ease; }
.product-menu-category:hover, .product-menu-category.is-active { background: color-mix(in srgb, var(--product-menu-primary, #246bfd) 13%, #fff); color: var(--product-menu-primary, #246bfd); font-weight: 600; }
.product-menu-category:hover i, .product-menu-category.is-active i { opacity: 1; transform: translateX(0); }
.product-menu-category:disabled { color: #a0acbb; cursor: not-allowed; }
/*分类名与新品角标横向排列，角标不挤压分类文字*/
.product-menu-category-name { display: inline-flex; min-width: 0; align-items: center; line-height: 1.2; }
.product-menu-category-label { display: inline-flex; align-items: center; line-height: 1.2; }
.product-menu-category .badge-new { flex: 0 0 auto; align-self: center; margin-left: .35rem; font-size: .55rem; line-height: 1; vertical-align: initial; }
.product-menu-panels { min-width: 0; padding: 1.2rem 1rem; }
.product-menu-panel[hidden] { display: none; }
.product-menu-panel-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.product-menu-panel-title h3, .product-menu-featured h3 { margin: 0; color: #26364e; font-size: 1rem; font-weight: 700; line-height: 1.4; }
.product-menu-panel-title p { margin: .35rem 0 0; color: #758399; font-size: .75rem; line-height: 1.45; }
.product-menu-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .625rem; }
.product-menu-card { position: relative; display: flex; min-width: 0; min-height: 5.5rem; flex-direction: row; align-items: flex-start; gap: .7rem; padding: .8rem; border: 1px solid #e0e9f6; border-radius: .75rem; background: #fff; color: #273850; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.product-menu-card:hover, .product-menu-card.active { border-color: #a9c9fb; box-shadow: 0 .5rem 1.125rem rgba(36, 107, 253, .12); color: #1d61da; transform: translateY(-.125rem); }
.product-menu-card-icon { display: inline-flex; width: 1.8rem; height: 1.8rem; flex: 0 0 1.8rem; align-items: center; justify-content: center; object-fit: cover; border-radius: .5rem; }
.product-menu-card-icon-fallback { background: #dceaff; color: #246bfd; font-size: .95rem; }
.product-menu-card-copy { min-width: 0; flex: 1 1 auto; padding-top: .15rem; }
.product-menu-card-copy strong { display: block; overflow: hidden; color: inherit; font-size: .8125rem; font-weight: 700; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.product-menu-card-copy small { display: -webkit-box; margin-top: .35rem; overflow: hidden; color: #738196; font-size: .6875rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.product-menu-card .badge-new { margin-left: .35rem; font-size: .55rem; vertical-align: .1rem; }
.product-menu-empty { display: inline-flex; align-items: center; gap: .4rem; padding: .8rem 1rem; border-radius: .625rem; background: #f4f8ff; color: #246bfd; font-size: .82rem; }
.product-menu-featured { display: flex; min-width: 0; flex-direction: column; padding: 1.2rem .9rem .9rem; border-left: 1px solid #e7edf5; background: linear-gradient(180deg, #f9fbff, #fff); }
.product-menu-featured h3 { display: flex; align-items: center; gap: .45rem; }
.product-menu-featured h3::before { width: .25rem; height: 1rem; border-radius: 99rem; background: linear-gradient(color-mix(in srgb, var(--product-menu-primary, #246bfd) 72%, #fff), var(--product-menu-primary, #246bfd)); content: ''; }
.product-menu-featured-list { flex: 1; }
.product-menu-featured-item { display: block; padding: .9rem 0; border-bottom: 1px solid #e9eef5; color: #34445c; }
.product-menu-featured-item:first-child { margin-top: .35rem; }
.product-menu-featured-item:hover strong { color: var(--product-item-accent, var(--product-menu-primary, #246bfd)); }
.product-menu-featured-item strong { display: block; font-size: .8rem; font-weight: 700; line-height: 1.35; transition: color .18s ease; }
.product-menu-featured-item span { display: -webkit-box; margin-top: .25rem; overflow: hidden; color: #7a8799; font-size: .6875rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.product-menu-consult { width: 100%; min-height: 2.625rem; margin-top: 1rem; border: 0; border-radius: .625rem; background: linear-gradient(105deg, #246bfd, #438dff); box-shadow: 0 .45rem 1rem rgba(36, 107, 253, .2); color: #fff; font: inherit; font-size: .8rem; font-weight: 700; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; }
.product-menu-consult:hover { box-shadow: 0 .65rem 1.25rem rgba(36, 107, 253, .28); transform: translateY(-.1rem); }
/*产品分类与产品卡片跟随各自栏目主题色派生强调色和浅色状态。*/
.product-menu-panel,
.product-menu-category,
.product-menu-panel .product-menu-card { --product-menu-accent: var(--product-menu-primary, #246bfd) !important; --product-menu-dark: color-mix(in srgb, var(--product-menu-primary, #246bfd) 78%, #071b50 22%); --product-menu-ink: var(--product-menu-dark); --product-menu-soft: color-mix(in srgb, var(--product-menu-primary, #246bfd) 7%, #fff 93%); --product-menu-soft-strong: color-mix(in srgb, var(--product-menu-primary, #246bfd) 13%, #fff 87%); --product-menu-border: color-mix(in srgb, var(--product-menu-primary, #246bfd) 27%, #dce5f1 73%); --product-menu-shadow: color-mix(in srgb, var(--product-menu-primary, #246bfd) 16%, transparent); }
.product-menu-category:hover, .product-menu-category.is-active { background: var(--product-menu-soft-strong); color: var(--product-menu-accent); box-shadow: inset .18rem 0 0 var(--product-menu-accent); }
.product-menu-panel-title h3 { position: relative; padding-left: .65rem; color: var(--product-menu-ink); }
.product-menu-panel-title h3::before { position: absolute; top: .15rem; bottom: .15rem; left: 0; width: .18rem; border-radius: 99rem; background: var(--product-menu-accent); content: ''; }
.product-menu-panel .product-menu-detail { color: var(--product-menu-accent); }
.product-menu-panel .product-menu-card { border-color: var(--product-menu-border); background: #fff; }
.product-menu-panel .product-menu-card:hover { border-color: color-mix(in srgb, var(--product-menu-primary) 48%, #9fb6d2 52%); box-shadow: 0 .45rem 1rem var(--product-menu-shadow); color: var(--product-menu-ink); }
.product-menu-panel .product-menu-card.active { overflow: hidden; border-color: var(--product-menu-accent); background: var(--product-menu-soft); box-shadow: inset .22rem 0 0 var(--product-menu-accent), 0 .45rem 1rem var(--product-menu-shadow); color: var(--product-menu-ink); }
.product-menu-panel .product-menu-card.active::before { position: absolute; top: 0; right: 0; width: 3.25rem; height: 3.25rem; border-radius: 0 0 0 100%; background: var(--product-menu-soft-strong); content: ''; pointer-events: none; }
.product-menu-panel .product-menu-card-icon-fallback { border: 1px solid var(--product-menu-border); background: var(--product-menu-soft); box-shadow: none; color: var(--product-menu-accent); }
.product-menu-panel .product-menu-card:hover .product-menu-card-icon-fallback { border-color: var(--product-menu-accent); background: var(--product-menu-accent); color: #fff; }
.product-menu-panel .product-menu-card.active .product-menu-card-icon-fallback { border-color: var(--product-menu-accent); background: var(--product-menu-accent); box-shadow: none; color: #fff; }
.product-menu-panel .product-menu-card-copy small { color: #718099; }
.product-menu-panel .product-menu-card.active .product-menu-card-copy strong { color: var(--product-menu-ink); }
@media (max-width: 991.98px) {
  .tncms-header .dropdown-menu.mega-menu-product { width: 100%; border-radius: 0; }
  .product-menu-layout { display: block; min-height: 0; }
  .product-menu-categories { display: flex; overflow-x: auto; padding: .75rem 1rem; border-right: 0; border-bottom: 1px solid #e7edf5; gap: .375rem; }
  .product-menu-category-heading { flex: 0 0 auto; align-self: center; min-height: 2.25rem; margin: 0 .25rem 0 0; padding: 0 .5rem 0 0; border: 0; }
  .product-menu-category { width: auto; min-height: 2.25rem; flex: 0 0 auto; margin: 0; white-space: nowrap; }
  .product-menu-category i { display: none; }
  .product-menu-panels { padding: 1rem; }
  .product-menu-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-menu-featured { display: none; }
}
@media (max-width: 575.98px) {
  .product-menu-panel-title { margin-bottom: .75rem; }
  .product-menu-panel-title p, .product-menu-detail { display: none; }
  .product-menu-card-grid { grid-template-columns: 1fr; }
  .product-menu-card { min-height: 0; padding: .7rem; }
}
/*============================================================================
   建站产品页 & 跨页共享组件 —— 公共样式层
   （由 channel_product_global/jz/kh/md/qz/mall、channel_template、index 等页面样式表中的重复规则统一抽取而来，请勿在页面文件中重复定义）
   ----------------------------------------------------------------------------
   主题定制：各建站页面 CSS 的 .tncms-builder 变量块定义本页主题色派生变量
   （--builder-blue-rgb、--builder-hero-a/b/c、--builder-glow-* 等），本层通过 var() 引用；
   页面文件中与本层同名的规则因后加载而优先生效（用于页面级差异覆盖）。
   ============================================================================*/
/*---------- 公共基础与组件（.tncms-builder / .builder-* 设计系统及跨页共享组件） ----------*/
.tncms-builder *, .tncms-builder *::before, .tncms-builder *::after { box-sizing: border-box; }
.tncms-builder [id] { scroll-margin-top: 8.25rem; }
/*中性主题变量默认值：各产品页变量块（.site-page / .mall-page 等页面类）可覆盖同名变量；
   未定义本页变量块的页面（如复用建站页 CSS 的商城页）由本默认值兜底。*/
.tncms-builder { --builder-grid-rgb: 83, 116, 173; --builder-ink: #121d35; --builder-muted: #65738b; --builder-line: #e4eaf3; --builder-soft: #f6f9fe; --builder-proof-background: #fff; --builder-capabilities-background: #f2f7ff; --builder-workflow-background: #fff; --builder-functions-background: #f2f7ff; --builder-scenarios-background: #fff; --builder-custom-content-background: #f2f7ff; color: var(--builder-ink); overflow: clip; }
.builder-hero { position: relative; min-height: 39rem; padding: 1.5rem 0 3rem; overflow: hidden; background: linear-gradient(125deg, var(--builder-hero-a) 0%, var(--builder-hero-b) 48%, var(--builder-hero-c) 100%); }
.builder-hero-grid, .builder-final-grid { position: absolute; inset: 0; opacity: .45; background-image: linear-gradient(rgba(var(--builder-grid-rgb), .08) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--builder-grid-rgb), .08) 1px, transparent 1px); background-size: 2.75rem 2.75rem; -webkit-mask-image: linear-gradient(to bottom, #000, transparent 92%); mask-image: linear-gradient(to bottom, #000, transparent 92%); }
.builder-glow { position: absolute; border-radius: 50%; filter: blur(10px); pointer-events: none; }
.builder-glow-one { top: -11.25rem; right: -5.625rem; width: 33.75rem; height: 33.75rem; background: rgba(var(--builder-glow-one-rgb), var(--builder-glow-one-alpha)); }
.builder-glow-two { bottom: -14.375rem; left: 26%; width: 32.5rem; height: 32.5rem; background: rgba(var(--builder-glow-two-rgb), var(--builder-glow-two-alpha)); }
/*---------- 全站统一面包屑（配合 inc_breadcrumb.html，分隔符统一 "/"，各栏目页勿再自定义结构与分隔符） ----------*/
.common-breadcrumb { margin-bottom: 1.5rem; font-size: .875rem; }
.common-breadcrumb .breadcrumb { --bs-breadcrumb-divider: "/"; }
.common-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: #b4bdca; }
.common-breadcrumb .breadcrumb-item a { color: #65738a; text-decoration: none; transition: color .2s; }
.common-breadcrumb .breadcrumb-item a:hover { color: #246bfd; }
.common-breadcrumb .breadcrumb-item.active { color: #9aa5b5; }
.builder-eyebrow { display: flex; align-items: center; gap: 0.625rem; color: var(--builder-blue); font-size: .76rem; font-weight: 750; letter-spacing: .16em; }
.builder-eyebrow span { width: 1.75rem; height: 2px; background: linear-gradient(90deg, var(--builder-blue), var(--builder-cyan)); }
.builder-hero-kicker { display: inline-flex; align-items: center; gap: .5rem; margin-bottom: .15rem; padding: .48rem .8rem; border: 1px solid rgba(var(--builder-blue-rgb), .18); border-radius: 2rem; background: rgba(255,255,255,.76); color: var(--builder-blue-dark); font-size: .76rem; font-weight: 700; letter-spacing: .04em; box-shadow: 0 .5rem 1.5rem rgba(var(--builder-blue-rgb), .07); }
.builder-hero h1 { margin: 1.375rem 0; color: #101a31; font-size: clamp(2.65rem, 4vw, 3.35rem); font-weight: 760; letter-spacing: -.01em; line-height: 1.3; text-wrap: balance; }
.builder-hero h1 em { color: var(--builder-blue); font-style: normal; }
.builder-hero-lead { max-width: 37.5rem; margin: 0 0 1.875rem; color: var(--builder-muted); font-size: 1.08rem; line-height: 1.9; }
.builder-hero-actions { display: flex; flex-wrap: wrap; gap: 0.812rem; }
.builder-hero-actions .btn { padding: 0.812rem 1.625rem; border-radius: 0.5rem; font-size: .95rem; font-weight: 650; transition: transform .22s ease, box-shadow .22s ease; }
.builder-btn-primary { border-color: var(--builder-blue); background: var(--builder-blue); color: #fff; box-shadow: 0 0.75rem 1.562rem rgba(var(--builder-blue-rgb), .23); }
.builder-btn-primary:hover { border-color: var(--builder-blue-dark); background: var(--builder-blue-dark); color: #fff; transform: translateY(-0.125rem); box-shadow: 0 1rem 1.875rem rgba(var(--builder-blue-rgb), .3); }
.builder-btn-primary i { margin-left: 0.375rem; }
.builder-btn-ghost { border: 1px solid #cfd9e9; background: rgba(255,255,255,.72); color: #34445f; }
.builder-btn-ghost:hover { border-color: #9fb5d4; color: var(--builder-blue); transform: translateY(-0.125rem); }
.builder-hero-trust { display: flex; flex-wrap: wrap; gap: 1.375rem; margin-top: 1.625rem; color: #718097; font-size: .82rem; }
.builder-hero-trust i { margin-right: 0.375rem; color: #25b786; font-size: .85rem; }
.builder-browser { position: relative; width: min(100%, 40.625rem); margin: 0 auto; filter: drop-shadow(0 1.875rem 2.812rem rgba(40, 77, 133, .16)); }
.builder-browser-bar { display: grid; grid-template-columns: 1fr 2.4fr 1fr; align-items: center; height: 2.438rem; padding: 0 0.875rem; border: 1px solid #d9e2ef; border-bottom: 0; border-radius: 0.812rem 0.812rem 0 0; background: #fff; color: #a3adbc; font-size: .65rem; }
.browser-dots { display: flex; gap: 0.312rem; }
.browser-dots i { width: 0.438rem; height: 0.438rem; border-radius: 50%; background: #e5eaf1; }
.browser-dots i:first-child { background: #ff857a; }
.browser-dots i:nth-child(2) { background: #ffc86b; }
.browser-dots i:last-child { background: #69d6a1; }
.browser-address { padding: 0.312rem 0.938rem; border-radius: 0.312rem; background: #f4f6f9; text-align: center; }
.browser-address i { margin-right: 0.312rem; color: #8c9caf; }
.builder-browser-bar > i { justify-self: end; }
.builder-browser-body { display: flex; height: 24.062rem; overflow: hidden; border: 1px solid #d9e2ef; border-radius: 0 0 0.812rem 0.812rem; background: #fff; }
.builder-hero-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.site-editor { display: flex; flex: 1; flex-direction: column; }
.site-editor-bar { display: flex; height: 2.625rem; flex: 0 0 2.625rem; align-items: center; gap: 1rem; padding: 0 1rem; border-bottom: 1px solid #eef2f8; background: #fbfcfe; }
.site-editor-bar > b { display: flex; align-items: center; gap: 0.375rem; margin-right: auto; color: #263751; font-size: .68rem; }
.site-editor-bar > b i { color: var(--builder-blue); font-size: .8rem; }
.site-device-switch { display: flex; align-items: center; gap: 0.125rem; padding: 0.188rem; border-radius: 0.438rem; background: #eef2f8; color: #8a99af; font-size: .68rem; }
.site-device-switch i { display: flex; width: 1.375rem; height: 1.125rem; align-items: center; justify-content: center; border-radius: 0.312rem; }
.site-device-switch i.active { background: #fff; color: var(--builder-blue); box-shadow: 0 0.125rem 0.312rem rgba(35, 68, 119, .12); }
.site-editor-actions { display: flex; align-items: center; gap: 0.5rem; }
.site-editor-actions em { padding: 0.25rem 0.625rem; border: 1px solid #d7e3ee; border-radius: 0.312rem; color: #4a5b74; font-size: .55rem; font-style: normal; }
.site-editor-actions strong { padding: 0.25rem 0.75rem; border-radius: 0.312rem; background: var(--builder-blue); color: #fff; font-size: .55rem; box-shadow: 0 0.25rem 0.625rem rgba(36, 107, 253, .3); }
.site-canvas { position: relative; display: flex; flex: 1; flex-direction: column; gap: 0.625rem; margin: 0.75rem; overflow: hidden; }
.site-canvas-nav { display: flex; height: 2.25rem; flex: 0 0 2.25rem; align-items: center; gap: 1.125rem; padding: 0 1.125rem; border-radius: 0.5rem; background: #fff; box-shadow: 0 0.25rem 0.75rem rgba(35, 68, 119, .05); }
.site-canvas-nav b { margin-right: auto; color: var(--builder-blue); font-size: .78rem; letter-spacing: .06em; }
.site-canvas-nav span { width: 1.625rem; height: 0.188rem; border-radius: 0.125rem; background: #b8c4d6; }
.site-canvas-nav i { width: 2.75rem; height: 1.062rem; border-radius: 0.25rem; background: var(--builder-blue); }
.site-hero-block { position: relative; display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.375rem; border: 1px solid var(--builder-blue); border-radius: 0.625rem; background: #fff; box-shadow: 0 0.75rem 1.5rem rgba(36, 107, 253, .1); }
.site-block-tag { position: absolute; top: -0.812rem; left: 0.75rem; display: flex; align-items: center; gap: 0.125rem; padding: 0.125rem 0.5rem; border-radius: 0.375rem; background: var(--builder-blue); color: #fff; font-size: .5rem; font-style: normal; box-shadow: 0 0.25rem 0.625rem rgba(36, 107, 253, .35); }
.site-hero-copy { display: flex; flex-direction: column; align-items: flex-start; }
.site-hero-copy small { margin-bottom: 0.5rem; color: var(--builder-blue); font-size: .48rem; font-weight: 700; letter-spacing: .15em; }
.site-hero-copy strong { color: #15213a; font-size: 1.22rem; line-height: 1.4; }
.site-hero-copy > span { margin-top: 0.5rem; color: #8a96a8; font-size: .58rem; }
.site-hero-copy button { margin-top: 0.625rem; padding: 0.375rem 0.875rem; border: 0; border-radius: 0.25rem; background: var(--builder-blue); color: #fff; font-size: .55rem; box-shadow: 0 0.375rem 0.875rem rgba(36, 107, 253, .3); }
.site-hero-art { position: relative; display: flex; width: 9rem; height: 6rem; flex: 0 0 9rem; align-items: center; justify-content: center; overflow: hidden; border-radius: 0.625rem; background: linear-gradient(140deg, #5f8eff, #246bfd 55%, #163eac); color: rgba(255, 255, 255, .9); font-size: 1.5rem; }
.site-hero-art::before { content: ''; position: absolute; top: -2.5rem; right: -2.5rem; width: 6.25rem; height: 6.25rem; border: 1.125rem solid rgba(255, 255, 255, .16); border-radius: 50%; }
.site-hero-art::after { content: ''; position: absolute; bottom: -1.875rem; left: -1.25rem; width: 5rem; height: 5rem; border-radius: 50%; background: rgba(255, 255, 255, .12); }
.site-hero-art i { position: relative; z-index: 1; display: flex; width: 2.5rem; height: 2.5rem; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255, 255, 255, .2); }
.site-insert { position: relative; display: flex; flex: 0 0 auto; align-items: center; justify-content: center; }
.site-insert span { display: flex; align-items: center; gap: 0.25rem; padding: 0.25rem 0.75rem; border: 1px dashed rgba(36, 107, 253, .55); border-radius: 1rem; background: rgba(234, 241, 255, .6); color: var(--builder-blue); font-size: .55rem; font-weight: 700; }
.site-cursor { position: absolute; bottom: -0.5rem; left: calc(50% + 3.125rem); color: #263751; font-size: .8rem; transform: rotate(-12deg); filter: drop-shadow(0 0.125rem 0.125rem rgba(255, 255, 255, .9)); }
.site-cards { display: flex; flex: 0 0 auto; gap: 0.625rem; margin-top: auto; }
.site-cards article { display: flex; flex: 1; align-items: center; gap: 0.5rem; padding: 0.562rem 0.75rem; border-radius: 0.5rem; background: #fff; box-shadow: 0 0.25rem 0.75rem rgba(35, 68, 119, .05); }
.site-cards i { display: flex; width: 1.5rem; height: 1.5rem; flex: 0 0 1.5rem; align-items: center; justify-content: center; border-radius: 0.375rem; background: linear-gradient(140deg, #5f8eff, #246bfd); color: #fff; font-size: .75rem; }
.site-cards b { color: #2b3c56; font-size: .55rem; }
.builder-device-mobile { position: absolute; right: -1.375rem; bottom: -1.75rem; z-index: 5; width: 7.25rem; height: 14.062rem; padding: 0.438rem; border: 2px solid #d6deea; border-radius: 1.25rem; background: #fff; box-shadow: 0 1.25rem 2.188rem rgba(32, 61, 109, .2); }
.device-speaker { position: absolute; z-index: 2; top: 0.5rem; left: 50%; width: 1.75rem; height: 0.188rem; border-radius: 0.125rem; background: #cad3df; transform: translateX(-50%); }
.device-screen { display: flex; height: 100%; flex-direction: column; padding: 0.875rem 0.625rem; overflow: hidden; border-radius: 0.875rem; background: linear-gradient(150deg, #f8fbff, #dce9ff); }
.device-nav { display: flex; align-items: center; justify-content: space-between; }
.device-nav b { display: flex; width: 1.125rem; height: 1.125rem; align-items: center; justify-content: center; border-radius: 0.312rem; background: var(--builder-blue); color: #fff; font-size: .58rem; }
.device-nav span { width: 0.75rem; height: 0.125rem; border-radius: 1px; background: #9fb0c6; box-shadow: 0 0.25rem 0 #9fb0c6, 0 -0.25rem 0 #9fb0c6; }
.device-copy { display: flex; flex-direction: column; align-items: flex-start; margin-top: 0.75rem; }
.device-copy small { color: var(--builder-blue); font-size: .4rem; font-weight: 700; letter-spacing: .12em; }
.device-copy strong { margin-top: 0.25rem; color: #15213a; font-size: .72rem; line-height: 1.35; }
.device-copy em { margin-top: 0.438rem; padding: 0.188rem 0.562rem; border-radius: 0.25rem; background: var(--builder-blue); color: #fff; font-size: .5rem; font-style: normal; }
.device-art { position: relative; display: flex; height: 3.25rem; align-items: center; justify-content: center; margin-top: 0.625rem; overflow: hidden; border-radius: 0.5rem; background: linear-gradient(140deg, var(--builder-device-a), var(--builder-device-b) 60%, var(--builder-device-c)); color: rgba(255, 255, 255, .9); font-size: 1rem; }
.device-art::before { content: ''; position: absolute; top: -1.75rem; right: -1.75rem; width: 4.375rem; height: 4.375rem; border: 0.75rem solid rgba(255, 255, 255, .16); border-radius: 50%; }
.device-lines { margin-top: auto; }
.device-lines span { display: block; width: 4.625rem; height: 0.188rem; margin-top: 0.5rem; border-radius: 0.125rem; background: #b9c7dc; }
.device-lines span:last-child { width: 3.125rem; }
.builder-float-card { position: absolute; z-index: 6; display: flex; align-items: center; gap: 0.562rem; padding: 0.625rem 0.812rem; border: 1px solid rgba(216, 225, 239, .8); border-radius: 0.625rem; background: rgba(255,255,255,.92); color: #8290a4; font-size: .61rem; box-shadow: 0 0.75rem 1.562rem rgba(35, 68, 119, .12); backdrop-filter: blur(8px); }
.builder-float-card > i { display: flex; width: 1.75rem; height: 1.75rem; align-items: center; justify-content: center; border-radius: 0.5rem; background: #eaf1ff; color: var(--builder-blue); font-size: .9rem; }
.builder-float-card span { display: flex; flex-direction: column; }
.builder-float-card b { color: #263751; font-size: .7rem; }
.float-card-speed { bottom: -2.25rem; left: -0.5rem; }
.float-card-live { top: 8.75rem; right: -2rem; }
.float-card-live > i { background: #e9faf5; color: #16a34a; }
.builder-subnav-sentinel { width: 100%; height: 0; }
.builder-subnav { position: sticky; top: var(--tncms-header-height); z-index: 1015; height: 4.375rem; border-bottom: 1px solid var(--builder-line); background: rgba(255,255,255,.96); box-shadow: 0 0.438rem 1.25rem rgba(31, 55, 91, .04); backdrop-filter: blur(12px); transition: top .28s ease, box-shadow .28s ease; }
.builder-product-nav-docked .tncms-header { opacity: 0; pointer-events: none; transform: translateY(-100%); }
.builder-product-nav-docked .builder-subnav-sentinel { height: 4.375rem; }
.builder-product-nav-docked .builder-subnav { position: fixed; top: 0; right: 0; left: 0; z-index: 1040; box-shadow: 0 0.5rem 1.5rem rgba(31, 55, 91, .1); }
.builder-product-nav-docked .tncms-builder [id] { scroll-margin-top: 5.625rem; }
.builder-subnav .container { display: flex; height: 100%; align-items: center; }
.builder-mini-logo { display: block; width: auto; max-width: 0; height: 2.5rem; flex: 0 0 auto; object-fit: contain; object-position: left center; opacity: 0; visibility: hidden; transform: translateY(-0.4rem); transition: max-width .28s ease, opacity .2s ease, transform .28s ease, visibility .2s; }
.builder-product-nav-docked .builder-mini-logo { max-width: 10.5rem; opacity: 1; visibility: visible; transform: none; }
.builder-subnav-links a { position: relative; display: flex; align-items: center; color: #65738a; font-size: .86rem; white-space: nowrap; }
.builder-subnav-links a::after { content: ''; position: absolute; right: 0; bottom: -0.062rem; left: 0; height: 2px; background: var(--builder-blue); transform: scaleX(0); transition: transform .2s; }
.builder-subnav-links a:hover, .builder-subnav-links a.active { color: var(--builder-blue); }
.builder-subnav-links a.active::after { transform: scaleX(1); }
.builder-subnav-links a.active,
.about-subnav-links a.active,
.solution-anchor-links a.active,
nav [class*="-nav-links"] a.active { font-weight: 700; }
.builder-subnav-links a.active::after,
.about-subnav-links a.active::after,
.solution-anchor-links a.active::after,
nav [class*="-nav-links"] a.active::after { height: 3px; }
.builder-subnav-cta { max-width: 0; margin-left: auto; padding: 0.562rem 0; overflow: hidden; border-radius: 62.438rem; background: var(--builder-blue); color: #fff; font-size: .8rem; font-weight: 650; opacity: 0; visibility: hidden; white-space: nowrap; transform: translateY(-0.5rem); transition: max-width .28s ease, padding .28s ease, opacity .2s ease, transform .28s ease, visibility .2s; }
.builder-product-nav-docked .builder-subnav-cta { max-width: 8.125rem; padding: 0.562rem 1.375rem; opacity: 1; visibility: visible; transform: none; }
.builder-subnav-cta:hover { background: var(--builder-blue-dark); color: #fff; }
.builder-proof { padding: 3.75rem 0; border-bottom: 1px solid #edf1f7; background: var(--builder-proof-background); }
.proof-item { position: relative; text-align: center; }
.proof-item::after { content: ''; position: absolute; top: 0.438rem; right: 0; width: 1px; height: 3.188rem; background: #e4eaf2; }
.builder-proof [class*="col-"]:last-child .proof-item::after { display: none; }
.proof-item strong { font-size: clamp(1.75rem, 3vw, 2.4rem); letter-spacing: -.035em; }
.proof-item strong span { color: var(--builder-blue); font-size: .62em; }
.proof-item p { margin: 0.312rem 0 0; color: #8490a2; font-size: .78rem; }
.builder-section-head > span { color: var(--builder-blue); font-size: .73rem; font-weight: 750; letter-spacing: .16em; }
.builder-capabilities { background: var(--builder-capabilities-background); }
.capability-card:hover { transform: translateY(-0.375rem); box-shadow: 0 1.25rem 2.625rem rgba(31, 65, 116, .13); }
.capability-card-featured { background: linear-gradient(145deg, #f3f7ff, #fff 55%); }
.capability-demo { position: absolute; right: 1.562rem; bottom: 1.375rem; left: 1.562rem; height: 5.375rem; }
.demo-editor { border: 1px solid #dce5f2; border-radius: 0.562rem; background: #f8faff; box-shadow: 0 0.625rem 1.25rem rgba(41,77,130,.07); }
.demo-editor i { position: absolute; top: 0; bottom: 0; left: 0; width: 1.75rem; border-right: 1px solid #e0e7f1; background: #fff; }
.demo-editor span { position: absolute; top: 1.062rem; left: 2.812rem; width: 5.312rem; height: 0.438rem; border-radius: 0.188rem; background: #779cf3; }
.demo-editor span:nth-of-type(2) { top: 2.062rem; width: 7.812rem; background: #d1dbea; }
.demo-editor b { position: absolute; right: 1rem; bottom: 0.812rem; width: 4.375rem; height: 2.875rem; border-radius: 0.438rem; background: linear-gradient(145deg, #5a86ee, #24c8dc); }
.demo-editor em { position: absolute; bottom: 1rem; left: 2.812rem; width: 2.938rem; height: 1.125rem; border-radius: 0.25rem; background: var(--builder-blue); }
.demo-devices { display: flex; align-items: flex-end; justify-content: center; gap: 0.562rem; }
.demo-devices span, .demo-devices i, .demo-devices b { display: block; border: 2px solid #9bb0cc; border-radius: 0.312rem; background: linear-gradient(145deg, #eef3ff, #d7e5ff); box-shadow: inset 0 -1.562rem #5f8dfa; }
.demo-devices span { width: 7.875rem; height: 4.812rem; }
.demo-devices i { width: 3rem; height: 4.375rem; }
.demo-devices b { width: 1.938rem; height: 3.625rem; }
.demo-theme { display: flex; align-items: center; gap: 0.812rem; padding: 0 0.938rem; }
.demo-theme span { display: block; width: 2.312rem; height: 2.312rem; border-radius: 50%; background: var(--builder-demo-a); }
.demo-theme span:nth-child(2) { background: var(--builder-demo-b); }
.demo-theme span:nth-child(3) { background: #ff9e67; }
.demo-theme i { margin-left: auto; color: #263550; font-family: Georgia, serif; font-size: 2.1rem; font-style: normal; }
.capability-tags { position: absolute; right: 1.75rem; bottom: 1.938rem; left: 1.75rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.capability-tags span { padding: 0.438rem 0.688rem; border: 1px solid #dfe7f2; border-radius: 0.375rem; background: #f8faff; color: #718099; font-size: .7rem; }
.builder-workflow { background: var(--builder-workflow-background); }
.workflow-visual { position: relative; min-height: 30rem; border-radius: 1.5rem; background: linear-gradient(145deg, #eaf2ff, #f5f9ff); }
.workflow-window { position: absolute; top: 4.188rem; right: 2.812rem; bottom: 3.438rem; left: 2.812rem; overflow: hidden; border: 1px solid #d7e1ef; border-radius: 0.812rem; background: #fff; box-shadow: 0 1.5rem 2.812rem rgba(35, 69, 120, .16); }
.workflow-window-top { display: flex; height: 2.188rem; align-items: center; gap: 0.312rem; padding-left: 0.75rem; border-bottom: 1px solid #e7ecf3; }
.workflow-window-top span { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: #d8e0ea; }
.workflow-sidebar { position: absolute; top: 2.188rem; bottom: 0; left: 0; display: flex; width: 2.375rem; flex-direction: column; align-items: center; gap: 1rem; padding-top: 1.062rem; border-right: 1px solid #e7ecf3; background: #fafcff; }
.workflow-sidebar i { width: 0.938rem; height: 0.938rem; border-radius: 0.25rem; background: #d6dfec; }
.workflow-sidebar i:first-child { background: var(--builder-blue); }
.workflow-content { position: absolute; top: 2.188rem; right: 0; bottom: 0; left: 2.375rem; padding: 3rem 2.625rem; background: linear-gradient(135deg, #f9fbff, #edf4ff); }
.workflow-content > span { display: block; width: 3.5rem; height: 0.375rem; margin-bottom: 0.812rem; background: #5a88f1; }
.workflow-content b { display: block; width: 57%; height: 0.812rem; margin-bottom: 0.625rem; border-radius: 0.188rem; background: #b7c7dd; }
.workflow-content b:nth-of-type(2) { width: 42%; }
.workflow-content em { display: inline-block; width: 27%; height: 5.688rem; margin: 2.188rem 0.625rem 0 0; border-radius: 0.438rem; background: #dbe6f5; }
.workflow-content em:nth-of-type(2) { background: #80a1ed; }
.workflow-content em:nth-of-type(3) { background: #9cdbe3; }
.workflow-panel { position: absolute; top: 1.375rem; left: 0.25rem; z-index: 3; display: flex; width: 9.062rem; flex-direction: column; gap: 0.438rem; padding: 0.875rem; border: 1px solid #dce4ef; border-radius: 0.688rem; background: rgba(255,255,255,.95); box-shadow: 0 1rem 1.75rem rgba(37,69,116,.15); }
.workflow-panel small { margin-bottom: 0.188rem; color: #8491a4; }
.workflow-panel span { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem; border-radius: 0.375rem; background: #f6f8fc; color: #5f6f87; font-size: .67rem; }
.workflow-panel i { color: var(--builder-blue); }
.workflow-cursor { position: absolute; z-index: 4; right: 21%; bottom: 28%; color: var(--builder-blue); }
.workflow-cursor > i { font-size: 1.35rem; transform: rotate(-15deg); }
.workflow-cursor span { margin-left: 0.25rem; padding: 0.312rem 0.5rem; border-radius: 0.312rem; background: var(--builder-blue); color: #fff; font-size: .59rem; box-shadow: 0 0.438rem 1rem rgba(var(--builder-blue-rgb), .25); }
.workflow-steps { margin-top: 1.688rem; }
.workflow-steps li { position: relative; display: flex; gap: 1.312rem; padding: 1rem 0; }
.workflow-steps li:not(:last-child)::after { content: ''; position: absolute; top: 3.562rem; bottom: -0.375rem; left: 1.25rem; width: 1px; background: #dbe4f1; }
.workflow-steps li > b { display: flex; width: 2.562rem; height: 2.562rem; flex: 0 0 2.562rem; align-items: center; justify-content: center; border-radius: 50%; background: #eef4ff; color: var(--builder-blue); font-size: .7rem; }
.workflow-steps h3 { margin: 0.062rem 0 0.438rem; font-size: 1.1rem; line-height: 1.45; }
.workflow-steps p { margin: 0; color: var(--builder-muted); font-size: .9rem; line-height: 1.75; }
.builder-functions .builder-section-head p { color: #9ba7ba; }
.function-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.125rem; }
.function-card { position: relative; display: flex; min-height: 20rem; grid-column: span 4; align-items: stretch; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 1.125rem; background: linear-gradient(145deg, #19253d, #141e33); box-shadow: 0 1.125rem 2.5rem rgba(0,0,0,.16); }
.function-card:first-child, .function-card:nth-child(5) { grid-column: span 8; }
.function-copy { position: relative; z-index: 2; width: 62%; padding: 2rem; }
.function-card:not(:first-child):not(:nth-child(5)) .function-copy { width: 100%; }
.function-copy > span { position: absolute; top: 1rem; right: 1.25rem; color: rgba(255,255,255,.08); font-size: 3rem; font-weight: 800; }
.function-copy > i { display: flex; width: 3rem; height: 3rem; align-items: center; justify-content: center; margin-bottom: 2.5rem; border-radius: 0.875rem; background: rgba(75,132,255,.16); color: #77a3ff; font-size: 1.25rem; }
.function-copy h3 { margin-bottom: 0.875rem; font-size: 1.25rem; font-weight: 700; }
.function-copy p { margin: 0; color: #a6b2c5; font-size: .84rem; line-height: 1.85; }
.function-copy small { display: inline-block; margin-top: 1.125rem; padding: 0.375rem 0.625rem; border-radius: 62.438rem; background: rgba(255,255,255,.07); color: #c4cede; font-size: .68rem; }
.function-card img { width: 38%; min-height: 100%; object-fit: cover; }
.function-visual { position: absolute; right: -1.25rem; bottom: -2.5rem; width: 11.25rem; height: 11.25rem; border: 1.75rem solid rgba(75,132,255,.22); border-radius: 50%; transform: rotate(-20deg); }
.function-visual i { position: absolute; display: block; width: 3.75rem; height: 4.75rem; border-radius: 0.625rem; background: linear-gradient(145deg, rgba(87,139,255,.8), rgba(36,198,229,.72)); box-shadow: 0 0.75rem 1.5rem rgba(0,0,0,.2); }
.function-visual i:first-child { top: -1rem; left: -2rem; transform: rotate(-12deg); }
.function-visual i:nth-child(2) { right: -1rem; bottom: 1.5rem; transform: rotate(15deg); }
.function-visual i:nth-child(3) { bottom: -1rem; left: 1.25rem; transform: rotate(7deg); }
.function-visual b { position: absolute; inset: 2.25rem; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; }
.builder-scenarios { position: relative; background: var(--builder-scenarios-background); }
.builder-scenarios > .container > .builder-section-head { margin-bottom: 3.5rem; }
.builder-scenario-shell { display: grid; grid-template-columns: 17rem minmax(0, 1fr); gap: .875rem; padding: .875rem; overflow: hidden; border: 1px solid rgba(210,221,214,.92); border-radius: 1.75rem; background: rgba(255,255,255,.96); box-shadow: 0 1.75rem 4.5rem rgba(28,44,73,.1); }
.builder-scenario-tabs button:hover { border-color: #d8dee8; background: rgba(255,255,255,.78); color: #162033; transform: translateX(.1875rem); }
.builder-scenario-tabs button.active::before { border-color: color-mix(in srgb,var(--builder-blue) 35%,transparent); background: color-mix(in srgb,var(--builder-blue) 16%,transparent); color: color-mix(in srgb,var(--builder-blue) 72%,#fff); }
.builder-scenario-tabs button:focus-visible { outline: .1875rem solid color-mix(in srgb,var(--builder-blue) 28%,transparent); outline-offset: .125rem; }
.builder-scenario-panels { min-width: 0; }
.builder-scenario-panel { display: none; min-height: 35rem; grid-template-columns: minmax(18rem,.78fr) minmax(0,1.22fr); overflow: hidden; border: 1px solid #e3e7ee; border-radius: 1.25rem; background: #fff; }
.builder-scenario-panel.active { display: grid; animation: builder-scenario-enter .42s ease both; }
/*文案在左、视觉图在右（DOM 顺序不变，移动端堆叠时文案在上）*/
.builder-scenario-copy { order: 1; }
.builder-scenario-visual, .builder-scenario-panel > img { order: 2; }
@keyframes builder-scenario-enter {
  from { opacity: 0; transform: translateY(.75rem); }
  to { opacity: 1; transform: none; }
}
.builder-scenario-copy { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: clamp(2.5rem,3.25vw,3.75rem); background: linear-gradient(90deg,rgba(255,255,255,.92),#fff); }
.builder-scenario-copy > span { display: inline-flex; width: max-content; min-height: 1.875rem; align-items: center; padding: 0 .75rem; border: 1px solid color-mix(in srgb,var(--builder-blue) 24%,#dfe5ee); border-radius: 62.5rem; background: color-mix(in srgb,var(--builder-blue) 8%,#fff); color: var(--builder-blue); font-size: .6875rem; font-weight: 700; letter-spacing: .15em; }
.builder-scenario-copy h3 { margin: 1.375rem 0 1rem; font-size: clamp(2.25rem,3.2vw,3.25rem); font-weight: 720; letter-spacing: -.045em; line-height: 1.15; }
.builder-scenario-copy p { max-width: 27rem; margin: 0; color: #657184; font-size: 1rem; line-height: 1.85; }
.builder-scenario-copy a { display: inline-flex; width: max-content; align-items: center; gap: .5rem; margin-top: 2rem; color: #10192a; font-weight: 650; }
.builder-scenario-copy a i { transition: transform .2s ease; }
.builder-scenario-copy a:hover { color: var(--builder-blue); }
.builder-scenario-copy a:hover i { transform: translateX(.25rem); }
.builder-scenario-visual { position: relative; min-height: 33rem; margin: 1rem; overflow: hidden; border-radius: 1rem; background: linear-gradient(145deg,#e7efff 0%,#d7e5ff 100%); isolation: isolate; }
.builder-scenario-visual::before { position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(45,91,175,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(45,91,175,.055) 1px,transparent 1px); background-size: 2.5rem 2.5rem; content: ""; mask-image: linear-gradient(135deg,#000,transparent 75%); }
.builder-scenario-visual::after { position: absolute; right: -7rem; bottom: -9rem; z-index: -1; width: 25rem; height: 25rem; border: 1px solid color-mix(in srgb,var(--builder-blue) 18%,transparent); border-radius: 50%; box-shadow: 0 0 0 4rem rgba(255,255,255,.12),0 0 0 8rem rgba(255,255,255,.08); content: ""; }
.builder-scenario-tone-2 { background: linear-gradient(145deg,#f2f4f8,#e2e7ef); }
.builder-scenario-tone-3 { background: linear-gradient(145deg,#e7f3f8,#d4eaf2); }
.builder-scenario-tone-4 { background: linear-gradient(145deg,#ebedff,#dce2ff); }
.builder-scenario-browser { position: absolute; top: 3.5rem; right: 8%; left: 8%; overflow: hidden; border: 1px solid rgba(42,55,81,.18); border-radius: .9rem; background: #fff; box-shadow: 0 2rem 4rem rgba(35,57,98,.2); transform: rotate(-2deg); }
.builder-scenario-browser-bar { display: flex; height: 2.4rem; align-items: center; gap: .35rem; padding: 0 .8rem; border-bottom: 1px solid #e7ebf1; background: #f7f9fc; }
.builder-scenario-browser-bar > i { width: .42rem; height: .42rem; border-radius: 50%; background: #ff8275; }
.builder-scenario-browser-bar > i:nth-child(2) { background: #ffc05d; }
.builder-scenario-browser-bar > i:nth-child(3) { background: #62ce91; }
.builder-scenario-browser-bar span { margin: 0 auto; color: #9aa3b2; font-size: .48rem; }
.builder-scenario-site { height: 22rem; overflow: hidden; }
.builder-scenario-site header { display: flex; height: 3.2rem; align-items: center; gap: .65rem; padding: 0 1.2rem; color: #303b50; font-size: .62rem; }
.builder-scenario-site header b { display: grid; width: 1.65rem; height: 1.65rem; place-items: center; border-radius: .3rem; background: #17233a; color: #fff; }
.builder-scenario-site header span { font-weight: 700; }
.builder-scenario-site header nav { margin-left: auto; color: #8490a2; font-size: .46rem; white-space: nowrap; }
.builder-scenario-site header > i { margin-left: auto; }
.builder-scenario-site header nav + i { margin-left: .8rem; }
.builder-scenario-brand-hero { display: grid; height: 11rem; grid-template-columns: 1.3fr .7fr; overflow: hidden; background: linear-gradient(125deg,#173764,#4b7fd6); color: #fff; }
.builder-scenario-brand-hero > div { padding: 1.65rem 1.8rem; }
.builder-scenario-brand-hero small,.builder-scenario-product-hero small,.builder-scenario-franchise-head small { font-size: .43rem; letter-spacing: .16em; }
.builder-scenario-brand-hero strong,.builder-scenario-product-hero strong,.builder-scenario-franchise-head strong { display: block; margin: .55rem 0 .35rem; font-size: 1.2rem; line-height: 1.3; }
.builder-scenario-brand-hero p,.builder-scenario-product-hero p,.builder-scenario-franchise-head p { margin: 0; color: rgba(255,255,255,.68); font-size: .46rem; }
.builder-scenario-brand-hero em,.builder-scenario-product-hero em,.builder-scenario-franchise-head em { display: inline-flex; align-items: center; gap: .3rem; margin-top: .75rem; padding: .35rem .6rem; border-radius: 1rem; background: #fff; color: #275496; font-size: .44rem; font-style: normal; font-weight: 700; }
.builder-scenario-brand-hero aside { display: flex; flex-direction: column; justify-content: center; gap: .65rem; padding: 1rem; background: rgba(9,28,57,.22); }
.builder-scenario-brand-hero aside > i { font-size: 1.4rem; opacity: .72; }
.builder-scenario-brand-hero aside span { display: flex; align-items: baseline; gap: .35rem; color: rgba(255,255,255,.7); font-size: .42rem; }
.builder-scenario-brand-hero aside b { color: #fff; font-size: .9rem; }
.builder-scenario-brand-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .55rem; padding: .75rem; }
.builder-scenario-brand-grid span { display: grid; min-width: 0; grid-template-columns: 1.65rem 1fr; column-gap: .45rem; align-items: center; padding: .6rem; border-radius: .45rem; background: #f3f6fb; }
.builder-scenario-brand-grid i { grid-row: 1/3; color: var(--builder-blue); font-size: .85rem; }
.builder-scenario-brand-grid b { color: #344156; font-size: .5rem; }
.builder-scenario-brand-grid small { overflow: hidden; color: #8b95a4; font-size: .36rem; white-space: nowrap; }
.builder-scenario-product-hero { display: grid; height: 13rem; grid-template-columns: .9fr 1.1fr; background: linear-gradient(125deg,#15294b,#3b6fc5); color: #fff; }
.builder-scenario-product-hero > div:last-child { padding: 1.45rem 1.2rem; }
.builder-scenario-product-art { position: relative; overflow: hidden; background: radial-gradient(circle at 50% 48%,#6da1ed,transparent 55%); }
.builder-scenario-product-art > i { position: absolute; top: 2rem; left: 22%; width: 5.5rem; height: 8.5rem; border: .7rem solid rgba(255,255,255,.82); border-radius: 1.1rem; background: linear-gradient(155deg,#6e8ec5,#172a4c); box-shadow: 0 1rem 2rem rgba(3,17,42,.3); transform: rotate(-8deg); }
.builder-scenario-product-art > i:nth-child(2) { top: 3rem; left: 47%; height: 7rem; opacity: .45; transform: rotate(12deg); }
.builder-scenario-product-art > span { position: absolute; right: .7rem; bottom: .8rem; padding: .35rem; border-radius: 50%; background: #fff; color: #2d60ad; font-size: .42rem; font-weight: 800; }
.builder-scenario-product-hero ul { display: flex; gap: .75rem; margin: .7rem 0 0; padding: 0; list-style: none; }
.builder-scenario-product-hero li { display: flex; flex-direction: column; color: rgba(255,255,255,.67); font-size: .38rem; }
.builder-scenario-product-hero li b { color: #fff; font-size: .75rem; }
.builder-scenario-proof { display: grid; grid-template-columns: repeat(3,1fr); gap: .55rem; padding: .75rem; }
.builder-scenario-proof span { display: flex; height: 3.3rem; align-items: center; justify-content: center; gap: .4rem; border-radius: .45rem; background: #f1f5fb; color: #56657b; font-size: .44rem; }
.builder-scenario-proof i { color: var(--builder-blue); font-size: .75rem; }
.builder-scenario-franchise-head { display: grid; height: 13rem; grid-template-columns: 1fr 1fr; background: linear-gradient(125deg,#3d2f25,#b67a51); color: #fff; }
.builder-scenario-franchise-head > div:first-child { padding: 1.55rem 1.6rem; }
.builder-scenario-franchise-map { position: relative; overflow: hidden; background: radial-gradient(ellipse at center,rgba(255,255,255,.18),transparent 65%); }
.builder-scenario-franchise-map::before { position: absolute; inset: 1.4rem .8rem; border: 1px dashed rgba(255,255,255,.3); border-radius: 48% 35% 52% 42%; content: ""; transform: rotate(-12deg); }
.builder-scenario-franchise-map > i { position: absolute; width: .55rem; height: .55rem; border: .18rem solid rgba(255,255,255,.48); border-radius: 50%; background: #fff; box-shadow: 0 0 0 .25rem rgba(255,255,255,.12); }
.builder-scenario-franchise-map > i:nth-child(1) { top: 28%; left: 25%; }
.builder-scenario-franchise-map > i:nth-child(2) { top: 47%; left: 62%; }
.builder-scenario-franchise-map > i:nth-child(3) { top: 68%; left: 39%; }
.builder-scenario-franchise-map > i:nth-child(4) { top: 23%; right: 13%; }
.builder-scenario-franchise-map span { position: absolute; right: .7rem; bottom: .7rem; padding: .5rem .65rem; border-radius: .45rem; background: rgba(34,22,16,.62); color: rgba(255,255,255,.7); font-size: .4rem; }
.builder-scenario-franchise-map b { display: block; color: #fff; font-size: .85rem; }
.builder-scenario-franchise-flow { display: grid; grid-template-columns: repeat(4,1fr); gap: .3rem; padding: .85rem; }
.builder-scenario-franchise-flow span { position: relative; display: flex; align-items: center; gap: .35rem; color: #586579; font-size: .43rem; }
.builder-scenario-franchise-flow span:not(:last-child)::after { position: absolute; right: -.15rem; width: .6rem; border-top: 1px dashed #b8c1ce; content: ""; }
.builder-scenario-franchise-flow i { display: grid; width: 1.45rem; height: 1.45rem; place-items: center; border-radius: 50%; background: #f2e8df; color: #9b6040; font-size: .36rem; font-style: normal; }
.builder-scenario-global-head { height: 12rem; padding: 1.35rem 1.6rem; background: linear-gradient(125deg,#302660,#7668b4); color: #fff; }
.builder-scenario-global-head > div { display: flex; align-items: center; justify-content: space-between; }
.builder-scenario-global-head > div span { font-size: .5rem; font-weight: 700; }
.builder-scenario-global-head > div span i { margin-right: .3rem; }
.builder-scenario-global-head > div em { color: rgba(255,255,255,.65); font-size: .4rem; font-style: normal; }
.builder-scenario-global-head > strong { display: block; margin: 1.1rem 0 .45rem; font-size: 1.3rem; line-height: 1.2; }
.builder-scenario-global-head > p { margin: 0; color: rgba(255,255,255,.65); font-size: .44rem; }
.builder-scenario-global-head > b { display: inline-block; margin-top: .7rem; padding-bottom: .2rem; border-bottom: 1px solid rgba(255,255,255,.55); font-size: .42rem; }
.builder-scenario-global-map { position: relative; display: grid; height: 6.8rem; grid-template-columns: repeat(3,1fr); align-items: end; gap: .5rem; padding: .75rem 1rem; background: radial-gradient(ellipse at 50% 15%,#eef0ff,transparent 68%); }
.builder-scenario-global-map > i { position: absolute; width: .45rem; height: .45rem; border-radius: 50%; background: #7668b4; box-shadow: 0 0 0 .22rem rgba(118,104,180,.15); }
.builder-scenario-global-map .node-1 { top: 28%; left: 18%; }
.builder-scenario-global-map .node-2 { top: 15%; left: 47%; }
.builder-scenario-global-map .node-3 { top: 35%; right: 22%; }
.builder-scenario-global-map .node-4 { top: 48%; right: 44%; }
.builder-scenario-global-map span { display: flex; align-items: baseline; justify-content: center; gap: .25rem; color: #7d8796; font-size: .36rem; }
.builder-scenario-global-map b { color: #433875; font-size: .72rem; }
.builder-scenario-hero { display: flex; height: 11.5rem; flex-direction: column; align-items: flex-start; padding: 2rem; background: linear-gradient(125deg,#183662,#4d83df); color: #fff; }
.builder-scenario-tone-2 .builder-scenario-hero { background: linear-gradient(125deg,#5c4131,#d98b58); }
.builder-scenario-tone-3 .builder-scenario-hero { background: linear-gradient(125deg,#236b70,#61b7a2); }
.builder-scenario-tone-4 .builder-scenario-hero { background: linear-gradient(125deg,#44396f,#8278c8); }
.builder-scenario-hero small { font-size: .48rem; letter-spacing: .16em; }
.builder-scenario-hero strong { margin: .75rem 0 .5rem; font-size: 1.35rem; line-height: 1.25; }
.builder-scenario-hero em { color: rgba(255,255,255,.72); font-size: .5rem; font-style: normal; }
.builder-scenario-site-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .65rem; padding: 1rem; }
.builder-scenario-site-grid span { display: flex; height: 4.5rem; flex-direction: column; align-items: center; justify-content: center; gap: .45rem; border-radius: .5rem; background: #f3f6fb; color: #56647a; font-size: .5rem; }
.builder-scenario-site-grid i { color: var(--builder-blue); font-size: 1rem; }
.builder-scenario-float { position: absolute; right: 4%; bottom: 8%; z-index: 3; display: flex; width: 13rem; align-items: center; gap: .75rem; padding: 1rem; border-radius: .875rem; background: rgba(17,26,45,.96); color: #fff; box-shadow: 0 1.5rem 3rem rgba(20,35,61,.24); }
.builder-scenario-float > i { display: grid; width: 2.75rem; height: 2.75rem; flex: 0 0 auto; place-items: center; border-radius: .625rem; background: color-mix(in srgb,var(--builder-blue) 18%,transparent); color: var(--builder-blue); }
.builder-scenario-float span { display: flex; min-width: 0; flex-direction: column; }
.builder-scenario-float b { font-size: .78rem; }
.builder-scenario-float small { margin-top: .2rem; color: #9eabba; font-size: .54rem; }
.builder-scenario-panel > img { display: block; width: calc(100% - 1rem); height: calc(100% - 2rem); min-height: 33rem; align-self: center; margin: 1rem 1rem 1rem 0; border-radius: 1rem; object-fit: cover; }
.builder-service { background: #fff; }
.service-shell { padding: 4.188rem; border-radius: 1.5rem; background: linear-gradient(130deg, #eef4ff, #f8fbff); }
.builder-custom-content { padding-top: 0; background: var(--builder-custom-content-background); }
.builder-richtext { color: #46556c; line-height: 1.9; }
.builder-richtext img { max-width: 100%; height: auto; }
.builder-richtext table { width: 100% !important; }
.builder-final-cta { position: relative; padding: 5.625rem 0; overflow: hidden; background: linear-gradient(120deg, var(--builder-cta-a), var(--builder-cta-b) 55%, var(--builder-cta-c)); color: #fff; text-align: center; }
.builder-final-grid { opacity: .18; -webkit-mask-image: none; mask-image: none; }
.builder-final-cta span { font-size: .72rem; font-weight: 700; letter-spacing: .17em; opacity: .72; }
.builder-final-cta h2 { margin: 0.875rem 0 0.75rem; font-size: clamp(2rem, 4vw, 3.25rem); font-weight: 730; letter-spacing: -.04em; }
.builder-final-cta p { margin-bottom: 1.688rem; opacity: .82; }
.builder-final-cta .btn { padding: 0.812rem 1.688rem; border-radius: 0.5rem; background: #fff; color: #1d61df; font-weight: 700; box-shadow: 0 0.875rem 1.875rem rgba(10,48,120,.2); }
.builder-final-cta .btn:hover { transform: translateY(-0.125rem); color: var(--builder-blue-dark); }
.builder-final-cta .btn i { margin-left: 0.438rem; }
.builder-reveal { opacity: 0; transform: translateY(1.5rem); transition: opacity .65s ease, transform .65s ease; }
.builder-reveal.is-visible { opacity: 1; transform: none; }
.builder-functions { padding-top: 6.25rem; background: var(--builder-functions-background); color: var(--builder-ink); }
.builder-function-list { display: flex; flex-direction: column; gap: 7rem; }
.builder-function-row { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.15fr); align-items: center; gap: 6rem; min-height: 35rem; }
.builder-function-row.is-reverse { grid-template-columns: minmax(0,1.15fr) minmax(0,.9fr); }
.builder-function-row.is-reverse .builder-function-copy { order: 2; }
.builder-function-copy { min-width: 0; padding: 3rem 1.5rem; }
.builder-function-copy small { display: block; color: var(--builder-blue); font-size: .8rem; font-weight: 600; letter-spacing: .12em; }
.builder-function-copy h3 { max-width: 29rem; margin: 1.45rem 0 1.7rem; font-size: clamp(1.8rem,2.65vw,2.65rem); font-weight: 730; line-height: 1.3; letter-spacing: -.025em; }
.builder-function-copy p { position: relative; max-width: 34rem; margin: 0; padding-left: 1.75rem; color: #6b7484; font-size: 1.05rem; line-height: 1.9; }
.builder-function-copy p:before { content: ""; position: absolute; top: .78rem; left: 0; width: .48rem; height: .48rem; border-radius: 50%; background: var(--builder-blue); }
.builder-function-details { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; margin: 2rem 0 0; padding: 0; list-style: none; }
.builder-function-details li { display: flex; min-width: 0; min-height: 4.75rem; align-items: center; gap: .75rem; padding: .8rem; border: 1px solid #dfe4ec; border-radius: .85rem; background: rgba(255,255,255,.76); transition: border-color .22s ease,background-color .22s ease,transform .22s ease,box-shadow .22s ease; }
.builder-function-details li:hover { border-color: color-mix(in srgb,var(--builder-blue) 38%,#dfe4ec); background: #fff; transform: translateY(-.125rem); box-shadow: 0 .65rem 1.5rem rgba(var(--builder-blue-rgb), .07); }
.builder-function-details>li>i { display: grid; width: 2.25rem; height: 2.25rem; flex: 0 0 2.25rem; place-items: center; border-radius: .65rem; background: color-mix(in srgb,var(--builder-blue) 12%,#fff); color: var(--builder-blue); font-size: 1rem; }
.builder-function-details span { display: flex; min-width: 0; flex-direction: column; }
.builder-function-details b { color: #222936; font-size: .84rem; font-weight: 650; line-height: 1.35; }
.builder-function-details em { margin-top: .2rem; color: #858d99; font-size: .7rem; font-style: normal; line-height: 1.45; }
.builder-function-visual,.builder-function-media { position: relative; display: grid; min-height: 35rem; place-items: center; border-radius: 1.75rem; background: #e4edff; overflow: hidden; }
.builder-function-media img { width: 100%; height: 100%; object-fit: cover; }
.function-tone-2 .builder-function-visual,.function-tone-2 .builder-function-media { background: #e5f3fb; }
.function-tone-3 .builder-function-visual,.function-tone-3 .builder-function-media { background: #e9ecff; }
.function-tone-4 .builder-function-visual,.function-tone-4 .builder-function-media { background: #e6f1ff; }
.function-tone-5 .builder-function-visual,.function-tone-5 .builder-function-media { background: #e7eefc; }
.function-tone-6 .builder-function-visual,.function-tone-6 .builder-function-media { background: #e2f1f6; }
.function-browser-demo { position: relative; width: 76%; height: 66%; border: .15rem solid #182238; border-radius: 1rem; background: #fff; box-shadow: 0 2rem 3.5rem rgba(var(--builder-shadow-rgb), .16); overflow: hidden; }
.function-demo-bar { display: flex; height: 3rem; align-items: center; gap: .55rem; padding: 0 1rem; border-bottom: .15rem solid #182238; background: #dfe5ed; }
.function-demo-bar i { width: .55rem; height: .55rem; border: .1rem solid #182238; border-radius: 50%; background: #fff; }
.function-demo-bar span { width: 42%; height: .55rem; margin-left: auto; border-radius: 1rem; background: #b9c4d3; }
.function-demo-body { display: grid; height: calc(100% - 3rem); grid-template-columns: 3.4rem 1fr; }
.function-demo-body aside { display: flex; flex-direction: column; gap: .9rem; padding: 1rem .75rem; background: #eef3fb; }
.function-demo-body aside i { height: 2rem; border-radius: .35rem; background: #cbd8ec; }
.function-demo-body aside i:first-child { background: var(--builder-blue); }
.function-demo-body main { position: relative; padding: 2rem; }
.function-demo-body main b { display: block; width: 42%; height: .55rem; background: #1c2940; }
.function-demo-body main strong { display: block; width: 76%; height: 4.75rem; margin: 1.5rem 0; background: linear-gradient(120deg,var(--builder-blue),#40bfe6); }
.function-demo-body main em { display: block; width: 54%; height: .45rem; background: #c4ceda; }
.function-demo-body main span { display: inline-block; width: 42%; height: 4.75rem; margin: 1.15rem .65rem 0 0; background: #e1e7ef; }
.function-demo-body main span:last-child { background: #cfe0ff; }
.function-demo-float { position: absolute; right: 5%; bottom: 10%; display: flex; min-width: 12.5rem; align-items: center; gap: .85rem; padding: 1.15rem 1.25rem; background: #111a2d; color: #fff; box-shadow: 0 1.25rem 2.5rem rgba(17,31,58,.2); }
.function-demo-float>i { display: grid; width: 2.7rem; height: 2.7rem; place-items: center; background: var(--builder-blue); font-size: 1.15rem; }
.function-demo-float span { color: #9eabc0; font-size: .68rem; }
.function-demo-float b { display: block; margin-bottom: .18rem; color: #fff; font-size: .82rem; }
.builder-function-visual { isolation: isolate; background: linear-gradient(145deg,#e7efff,#dce8ff); }
.builder-function-visual:before,.builder-function-visual:after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.builder-function-visual:before { width: 25rem; height: 25rem; right: -10rem; top: -13rem; border: 1px solid rgba(var(--builder-blue-rgb), .12); }
.builder-function-visual:after { width: 17rem; height: 17rem; left: -8rem; bottom: -9rem; background: rgba(255,255,255,.35); }
.function-tone-2 .builder-function-visual { background: linear-gradient(145deg,#e8f2ff,#dcecff); }
.function-tone-3 .builder-function-visual { background: linear-gradient(145deg,#e9edff,#dfe5ff); }
.function-tone-4 .builder-function-visual { background: linear-gradient(145deg,#e5f0ff,#d9e8ff); }
.function-tone-5 .builder-function-visual { background: linear-gradient(145deg,#e8eeff,#dee7ff); }
.function-tone-6 .builder-function-visual { background: linear-gradient(145deg,#e5f2fa,#d9eaf6); }
.function-ui-window { position: relative; z-index: 2; border: .13rem solid #172238; border-radius: 1rem; background: #fff; box-shadow: 0 2rem 3.5rem rgba(var(--builder-shadow-rgb), .16); overflow: hidden; }
.function-window-bar { display: flex; height: 2.65rem; align-items: center; gap: .5rem; padding: 0 .9rem; border-bottom: .13rem solid #172238; background: #e5eaf2; }
.function-window-bar>i { width: .52rem; height: .52rem; border: .08rem solid #172238; border-radius: 50%; background: #fff; }
.function-window-bar>span { min-width: 42%; margin-left: auto; padding: .35rem 1rem; border-radius: 1rem; background: #f7f9fc; color: #8b98aa; font-size: .52rem; text-align: center; }
.function-editor-window { width: 80%; height: 68%; }
.function-editor-body { display: grid; height: calc(100% - 2.65rem); grid-template-columns: 3rem 1fr 7.5rem; }
.function-editor-tools { display: flex; flex-direction: column; align-items: center; gap: .8rem; padding: 1rem .45rem; background: #f0f4fb; }
.function-editor-tools i { display: grid; width: 1.75rem; height: 1.75rem; place-items: center; border-radius: .28rem; color: #73839b; font-size: .72rem; }
.function-editor-tools i:first-child { background: var(--builder-blue); color: #fff; }
.function-editor-body main { position: relative; padding: 1.5rem; background: #fff; }
.function-canvas-nav { display: flex; align-items: center; gap: .75rem; }
.function-canvas-nav b { margin-right: auto; color: #1b2840; font-size: .62rem; letter-spacing: .12em; }
.function-canvas-nav span { width: 2rem; height: .25rem; border-radius: 1rem; background: #cbd5e4; }
.function-selected-block { position: relative; width: 88%; margin: 2rem auto 1rem; padding: 1.2rem; border: .12rem solid var(--builder-blue); background: #f8faff; }
.function-selected-block small,.function-selected-block strong { display: block; }
.function-selected-block small { color: var(--builder-blue); font-size: .42rem; letter-spacing: .14em; }
.function-selected-block strong { margin-top: .65rem; color: #172238; font-size: 1.05rem; line-height: 1.25; }
.function-selected-block>i { position: absolute; width: .4rem; height: .4rem; border: .08rem solid var(--builder-blue); background: #fff; }
.function-selected-block>i:nth-of-type(1) { left: -.25rem; top: -.25rem; }
.function-selected-block>i:nth-of-type(2) { right: -.25rem; top: -.25rem; }
.function-selected-block>i:nth-of-type(3) { left: -.25rem; bottom: -.25rem; }
.function-selected-block>i:nth-of-type(4) { right: -.25rem; bottom: -.25rem; }
.function-canvas-cards { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; width: 88%; margin: auto; }
.function-canvas-cards span { height: 3.5rem; background: #e3e9f1; }
.function-canvas-cards span:last-child { background: #cfe0ff; }
.function-editor-panel { display: flex; flex-direction: column; padding: 1rem .7rem; border-left: 1px solid #d8e0eb; background: #f7f9fc; }
.function-editor-panel b { font-size: .62rem; }
.function-editor-panel small { margin-top: .9rem; color: #77859a; font-size: .48rem; }
.function-editor-panel>span { height: .3rem; margin-top: .45rem; background: #d9e0ea; }
.function-editor-panel>i { width: 1.4rem; height: 1.4rem; margin-top: .4rem; border-radius: .25rem; background: var(--builder-blue); }
.function-editor-panel>em { height: .35rem; margin-top: .45rem; background: linear-gradient(90deg,var(--builder-blue) 65%,#dbe2ec 65%); }
.function-cursor { position: absolute; z-index: 4; right: 25%; bottom: 17%; display: flex; align-items: center; gap: .4rem; padding: .45rem .65rem; border-radius: .35rem; background: var(--builder-blue); color: #fff; box-shadow: 0 .75rem 1.5rem rgba(var(--builder-blue-rgb), .25); font-size: .58rem; }
.function-cursor>i { font-size: .8rem; }
.function-status-card,.function-responsive-card,.function-publish-card,.function-lead-card,.function-live-card { position: absolute; z-index: 3; display: flex; align-items: center; gap: .75rem; padding: .85rem 1rem; background: #111a2d; color: #fff; box-shadow: 0 1.25rem 2.5rem rgba(17,31,58,.2); }
.function-status-card { left: 5%; bottom: 9%; }
.function-responsive-card { right: 4%; bottom: 8%; }
.function-publish-card { right: 4%; bottom: 9%; }
.function-lead-card { left: 4%; bottom: 9%; }
.function-live-card { right: 4%; bottom: 9%; }
.function-status-card>i,.function-responsive-card>i,.function-publish-card>i,.function-lead-card>i,.function-live-card>i { display: grid; width: 2.45rem; height: 2.45rem; flex: 0 0 auto; place-items: center; background: var(--builder-blue); font-size: 1rem; }
.function-status-card span,.function-responsive-card span,.function-publish-card span,.function-lead-card span,.function-live-card span { display: flex; flex-direction: column; }
.function-status-card b,.function-responsive-card b,.function-publish-card b,.function-lead-card b,.function-live-card b { font-size: .72rem; }
.function-status-card small,.function-responsive-card small,.function-publish-card small,.function-lead-card small { margin-top: .18rem; color: #a7b3c6; font-size: .56rem; }
.function-device-desktop { position: absolute; z-index: 1; left: 8%; top: 14%; width: 72%; height: 62%; border: .15rem solid #172238; border-radius: .8rem; background: #fff; box-shadow: 0 1.75rem 3.5rem rgba(39,73,129,.14); overflow: hidden; }
.function-device-bar { display: flex; height: 2rem; align-items: center; gap: .4rem; padding: 0 .7rem; background: #dfe7f3; }
.function-device-bar i { width: .42rem; height: .42rem; border-radius: 50%; background: #8798af; }
.function-device-page { padding: 1.25rem; }
.function-device-page>b,.function-device-page>strong { display: block; }
.function-device-page>b { color: #172238; font-size: .52rem; letter-spacing: .16em; }
.function-device-page>strong { width: 55%; margin: 1.2rem 0 .7rem; color: #172238; font-size: 1.2rem; line-height: 1.25; }
.function-device-page>span { display: block; width: 30%; height: .3rem; background: var(--builder-blue); }
.function-device-page>div { display: grid; grid-template-columns: 1.1fr .9fr; gap: .7rem; margin-top: 1.2rem; }
.function-device-page>div i { height: 4.5rem; background: #e1e8f2; }
.function-device-page>div i:last-child { background: #c9dcff; }
.function-device-tablet { position: absolute; z-index: 2; right: 8%; top: 23%; width: 12.5rem; height: 17rem; padding: .55rem; border: .15rem solid #172238; border-radius: 1rem; background: #172238; box-shadow: 0 1.5rem 3rem rgba(22,49,91,.2); }
.function-device-tablet>div { height: 100%; padding: 1.1rem; border-radius: .55rem; background: #fff; }
.function-device-tablet b,.function-device-tablet strong,.function-device-tablet span { display: block; }
.function-device-tablet b { font-size: .48rem; letter-spacing: .14em; }
.function-device-tablet strong { margin: 2.2rem 0 .8rem; font-size: 1rem; line-height: 1.25; }
.function-device-tablet span { width: 60%; height: 4.5rem; background: linear-gradient(135deg,var(--builder-blue),#46bde9); }
.function-device-phone { position: absolute; z-index: 3; right: 3%; bottom: 7%; width: 6.6rem; height: 12.5rem; padding: .42rem; border: .14rem solid #172238; border-radius: 1.15rem; background: #172238; box-shadow: 0 1.5rem 3rem rgba(22,49,91,.24); }
.function-device-phone>div { height: 100%; padding: .7rem; border-radius: .72rem; background: #f9fbff; }
.function-device-phone b,.function-device-phone strong,.function-device-phone span { display: block; }
.function-device-phone b { color: var(--builder-blue); font-size: .55rem; }
.function-device-phone strong { margin: 1.3rem 0 .55rem; font-size: .78rem; line-height: 1.2; }
.function-device-phone span { height: 2.8rem; background: linear-gradient(135deg,var(--builder-blue),#42bde7); }
.function-device-phone i { display: inline-block; width: 42%; height: 2rem; margin: .45rem .2rem 0 0; background: #dce6f5; }
.function-content-window { width: 82%; height: 70%; }
.function-content-body { display: grid; height: calc(100% - 2.65rem); grid-template-columns: 7rem 1fr; }
.function-content-body>aside { display: flex; flex-direction: column; gap: .35rem; padding: 1rem .7rem; background: #172238; color: #abb8cc; }
.function-content-body>aside>b { display: grid; width: 2rem; height: 2rem; margin-bottom: 1rem; place-items: center; background: var(--builder-blue); color: #fff; }
.function-content-body>aside>span { display: flex; align-items: center; gap: .5rem; padding: .55rem; border-radius: .3rem; font-size: .56rem; }
.function-content-body>aside>span.active { background: var(--builder-blue); color: #fff; }
.function-content-body>main { padding: 1.2rem; }
.function-content-head { display: flex; align-items: center; justify-content: space-between; }
.function-content-head div { display: flex; flex-direction: column; }
.function-content-head small { color: #8895a7; font-size: .48rem; }
.function-content-head b { font-size: .85rem; }
.function-content-head em { padding: .48rem .7rem; border-radius: .25rem; background: var(--builder-blue); color: #fff; font-size: .5rem; font-style: normal; }
.function-content-tabs { display: flex; gap: 1rem; margin: 1rem 0; border-bottom: 1px solid #dce3ed; }
.function-content-tabs span { padding-bottom: .55rem; color: #7a8799; font-size: .5rem; }
.function-content-tabs span.active { border-bottom: .12rem solid var(--builder-blue); color: var(--builder-blue); }
.function-content-list { display: flex; flex-direction: column; }
.function-content-list>span { display: grid; grid-template-columns: 2.5rem 1fr 4rem 3.4rem; align-items: center; gap: .55rem; padding: .6rem 0; border-bottom: 1px solid #e6ebf2; }
.function-content-list i { width: 2.5rem; height: 1.8rem; background: linear-gradient(135deg,#d8e4fa,#b8d0ff); }
.function-content-list b { font-size: .56rem; }
.function-content-list small { color: #8491a3; font-size: .47rem; }
.function-content-list em { padding: .25rem; border-radius: 1rem; background: #e3f4e9; color: #20a455; font-size: .45rem; font-style: normal; text-align: center; }
.function-content-list em.draft { background: #f0f2f6; color: #7d8999; }
.function-seo-window { width: 80%; height: 70%; }
.function-seo-body { display: grid; height: calc(100% - 2.65rem); grid-template-columns: 1fr .9fr; gap: 1.25rem; padding: 1.35rem; }
.function-seo-form { display: flex; flex-direction: column; }
.function-seo-form label { display: flex; justify-content: space-between; margin: .55rem 0 .35rem; color: #29364a; font-size: .52rem; }
.function-seo-form label:first-child { margin-top: 0; }
.function-seo-form label small { color: #95a1b1; }
.function-seo-form>span,.function-seo-form>em { padding: .6rem; border: 1px solid #d4dce8; border-radius: .28rem; color: #5e6c80; font-size: .5rem; font-style: normal; }
.function-seo-form>div { display: flex; gap: .3rem; }
.function-seo-form>div i { padding: .4rem; border-radius: .2rem; background: #e7efff; color: var(--builder-blue); font-size: .45rem; font-style: normal; }
.function-search-preview { align-self: center; padding: 1rem; border: 1px solid #dce3ed; border-radius: .4rem; background: #f8faff; }
.function-search-preview small,.function-search-preview span,.function-search-preview b { display: block; }
.function-search-preview small { margin-bottom: 1rem; color: #8996a8; font-size: .48rem; }
.function-search-preview span { color: #16813b; font-size: .46rem; }
.function-search-preview b { margin: .45rem 0; color: #2456b6; font-size: .73rem; line-height: 1.3; }
.function-search-preview p { margin: 0; color: #667489; font-size: .48rem; line-height: 1.55; }
.function-seo-score { position: absolute; z-index: 3; right: 4%; bottom: 8%; display: flex; align-items: center; gap: .75rem; padding: .9rem 1rem; background: #111a2d; color: #fff; box-shadow: 0 1.25rem 2.5rem rgba(17,31,58,.2); }
.function-seo-score>strong { display: grid; width: 2.8rem; height: 2.8rem; place-items: center; border: .3rem solid var(--builder-blue); border-radius: 50%; font-size: .82rem; }
.function-seo-score span { display: flex; flex-direction: column; }
.function-seo-score b { font-size: .68rem; }
.function-seo-score small { margin-top: .2rem; color: #aab5c7; font-size: .52rem; }
.function-lead-site { position: relative; z-index: 2; display: grid; width: 80%; height: 70%; grid-template-columns: 1fr .9fr; background: #fff; box-shadow: 0 2rem 3.5rem rgba(var(--builder-shadow-rgb), .16); overflow: hidden; }
.function-lead-copy { padding: 2.4rem; background: linear-gradient(145deg,#172238,#264a8e); color: #fff; }
.function-lead-copy small,.function-lead-copy strong { display: block; }
.function-lead-copy small { color: #82adff; font-size: .5rem; letter-spacing: .14em; }
.function-lead-copy strong { margin: 1.2rem 0 .7rem; font-size: 1.35rem; line-height: 1.3; }
.function-lead-copy p { color: #b9c7dd; font-size: .58rem; line-height: 1.6; }
.function-lead-copy>span { display: inline-block; width: 42%; height: 4rem; margin: .9rem .45rem 0 0; background: rgba(255,255,255,.12); }
.function-lead-form { display: flex; flex-direction: column; padding: 1.7rem; }
.function-lead-form label { margin: .55rem 0 .3rem; color: #78869a; font-size: .48rem; }
.function-lead-form>span,.function-lead-form>em { padding: .55rem; border: 1px solid #d5dde8; border-radius: .25rem; color: #45546a; font-size: .5rem; font-style: normal; }
.function-lead-form>b { margin-top: 1rem; padding: .65rem; border-radius: .25rem; background: var(--builder-blue); color: #fff; font-size: .55rem; text-align: center; }
.function-lead-card span { display: grid; grid-template-columns: 1fr auto; column-gap: .75rem; }
.function-lead-card span small { grid-column: 1/-1; }
.function-lead-card span b { margin-top: .18rem; }
.function-lead-card span em { align-self: end; color: #7fa6f5; font-size: .48rem; font-style: normal; }
.function-lead-count { position: absolute; z-index: 3; right: 5%; top: 9%; width: 7.5rem; padding: .9rem; background: #fff; box-shadow: 0 1rem 2.5rem rgba(30,66,122,.16); }
.function-lead-count small,.function-lead-count strong,.function-lead-count span { display: block; }
.function-lead-count small { color: #8290a3; font-size: .5rem; }
.function-lead-count strong { margin: .25rem 0; color: #172238; font-size: 1.7rem; }
.function-lead-count span { color: #268c52; font-size: .48rem; }
.function-lead-count span i { display: inline-block; width: .35rem; height: .35rem; border-radius: 50%; background: #27bd66; }
.function-analytics-window { width: 84%; height: 72%; }
.function-analytics-body { display: grid; height: calc(100% - 2.65rem); grid-template-columns: 1.5fr .65fr; grid-template-rows: auto 1fr; gap: .75rem; padding: 1rem; background: #f7f9fc; }
.function-metric-row { grid-column: 1/-1; display: grid; grid-template-columns: repeat(3,1fr); gap: .65rem; }
.function-metric-row>span { padding: .7rem; background: #fff; }
.function-metric-row small,.function-metric-row b,.function-metric-row em { display: block; }
.function-metric-row small { color: #8491a3; font-size: .46rem; }
.function-metric-row b { margin: .25rem 0; color: #172238; font-size: .9rem; }
.function-metric-row em { color: #23a15a; font-size: .44rem; font-style: normal; }
.function-chart-card,.function-source-card { padding: .85rem; background: #fff; }
.function-chart-card>div:first-child { display: flex; align-items: center; justify-content: space-between; }
.function-chart-card small { color: #8491a3; font-size: .48rem; }
.function-chart-card b { font-size: .5rem; }
.function-chart-card svg { display: block; width: 100%; height: 7rem; margin-top: .4rem; }
.function-chart-card>div:last-child { display: flex; justify-content: space-between; }
.function-chart-card>div:last-child i { width: .3rem; height: .3rem; border-radius: 50%; background: #cbd5e4; }
.function-source-card>small { color: #8491a3; font-size: .48rem; }
.function-source-card>span { display: grid; grid-template-columns: .45rem 1fr auto; align-items: center; gap: .4rem; margin-top: .9rem; }
.function-source-card>span i { width: .45rem; height: .45rem; border-radius: 50%; background: var(--builder-blue); }
.function-source-card>span:nth-child(3) i { background: #4fc4d8; }
.function-source-card>span:nth-child(4) i { background: #96a9c8; }
.function-source-card b,.function-source-card em { font-size: .48rem; }
.function-source-card em { color: #7d8b9e; font-style: normal; }
.function-live-card span { display: grid; grid-template-columns: auto auto; align-items: center; gap: .75rem; }
.function-live-card span b { color: #aab5c7; }
.function-live-card span strong { font-size: 1.1rem; }
.builder-subnav-brand { display: flex; align-items: center; gap: 0.75rem; overflow: hidden; padding-right: 1.25rem; border-right: 1px solid #dde4ef; color: #172033; font-size: 1.05rem; font-weight: 800; letter-spacing: -0.015em; line-height: 1.2; white-space: nowrap; flex: 0 0 auto; }
.builder-subnav-links, .builder-product-nav-docked .builder-subnav-links { justify-content: flex-start; margin-right: 0; }
.builder-subnav-links { display: flex; align-self: stretch; gap: 1.65rem; margin-left: 1.25rem; min-width: 0; flex: 1 1 auto; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
.builder-subnav-links::-webkit-scrollbar { display: none; }
.builder-subnav-cta, .builder-product-nav-docked .builder-subnav-cta { margin-left: auto; }
.builder-section { padding: 7.5rem 0; }
.builder-section-head { text-align: center; max-width: none; margin: 0 auto 3.75rem; }
.builder-section-head.text-start { max-width: none; margin-left: 0; }
.builder-section-head>span { display: inline-flex; align-items: center; gap: .75rem; color: var(--builder-blue); font-size: .75rem; font-weight: 700; letter-spacing: .16em; }
.builder-section-head>span:before { content: ""; width: 2rem; height: .125rem; flex: 0 0 2rem; background: currentColor; }
.builder-section-head h2 { margin: 1.25rem 0 1rem; font-size: clamp(2rem,3.5vw,3.25rem); font-weight: 650; line-height: 1.2; letter-spacing: -.035em; }
.builder-section-head p { margin: 0; color: var(--builder-muted); font-size: 1rem; line-height: 1.8; }
/*区块标题、描述桌面端单行展示（首屏 hero 除外）；小屏由 767.98px 断点恢复换行*/
.builder-section-head h2, .builder-section-head p { white-space: nowrap; }
.capability-card { position: relative; min-height: 22.5rem; height: 100%; overflow: hidden; border: 0; border-radius: 1.125rem; background: #fff; transition: transform .25s ease, box-shadow .25s ease; padding: 2rem; box-shadow: 0 1rem 2.25rem rgba(31,54,88,.07); }
.capability-icon { display: flex; width: 3rem; height: 3rem; align-items: center; justify-content: center; border-radius: 0.812rem; background: #edf3ff; color: var(--builder-blue); font-size: 1.25rem; margin-bottom: 2rem; }
.capability-card h3 { margin: 0 0 1rem; font-size: 1.3rem; font-weight: 700; line-height: 1.4; }
.capability-card p { max-width: 27.5rem; margin: 0; color: var(--builder-muted); font-size: .95rem; line-height: 1.8; }
.builder-functions .builder-function-heading>span { color: var(--builder-blue); font-weight: 700; letter-spacing: .16em; }
.builder-function-heading { margin-bottom: 4.75rem; max-width: 47rem; margin: 0 auto 3.75rem; text-align: center; }
.builder-function-heading p { max-width: 42rem; margin: 0 auto; color: var(--builder-muted); font-size: 1rem; line-height: 1.8; }
.tncms-builder .site-capability-card, .tncms-builder .mini-capability-card { --cap-color: var(--builder-blue); --cap-soft: #edf4ff; --cap-shadow: rgba(41,109,238,.18); cursor: pointer; border: 1px solid #d8dee8; border-color: color-mix(in srgb,var(--cap-color) 28%,#d8dee8); outline: none; background: linear-gradient(150deg,#fff,var(--cap-soft)); box-shadow: 0 .75rem 2rem rgba(33,48,74,.075),inset 0 0 0 1px rgba(255,255,255,.56); transition: transform .28s ease,box-shadow .28s ease,border-color .28s ease,background .28s ease; }
.tncms-builder .site-capability-card::before, .tncms-builder .mini-capability-card::before { content: ""; position: absolute; top: 0; right: 0; left: 0; height: .24rem; background: var(--cap-color); opacity: 0; transform: scaleX(.32); transition: opacity .25s ease,transform .3s ease; }
.tncms-builder .site-capability-card::after, .tncms-builder .mini-capability-card::after { content: ""; position: absolute; top: -4.5rem; right: -4.5rem; width: 9rem; height: 9rem; border: 1.4rem solid var(--cap-color); border-radius: 50%; opacity: .035; transition: opacity .25s ease,transform .35s ease; }
.site-capability-index, .mini-capability-index { position: absolute; z-index: 1; top: 1.8rem; right: 1.75rem; color: var(--cap-color); font-size: .7rem; font-weight: 800; letter-spacing: .12em; opacity: .5; transition: opacity .25s ease; }
.tncms-builder .site-capability-card .capability-icon, .tncms-builder .mini-capability-card .capability-icon { position: relative; z-index: 1; background: var(--cap-soft); color: var(--cap-color); transition: color .25s ease,background .25s ease,transform .25s ease; }
.tncms-builder .site-capability-card h3, .tncms-builder .site-capability-card p, .tncms-builder .mini-capability-card h3, .tncms-builder .mini-capability-card p { position: relative; z-index: 1; }
.tncms-builder .site-capability-card .capability-tags, .tncms-builder .mini-capability-card .capability-tags { z-index: 1; }
.tncms-builder .site-capability-card .capability-tags span, .tncms-builder .mini-capability-card .capability-tags span { border-color: color-mix(in srgb,var(--cap-color) 20%,#dfe7f2); background: var(--cap-soft); color: var(--cap-color); transition: background .25s ease,color .25s ease,border-color .25s ease; }
.site-capability-state, .mini-capability-state { position: absolute; z-index: 2; top: 1.65rem; right: 1.45rem; display: flex; align-items: center; gap: .25rem; padding: .35rem .55rem; border-radius: 2rem; background: var(--cap-color); color: #fff; font-size: .57rem; font-style: normal; font-weight: 700; opacity: 0; transform: translateY(-.35rem); transition: opacity .25s ease,transform .25s ease; }
.tncms-builder .site-capability-card:hover, .tncms-builder .site-capability-card:focus-visible, .tncms-builder .site-capability-card.is-selected, .tncms-builder .mini-capability-card:hover, .tncms-builder .mini-capability-card:focus-visible, .tncms-builder .mini-capability-card.is-selected { border-color: var(--cap-color); border-color: color-mix(in srgb,var(--cap-color) 58%,white); background: linear-gradient(150deg,#fff 15%,var(--cap-soft)); box-shadow: 0 1.35rem 3rem var(--cap-shadow),inset 0 0 0 1px rgba(255,255,255,.48); transform: translateY(-.55rem); }
.tncms-builder .site-capability-card:hover::before, .tncms-builder .site-capability-card:focus-visible::before, .tncms-builder .site-capability-card.is-selected::before, .tncms-builder .mini-capability-card:hover::before, .tncms-builder .mini-capability-card:focus-visible::before, .tncms-builder .mini-capability-card.is-selected::before { opacity: 1; transform: scaleX(1); }
.tncms-builder .site-capability-card:hover::after, .tncms-builder .site-capability-card:focus-visible::after, .tncms-builder .site-capability-card.is-selected::after, .tncms-builder .mini-capability-card:hover::after, .tncms-builder .mini-capability-card:focus-visible::after, .tncms-builder .mini-capability-card.is-selected::after { opacity: .07; transform: scale(1.08); }
.tncms-builder .site-capability-card.is-selected .capability-icon, .tncms-builder .mini-capability-card.is-selected .capability-icon { background: var(--cap-color); color: #fff; transform: rotate(-4deg) scale(1.04); }
.tncms-builder .site-capability-card.is-selected .capability-tags span, .tncms-builder .mini-capability-card.is-selected .capability-tags span { border-color: transparent; background: var(--cap-color); color: #fff; }
.site-capability-card.is-selected .site-capability-index, .mini-capability-card.is-selected .mini-capability-index { opacity: 0; }
.site-capability-card.is-selected .site-capability-state, .mini-capability-card.is-selected .mini-capability-state { opacity: 1; transform: none; }
.builder-scenario-tabs { counter-reset: builder-scenario-tab; display: flex; flex-direction: column; align-self: stretch; border-radius: 1.25rem; --scenario-tab-accent: var(--builder-blue); --scenario-tab-dark: #111a2d; gap: .75rem; padding: .875rem; background: linear-gradient(155deg,#f3f5f9,#e9edf4); }
.builder-scenario-tabs button { counter-increment: builder-scenario-tab; position: relative; display: grid; align-items: center; background: transparent; color: #626d7d; font-size: .9375rem; font-weight: 650; text-align: left; transition: color .24s ease,background-color .24s ease,border-color .24s ease,box-shadow .24s ease,transform .24s ease; min-height: 5.5rem; grid-template-columns: 2.75rem minmax(0,1fr); gap: 1rem; padding: 1rem 4.25rem 1rem 1rem; border: 1px solid transparent; border-radius: 1.125rem; box-shadow: none; }
.builder-scenario-tabs button::before { content: counter(builder-scenario-tab, decimal-leading-zero); display: grid; width: 2.75rem; height: 2.75rem; place-items: center; border: 1px solid #d5dce7; border-radius: .875rem; background: rgba(255,255,255,.78); color: #8b95a5; font-size: .6875rem; font-weight: 750; letter-spacing: .06em; transition: inherit; }
.builder-scenario-tabs button.active { border-color: var(--scenario-tab-dark); background: var(--scenario-tab-dark); color: #fff; box-shadow: 0 1rem 2.25rem rgba(20,35,61,.18); }
.builder-scenario-tabs button::after, .builder-scenario-tabs button.active::after { content: ""; position: absolute; top: 50%; right: 1.55rem; bottom: auto; left: auto; display: block; width: .9rem; height: .9rem; border: 0; border-top: 2px solid currentColor; border-right: 2px solid currentColor; border-radius: 0; background: transparent; color: #8490a2; opacity: .72; transform: translateY(-50%) rotate(45deg); transform-origin: center; transition: color .24s ease,opacity .24s ease,transform .24s ease; }
.builder-scenario-tabs button:hover::after { color: var(--scenario-tab-accent); opacity: 1; transform: translate(.22rem,-50%) rotate(45deg); }
.builder-scenario-tabs button.active::after { transform: translateY(-50%) rotate(45deg); color: var(--scenario-tab-accent); opacity: 1; }
.builder-templates { position: relative; overflow: hidden; background: radial-gradient(circle at 8% 18%, rgba(var(--builder-tpl-glow-a-rgb), var(--builder-tpl-glow-a-alpha)), transparent 26rem), radial-gradient(circle at 92% 78%, rgba(var(--builder-blue-rgb), .07), transparent 24rem), #f5f8fc; }
.mini-template-tabs { display: grid; width: 29rem; max-width: 100%; grid-template-columns: 1fr 1fr; margin: 0 auto 3.75rem; padding: .35rem; border: 1px solid rgba(134,158,189,.13); border-radius: 3rem; background: #e9eff8; }
.mini-template-tabs button { min-height: 3.4rem; border: 0; border-radius: 2.5rem; background: transparent; color: #5d6878; font-size: 1rem; font-weight: 650; transition: .25s ease; }
.mini-template-tabs button.active { background: #fff; color: var(--builder-tab-active); box-shadow: 0 .65rem 1.5rem rgba(51,91,155,.1); }
.mini-template-gallery { position: relative; }
.mini-template-panel[hidden] { display: none; }
.mini-template-arrow[hidden] { display: none; }
.mini-template-track { display: flex; gap: 1.5rem; justify-content: safe center; margin-top: -1rem; padding-top: 1rem; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: none; scroll-snap-type: x mandatory; }
.mini-template-track::-webkit-scrollbar { display: none; }
.mini-template-empty { margin: 0; padding: 3rem 0; width: 100%; color: #8a94a3; font-size: .85rem; text-align: center; }
.mini-template-arrow { position: absolute; z-index: 3; top: 45%; display: grid; width: 3.5rem; height: 3.5rem; place-items: center; border: 1px solid rgba(121,145,130,.24); border-radius: 1.1rem; background: linear-gradient(145deg,rgba(255,255,255,.98),rgba(244,249,246,.92)); color: #17231b; box-shadow: 0 1rem 2.5rem rgba(25,55,37,.13),inset 0 1px 0 rgba(255,255,255,.9); backdrop-filter: blur(1rem); transform: translateY(-50%); transition: border-color .24s ease,background .24s ease,color .24s ease,box-shadow .24s ease,transform .24s ease; }
.mini-template-arrow i { font-size: 1.15rem; line-height: 1; -webkit-text-stroke: .25px currentColor; transition: transform .24s ease; }
.mini-template-arrow:hover { border-color: #101a13; background: #101a13; color: #32dc5a; box-shadow: 0 1.15rem 2.75rem rgba(16,40,24,.22),inset 0 1px 0 rgba(255,255,255,.08); }
.mini-template-arrow.is-prev { left: -1.75rem; }
.mini-template-arrow.is-next { right: -1.75rem; }
.mini-template-arrow.is-prev:hover { transform: translate(-.18rem,-50%); }
.mini-template-arrow.is-next:hover { transform: translate(.18rem,-50%); }
.mini-template-arrow.is-prev:hover i { transform: translateX(-.08rem); }
.mini-template-arrow.is-next:hover i { transform: translateX(.08rem); }
.mini-template-arrow:active { transform: translateY(-50%) scale(.94); }
.mini-template-arrow.is-prev:active, .mini-template-arrow.is-next:active { transform: translateY(-50%) scale(.94); }
.mini-template-arrow:focus-visible { outline: .2rem solid rgba(24,200,67,.28); outline-offset: .2rem; }
.template-pc-browser-bar { position: absolute; z-index: 4; top: 0; right: 0; left: 0; display: flex; height: 2.125rem; align-items: center; gap: .375rem; padding: 0 .75rem; border-bottom: 1px solid #e6ebf2; border-radius: calc(.75rem - 1px) calc(.75rem - 1px) 0 0; background: linear-gradient(180deg,#fbfcff 0%,#f3f6fb 100%); color: #98a4b5; font-size: .625rem; letter-spacing: .04em; }
.template-pc-browser-bar i { width: .438rem; height: .438rem; flex: 0 0 auto; border-radius: 50%; background: #ff8b80; }
.template-pc-browser-bar i:nth-child(2) { background: #ffc86b; }
.template-pc-browser-bar i:nth-child(3) { background: #67d39e; }
.template-pc-browser-bar span { display: inline-flex; width: min(62%,12rem); height: 1.35rem; align-items: center; justify-content: center; margin: 0 auto; padding: 0 .8rem; overflow: hidden; border: 1px solid #e4e9f1; border-radius: 999px; background: #fff; text-overflow: ellipsis; white-space: nowrap; }
.template-card-badge-hot { background: linear-gradient(135deg,#ff563f,#f92f56); }
.template-card-pc .template-card-actions { position: absolute; z-index: 5; inset: auto .8rem .8rem; display: flex; min-height: 0; align-items: center; justify-content: center; gap: .6rem; padding: .45rem .55rem; border: 0; border-radius: 999px; background: rgba(255,255,255,.25); backdrop-filter: blur(12px); box-shadow: 0 .6rem 1.6rem rgba(30,43,65,.2); opacity: 0; transform: translateY(.5rem); transition: opacity .22s ease,transform .22s ease; }
.template-card-pc:hover .template-card-actions, .template-card-pc:focus-within .template-card-actions { opacity: 1; transform: translateY(0); }
.template-card-pc .template-card-actions .template-use-btn { background: #ff5a3c; }
.template-card-pc .template-card-actions .template-use-btn:hover { background: #ff6d52; }
.template-card-pc .template-card-actions .template-preview-btn { background: #2f82ff; }
.template-card-pc .template-card-actions .template-preview-btn:hover { background: #448fff; }
.template-card-pc .template-card-actions .template-preview-btn i { display: none; }
.template-card-pc .template-card-body { padding: 1.15rem .25rem .35rem; text-align: center; }
.product-template-showcase .mini-template-tabs { display: grid; width: 29rem; max-width: 100%; grid-template-columns: 1fr 1fr; margin: 0 auto 3.75rem; padding: .35rem; border: 1px solid rgba(134, 158, 189, .13); border-radius: 3rem; background: #e9eff8; }
.product-template-showcase .mini-template-tabs button { min-height: 3.4rem; border: 0; border-radius: 2.5rem; background: transparent; color: #5d6878; font-size: 1rem; font-weight: 650; transition: color .22s ease, background-color .22s ease, box-shadow .22s ease; }
.product-template-showcase .mini-template-tabs button:hover { color: #246bfd; }
.product-template-showcase .mini-template-tabs button.active { background: #fff; color: #246bfd; box-shadow: 0 .65rem 1.5rem rgba(51, 91, 155, .1); }
.product-template-showcase .mini-template-tabs button:focus-visible, .product-template-showcase .mini-template-arrow:focus-visible, .product-template-showcase .template-card-actions a:focus-visible { outline: .18rem solid rgba(36, 107, 253, .32); outline-offset: .16rem; }
.product-template-showcase .mini-template-gallery { position: relative; }
.product-template-showcase .mini-template-panel[hidden], .product-template-showcase .mini-template-arrow[hidden] { display: none; }
.product-template-showcase .mini-template-track { display: flex; gap: 1.5rem; justify-content: safe center; margin-top: -1rem; padding-top: 1rem; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: none; scroll-snap-type: x mandatory; }
.product-template-showcase .mini-template-track::-webkit-scrollbar { display: none; }
.product-template-showcase .mini-template-card { position: relative; min-width: 0; scroll-snap-align: start; }
.product-template-showcase .mini-template-arrow { position: absolute; z-index: 10; top: 45%; display: grid; width: 3.5rem; height: 3.5rem; place-items: center; border: 1px solid rgba(121, 145, 130, .24); border-radius: 1.1rem; background: linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(244, 249, 246, .92)); color: #17231b; box-shadow: 0 1rem 2.5rem rgba(25, 55, 37, .13), inset 0 1px 0 rgba(255, 255, 255, .9); backdrop-filter: blur(1rem); transform: translateY(-50%); transition: border-color .22s ease, background-color .22s ease, color .22s ease, box-shadow .22s ease, transform .22s ease; }
.product-template-showcase .mini-template-arrow.is-prev { left: -1.75rem; }
.product-template-showcase .mini-template-arrow.is-next { right: -1.75rem; }
.product-template-showcase .mini-template-arrow:hover { border-color: #101a13; background: #101a13; color: #32dc5a; box-shadow: 0 1.15rem 2.75rem rgba(16, 40, 24, .22), inset 0 1px 0 rgba(255, 255, 255, .08); }
.product-template-showcase .mini-template-arrow.is-prev:hover { transform: translate(-.18rem, -50%); }
.product-template-showcase .mini-template-arrow.is-next:hover { transform: translate(.18rem, -50%); }
.product-template-showcase .mini-template-card.template-card-h5, .product-template-showcase .mini-template-card.template-card-pc { overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.product-template-showcase .mini-template-card.template-card-h5:hover, .product-template-showcase .mini-template-card.template-card-pc:hover { border-color: transparent; box-shadow: none; transform: none; }
.product-template-showcase .template-live-preview { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; background: #fff; pointer-events: none; }
.product-template-showcase .template-card-body { padding: 1.15rem .25rem .35rem; text-align: center; }
.product-template-showcase .template-card-body h2 { margin: 0; color: #273142; font-size: 1rem; font-weight: 500; line-height: 1.45; }
.product-template-showcase .template-card-badge { position: absolute; z-index: 8; top: 1.05rem; right: 0; left: auto; display: inline-flex; min-width: 2.85rem; min-height: 1.3rem; align-items: center; justify-content: center; padding: 0 .4rem; border-radius: .25rem; color: #fff; font-size: .65rem; font-weight: 600; line-height: 1; box-shadow: 0 .15rem .45rem rgba(30, 43, 65, .18); transform: translateX(50%); }
.product-template-showcase .template-card-badge-hot { background: linear-gradient(135deg, #ff563f, #f92f56); }
.product-template-showcase .template-card-h5 { width: min(100%, 18.5rem); }
.product-template-showcase .template-card-h5 .template-card-cover { position: relative; aspect-ratio: 9 / 16; margin: 0; overflow: visible; border: .5rem solid #151b26; border-radius: 2rem; background: #151b26; box-shadow: 0 1.1rem 2.35rem rgba(24, 39, 68, .24), 0 0 0 1px rgba(255, 255, 255, .72); transition: border-color .22s ease, box-shadow .22s ease; }
.product-template-showcase .template-card-h5:hover .template-card-cover, .product-template-showcase .template-card-h5:focus-within .template-card-cover { border-color: #27334a; box-shadow: 0 1.25rem 2.7rem rgba(24, 39, 68, .28), 0 0 0 1px rgba(255, 255, 255, .76); }
.product-template-showcase .template-card-h5 .template-card-cover::before { content: ""; position: absolute; z-index: 3; inset: 0; border-radius: 1.5rem; background: rgba(16, 19, 25, .62); opacity: 0; transition: opacity .22s ease; }
.product-template-showcase .template-card-h5 .template-card-cover::after { display: none; }
.product-template-showcase .template-card-h5:hover .template-card-cover::before, .product-template-showcase .template-card-h5:focus-within .template-card-cover::before { opacity: 1; }
.product-template-showcase .template-card-h5 .template-live-preview { border-radius: 1.5rem; }
.product-template-showcase .template-card-h5 .template-card-badge { top: .65rem; }
.product-template-showcase .template-card-qr { position: absolute; z-index: 4; top: 16%; left: 50%; display: flex; width: 78%; max-width: 12rem; flex-direction: column; align-items: center; gap: .35rem; padding: .55rem; border-radius: .55rem; background: #fff; opacity: 0; transform: translate(-50%, .5rem); transition: opacity .22s ease, transform .22s ease; }
.product-template-showcase .template-card-qr img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; }
.product-template-showcase .template-card-qr span { color: #596475; font-size: .7rem; }
.product-template-showcase .template-card-h5:hover .template-card-qr, .product-template-showcase .template-card-h5:focus-within .template-card-qr { opacity: 1; transform: translate(-50%, 0); }
.product-template-showcase .template-card-h5 .template-card-actions { position: absolute; z-index: 4; inset: auto 11% 6%; display: flex; min-height: 0; flex-direction: column; gap: .5rem; padding: 0; background: transparent; opacity: 0; transition: opacity .22s ease; }
.product-template-showcase .template-card-h5:hover .template-card-actions, .product-template-showcase .template-card-h5:focus-within .template-card-actions { opacity: 1; }
.product-template-showcase .template-card-h5 .template-card-actions a { display: inline-flex; width: 100%; height: 2.45rem; align-items: center; justify-content: center; gap: .35rem; padding: 0 1rem; border: 1px solid rgba(255, 255, 255, .85); border-radius: 999px; font-size: .85rem; font-weight: 600; }
.product-template-showcase .template-card-h5 .template-use-btn { border-color: #ff6847; background: #ff6847; color: #fff; }
.product-template-showcase .template-card-h5 .template-use-btn:hover { border-color: #ff765b; background: #ff765b; }
.product-template-showcase .template-card-h5 .template-preview-btn { border-color: #fff; background: #fff; color: #ff6847; }
.product-template-showcase .template-card-pc .template-card-cover { position: relative; aspect-ratio: 16 / 11.5; margin: 0; overflow: hidden; border: 1px solid rgba(200, 211, 228, .9); border-radius: .8rem; background: #fff; box-shadow: 0 .7rem 1.9rem rgba(37, 49, 70, .11), 0 0 2.2rem rgba(36, 107, 253, .06); }
.product-template-showcase .template-card-pc .template-card-cover::before { display: none; }
.product-template-showcase .template-card-pc .template-live-preview { transform-origin: top left; will-change: transform; }
.product-template-showcase .template-card-pc .template-card-actions { position: absolute; z-index: 5; inset: auto .8rem .8rem; display: flex; min-height: 0; align-items: center; justify-content: center; gap: .6rem; padding: .45rem .55rem; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .25); box-shadow: 0 .6rem 1.6rem rgba(30, 43, 65, .2); opacity: 0; backdrop-filter: blur(12px); transform: translateY(.5rem); transition: opacity .22s ease, transform .22s ease; }
.product-template-showcase .template-card-pc:hover .template-card-actions, .product-template-showcase .template-card-pc:focus-within .template-card-actions { opacity: 1; transform: translateY(0); }
.product-template-showcase .template-card-pc .template-card-actions a { display: inline-flex; min-width: 5.8rem; height: 2.05rem; align-items: center; justify-content: center; gap: .35rem; padding: 0 .95rem; border: 0; border-radius: 999px; color: #fff; font-size: .8rem; font-weight: 600; }
.product-template-showcase .template-card-pc .template-use-btn { background: #ff5a3c; }
.product-template-showcase .template-card-pc .template-use-btn:hover { background: #ff6d52; }
.product-template-showcase .template-card-pc .template-preview-btn { background: #2f82ff; }
.product-template-showcase .template-card-pc .template-preview-btn:hover { background: #448fff; }
.product-template-showcase .template-card-pc .template-preview-btn i { display: none; }
.template-card-h5 .template-card-cover { position: relative; aspect-ratio: 9 / 16; margin: 0; overflow: visible; border: 1px solid rgba(200,211,228,.9); border-radius: 1.75rem; background: radial-gradient(120% 80% at 50% 0%,rgba(36,107,253,.06),transparent 45%), linear-gradient(180deg,#f4f7fc 0,#fff 1.1rem,#fff 100%); box-shadow: 0 .85rem 1.9rem rgba(37,49,70,.12), 0 0 0 1px rgba(255,255,255,.65), inset 0 0 1.2rem rgba(36,107,253,.04), 0 0 2.2rem rgba(36,107,253,.06); transition: border-color .22s ease; }
.template-card-h5:hover .template-card-cover, .template-card-h5:focus-within .template-card-cover { border-color: rgba(124,163,232,.95); }
.template-card-h5:hover .template-card-cover::before, .template-card-h5:focus-within .template-card-cover::before { opacity: 1; }
.template-card-h5 .template-card-qr { position: absolute; z-index: 4; top: 16%; left: 50%; display: flex; width: 78%; max-width: 12rem; flex-direction: column; align-items: center; gap: .35rem; padding: .55rem; border-radius: .55rem; background: #fff; opacity: 0; transform: translate(-50%,.5rem); transition: opacity .22s ease,transform .22s ease; }
.template-card-h5 .template-card-qr img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; }
.template-card-h5 .template-card-qr span { color: #596475; font-size: .7rem; }
.template-card-h5:hover .template-card-qr, .template-card-h5:focus-within .template-card-qr { opacity: 1; transform: translate(-50%,0); }
.template-card-h5:hover .template-card-actions, .template-card-h5:focus-within .template-card-actions { opacity: 1; }
.template-card-h5 .template-card-actions .template-use-btn { border-color: #ff6847; background: #ff6847; }
.template-card-h5 .template-card-actions .template-preview-btn { border-color: #fff; background: #fff; color: #ff6847; }
/*---------- 响应式覆盖（保持原断点与规则先后顺序） ----------*/
@media (max-width: 1199.98px) {
  .builder-browser { transform: scale(.91); transform-origin: center; }
  .service-shell { padding: 3.125rem; }
  .builder-function-row,.builder-function-row.is-reverse { gap: 3.5rem; }
  .builder-function-copy { padding: 2.5rem 1rem; }
  .function-editor-window,.function-content-window,.function-seo-window,.function-lead-site { width: 84%; }
  .function-analytics-window { width: 87%; }
  .function-device-desktop { left: 5%; width: 75%; }
  .function-device-tablet { right: 5%; }
  .builder-scenario-shell { grid-template-columns: 14rem minmax(0,1fr); }
  .builder-scenario-panel { grid-template-columns: minmax(15rem,.82fr) minmax(0,1.18fr); }
  .builder-scenario-copy { padding: 2.75rem; }
  .builder-scenario-browser { right: 5%; left: 5%; transform: rotate(-1.5deg) scale(.95); transform-origin: center; }
  .builder-scenario-float { right: 3%; transform: scale(.92); transform-origin: right bottom; }
  .builder-scenario-tabs button { padding-left: .75rem; min-height: 5rem; padding-right: 3.75rem; }
  .builder-scenario-tabs button::after,.builder-scenario-tabs button.active::after { right: 1.25rem; width: .82rem; height: .82rem; }
  .mini-template-track { gap: 1rem; }
  .mini-template-card { flex-basis: calc((100% - 3rem)/4); }
  .mini-template-arrow { width: 3.25rem; height: 3.25rem; border-radius: 1rem; }
  .mini-template-arrow.is-prev { left: -1.25rem; }
  .mini-template-arrow.is-next { right: -1.25rem; }
  .product-template-showcase .mini-template-track { gap: 1rem; }
  .product-template-showcase .mini-template-arrow { width: 3.25rem; height: 3.25rem; border-radius: 1rem; }
  .product-template-showcase .mini-template-arrow.is-prev { left: -1.25rem; }
  .product-template-showcase .mini-template-arrow.is-next { right: -1.25rem; }
}
@media (max-width: 991.98px) {
  .builder-hero { min-height: auto; padding-bottom: 2.75rem; }
  .builder-browser { width: min(92%, 40.625rem); margin-top: 1.562rem; transform: none; }
  .builder-subnav { top: var(--tncms-header-height); }
  .builder-product-nav-docked .builder-subnav { top: 0; }
  .builder-subnav-brand { padding-right: 0.875rem; font-size: 0.96rem; }
  .builder-product-nav-docked .builder-mini-logo { height: 2.25rem; }
  .builder-subnav-links a { flex: 0 0 auto; }
  .builder-subnav-cta { margin-left: auto; }
  .workflow-visual { min-height: 28.125rem; }
  .function-card, .function-card:first-child, .function-card:nth-child(5) { grid-column: span 6; }
  .function-copy { width: 100%; }
  .function-card img { position: absolute; right: 0; bottom: 0; width: 42%; height: 45%; min-height: 0; opacity: .45; }
  .service-shell { padding: 2.812rem 2.188rem; }
  .builder-function-list { gap: 5rem; }
  .builder-function-row,.builder-function-row.is-reverse { grid-template-columns: 1fr; gap: 2.5rem; min-height: 0; }
  .builder-function-row.is-reverse .builder-function-copy { order: 0; }
  .builder-function-copy { padding: 0 1rem; }
  .builder-function-visual,.builder-function-media { min-height: 31rem; }
  .builder-section { padding: 6rem 0; }
  .builder-subnav-links { gap: 1.25rem; margin-left: 1.1rem; }
  .builder-subnav-cta, .builder-product-nav-docked .builder-subnav-cta { margin-left: auto; }
  .builder-scenario-shell { display: block; }
  .builder-scenario-tabs button::before { width: 1.75rem; height: 1.75rem; border-radius: .5rem; }
  .builder-scenario-tabs button::after { display: none; }
  .builder-scenario-tabs button:hover { transform: translateY(-.125rem); }
  .builder-scenario-panel { grid-template-columns: minmax(15rem,.8fr) minmax(0,1.2fr); min-height: 31rem; }
  .builder-scenario-copy { padding: 2.5rem; }
  .builder-scenario-visual { min-height: 29rem; }
  .builder-scenario-browser { top: 2.5rem; }
  .builder-scenario-float { transform: scale(.84); transform-origin: right bottom; }
  .builder-scenario-tabs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-bottom: .875rem; gap: .5rem; padding: .5rem; }
  .builder-scenario-tabs button { display: flex; justify-content: center; gap: .5rem; text-align: center; min-height: 3.75rem; padding: .75rem; }
  .builder-scenario-tabs button::after,.builder-scenario-tabs button.active::after { display: none; }
  .mini-template-track { margin: -1rem -1.5rem 0; padding: 1rem 1.5rem 0; }
  .mini-template-card { flex: 0 0 14rem; }
  .mini-template-arrow { display: none; }
  .product-template-showcase .mini-template-track { margin: -1rem -1.5rem 0; padding: 1rem 1.5rem 0; }
  .product-template-showcase .mini-template-card { flex: 0 0 20rem; }
  .product-template-showcase .template-card-h5 { max-width: 18.5rem; }
  .product-template-showcase .mini-template-arrow { display: none; }
}
@media (max-width: 767.98px) {
  .builder-hero { min-height: auto; padding-top: 1.1rem; }
  .builder-section-head h2, .builder-section-head p { white-space: normal; }
  .common-breadcrumb { margin-bottom: 1.25rem; }
  .builder-hero-kicker { margin-bottom: 0; }
  .builder-hero h1 { font-size: 2.55rem; }
  .builder-hero-lead { font-size: .96rem; }
  .builder-browser { width: 100%; margin-bottom: 1.125rem; }
  .builder-browser-body { height: 19.375rem; }
  .site-canvas { margin: 0.625rem; }
  .site-hero-block { padding: 0.875rem 1rem; }
  .site-hero-copy strong { font-size: 1.02rem; }
  .site-hero-art { width: 7.5rem; flex-basis: 7.5rem; height: 5.25rem; }
  .builder-device-mobile { right: -0.312rem; bottom: -1.25rem; transform: scale(.8); transform-origin: right bottom; }
  .float-card-live { top: 8rem; right: -0.5rem; }
  .float-card-speed { bottom: -2.25rem; left: -0.25rem; }
  .builder-subnav { height: 3.5rem; }
  .builder-subnav .container { padding-right: 0; }
  .builder-subnav-cta { display: none; }
  .builder-product-nav-docked .builder-subnav-sentinel { height: 3.5rem; }
  .builder-product-nav-docked .tncms-builder [id] { scroll-margin-top: 4.5rem; }
  .builder-proof { padding: 2.125rem 0; }
  .proof-item { padding: 1.062rem 0.5rem; }
  .proof-item::after { display: none; }
  .builder-proof [class*="col-"]:nth-child(odd) .proof-item { border-right: 1px solid #e4eaf2; }
  .builder-proof [class*="col-"]:nth-child(-n+2) .proof-item { border-bottom: 1px solid #e4eaf2; }
  .builder-section-head h2 { font-size: 2rem; }
  .workflow-visual { min-height: 22.812rem; }
  .workflow-window { top: 3.438rem; right: 1.125rem; bottom: 2.375rem; left: 1.562rem; }
  .workflow-panel { left: 0; transform: scale(.86); transform-origin: top left; }
  .workflow-content { padding: 2.625rem 1.438rem; }
  .workflow-cursor { right: 12%; }
  .function-card, .function-card:first-child, .function-card:nth-child(5) { min-height: 17.5rem; grid-column: span 12; }
  .function-copy { padding: 1.625rem; }
  .function-copy > i { margin-bottom: 1.75rem; }
  .service-shell { padding: 2.375rem 1.375rem; border-radius: 1.125rem; }
  .builder-final-cta { padding: 4.5rem 0; }
  .builder-functions { padding-top: 4.5rem; }
  .builder-function-heading { margin-bottom: 3.5rem; }
  .builder-function-heading h2 { font-size: 2.15rem; }
  .builder-function-list { gap: 4.25rem; }
  .builder-function-copy { padding: 0; }
  .builder-function-copy small { font-size: .72rem; }
  .builder-function-copy h3 { margin: 1rem 0 1.25rem; font-size: 1.8rem; }
  .builder-function-copy p { padding-left: 1.35rem; font-size: .95rem; line-height: 1.8; }
  .builder-function-copy p:before { top: .68rem; }
  .builder-function-visual,.builder-function-media { min-height: 25rem; border-radius: 1.2rem; }
  .function-browser-demo { width: 82%; height: 70%; }
  .function-demo-float { right: 3%; bottom: 7%; min-width: 10.5rem; padding: .85rem; }
  .function-demo-float>i { width: 2.3rem; height: 2.3rem; }
  .function-editor-window,.function-content-window,.function-seo-window,.function-lead-site,.function-analytics-window { width: 88%; height: 72%; }
  .function-window-bar { height: 2.1rem; }
  .function-window-bar>span { font-size: .42rem; }
  .function-editor-body { height: calc(100% - 2.1rem); grid-template-columns: 2.2rem 1fr 5rem; }
  .function-editor-tools { gap: .45rem; padding: .6rem .25rem; }
  .function-editor-tools i { width: 1.35rem; height: 1.35rem; }
  .function-editor-body main { padding: .8rem; }
  .function-editor-panel { padding: .65rem .4rem; }
  .function-canvas-nav span { display: none; }
  .function-selected-block { margin: 1.25rem auto .65rem; padding: .75rem; }
  .function-selected-block strong { font-size: .78rem; }
  .function-canvas-cards span { height: 2.5rem; }
  .function-cursor { right: 20%; bottom: 14%; }
  .function-status-card,.function-responsive-card,.function-publish-card,.function-lead-card,.function-live-card { padding: .65rem .75rem; }
  .function-status-card>i,.function-responsive-card>i,.function-publish-card>i,.function-lead-card>i,.function-live-card>i { width: 2rem; height: 2rem; }
  .function-status-card { left: 2%; bottom: 6%; }
  .function-responsive-card,.function-publish-card,.function-live-card { right: 2%; bottom: 6%; }
  .function-device-desktop { left: 4%; top: 11%; width: 76%; height: 58%; }
  .function-device-tablet { right: 4%; top: 20%; width: 9.5rem; height: 14rem; }
  .function-device-phone { right: 2%; bottom: 6%; width: 5rem; height: 10rem; }
  .function-device-page>strong { font-size: .85rem; }
  .function-device-tablet strong { font-size: .8rem; }
  .function-content-body { height: calc(100% - 2.1rem); grid-template-columns: 4.6rem 1fr; }
  .function-content-body>aside { padding: .6rem .35rem; }
  .function-content-body>aside>b { margin-bottom: .4rem; }
  .function-content-body>aside>span { padding: .38rem; font-size: .45rem; }
  .function-content-body>main { padding: .65rem; }
  .function-content-list>span { grid-template-columns: 1.8rem 1fr 2.7rem; }
  .function-content-list small { display: none; }
  .function-content-list i { width: 1.8rem; height: 1.4rem; }
  .function-seo-body { height: calc(100% - 2.1rem); grid-template-columns: 1fr; gap: .6rem; padding: .75rem; }
  .function-search-preview { padding: .65rem; }
  .function-seo-score { right: 2%; bottom: 6%; }
  .function-lead-site { grid-template-columns: .8fr 1.2fr; }
  .function-lead-copy { padding: 1.2rem; }
  .function-lead-copy strong { font-size: 1rem; }
  .function-lead-copy>span { display: none; }
  .function-lead-form { padding: .8rem; }
  .function-lead-form label { margin: .3rem 0; }
  .function-lead-count { right: 2%; top: 6%; width: 6.5rem; padding: .65rem; }
  .function-lead-card { left: 2%; bottom: 6%; }
  .function-analytics-body { height: calc(100% - 2.1rem); grid-template-columns: 1fr .7fr; padding: .6rem; }
  .function-metric-row { gap: .35rem; }
  .function-metric-row>span { padding: .45rem; }
  .function-chart-card,.function-source-card { padding: .55rem; }
  .function-chart-card svg { height: 5.5rem; }
  .function-source-card>span { margin-top: .6rem; }
  .builder-section { padding: 4.5rem 0; }
  .builder-subnav-brand { padding-right: 0.75rem; }
  .builder-product-nav-docked .builder-subnav-brand { gap: 0; padding-right: 0.65rem; font-size: 0; }
  .builder-product-nav-docked .builder-mini-logo { height: 2rem; }
  .builder-subnav-links { gap: 0.85rem; margin-left: 0.65rem; scroll-snap-type: x proximity; mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 1.25rem), transparent 100%); }
  .builder-subnav-links a { scroll-snap-align: center; }
  .builder-section-head { margin-bottom: 2.75rem; }
  .builder-section-head h2, .builder-function-heading h2 { font-size: 2.15rem; }
  .builder-function-heading p { font-size: .95rem; line-height: 1.75; }
  .capability-card { padding: 1.688rem; min-height: auto; }
  .capability-card h3, .scenario-card h3 { font-size: 1.2rem; }
  .capability-tags { position: static; margin-top: 1.5rem; }
  .builder-scenarios > .container > .builder-section-head { margin-bottom: 2.5rem; }
  .builder-scenario-shell { padding: .5rem; border-radius: 1.25rem; }
  .builder-scenario-tabs::-webkit-scrollbar { display: none; }
  .builder-scenario-panel,.builder-scenario-panel.active { grid-template-columns: 1fr; min-height: 0; }
  .builder-scenario-copy { padding: 2rem 1.5rem 2.25rem; }
  .builder-scenario-copy h3 { font-size: 2.25rem; }
  .builder-scenario-copy p { font-size: .9375rem; line-height: 1.85; }
  .builder-scenario-visual { min-height: 25rem; margin: 0 .75rem .75rem; }
  .builder-scenario-browser { top: 1.5rem; right: 4%; left: 4%; transform: rotate(-1.5deg) scale(.86); transform-origin: top center; }
  .builder-scenario-float { right: 2%; bottom: 3%; transform: scale(.82); transform-origin: right bottom; }
  .builder-scenario-panel>img { width: calc(100% - 1.5rem); height: auto; min-height: 24rem; margin: 0 .75rem .75rem; }
  .builder-scenario-tabs { display: flex; flex-direction: row; gap: .5rem; margin-bottom: .5rem; overflow-x: auto; border-radius: .875rem; scrollbar-width: none; padding: .5rem; }
  .builder-scenario-tabs button { flex: 0 0 auto; min-width: 8.5rem; font-size: .875rem; min-height: 3.5rem; padding: .625rem .875rem; }
  .mini-template-tabs { margin-bottom: 2.75rem; }
  .mini-template-tabs button { min-height: 3rem; font-size: .9rem; }
  .product-template-showcase .mini-template-tabs { margin-bottom: 2.75rem; }
  .product-template-showcase .mini-template-tabs button { min-height: 3rem; font-size: .9rem; }
  .product-template-showcase .template-card-pc .template-card-actions { inset: auto .6rem .6rem; background: rgba(255, 255, 255, .88); opacity: 1; transform: none; }
}
@media (max-width: 479.98px) {
  .builder-hero h1 { font-size: 2.25rem; }
  .builder-hero-actions .btn { width: 100%; }
  .builder-hero-trust { gap: 0.625rem 0.938rem; }
  .site-editor-bar { gap: 0.5rem; padding: 0 0.625rem; }
  .site-device-switch { display: none; }
  .site-canvas { margin: 0.562rem; }
  .site-canvas-nav span { display: none; }
  .site-hero-block { padding: 0.75rem 0.875rem; }
  .site-hero-copy strong { font-size: .88rem; }
  .site-hero-copy button { margin-top: 0.5rem; }
  .site-hero-art { width: 5.5rem; flex-basis: 5.5rem; height: 4rem; font-size: 1rem; }
  .site-cards { display: none; }
  .builder-float-card { display: none; }
  .builder-device-mobile { right: -0.75rem; }
  .builder-subnav-links a { font-size: .8rem; }
  .proof-item strong { font-size: 1.55rem; }
  .proof-item p { font-size: .68rem; }
  .workflow-visual { min-height: 20.625rem; }
  .workflow-panel { display: none; }
  .workflow-window { top: 1.562rem; left: 0.938rem; }
  .workflow-cursor { bottom: 20%; }
  .builder-section-head h2, .builder-function-heading h2 { font-size: 1.85rem; }
  .builder-scenario-tabs button::before { display: none; }
  .builder-scenario-tabs button { min-width: 6.75rem; }
  .builder-scenario-copy h3 { font-size: 2rem; }
  .builder-scenario-visual { min-height: 22rem; }
  .builder-scenario-browser { right: -5%; left: -5%; transform: rotate(-1deg) scale(.72); }
  .builder-scenario-float { right: 0; bottom: 1%; transform: scale(.72); }
  .mini-template-card { flex-basis: 13.25rem; }
  .mini-template-track { margin: -1rem -1rem 0; padding: 1rem 1rem 0; }
  .product-template-showcase .mini-template-card { flex-basis: 17rem; }
  .product-template-showcase .template-card-h5 { max-width: 16rem; }
  .product-template-showcase .mini-template-track { margin: -1rem -1rem 0; padding: 1rem 1rem 0; }
}
@media (prefers-reduced-motion: reduce) {
  .builder-reveal { opacity: 1; transform: none; transition: none; }
  .tncms-builder .site-capability-card, .tncms-builder .site-capability-card::before, .tncms-builder .site-capability-card::after, .tncms-builder .mini-capability-card, .tncms-builder .mini-capability-card::before, .tncms-builder .mini-capability-card::after { transition: none; }
  .builder-scenario-panel.active { animation: none; }
  .builder-scenario-tabs button { transition: none; }
  .product-template-showcase *, .product-template-showcase *::before, .product-template-showcase *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
@media (max-width:575.98px) {
  .builder-function-details { grid-template-columns: 1fr; margin-top: 1.5rem; }
  .builder-function-details li { min-height: 4.25rem; }
  .builder-function-details em { font-size: .72rem; }
}
/*============================================================================
   全站大屏适配公共层（原 channel_highres.css 通用部分合并而来）
   1400px（87.5rem）统一内容画布 + 建站/小程序产品页多分辨率首屏适配。
   说明：页面专属的大屏覆盖规则在各页面 CSS 文件末尾；
   本层中 .builder-site-hero 等页面专属 hero 的 min-height 规则因需保持
   “最后加载覆盖”顺序，同样保留在对应页面 CSS 末尾。
   ============================================================================*/
@media (min-width: 992px) {
  /*产品页完整桌面适配：原 100vh 首屏在宽屏上会产生大块底部空白，clamp 收敛高度*/
  .tncms-builder .builder-hero > .container > .row,
  .mini-page .mini-hero > .container > .row { align-items: flex-start; }
  .tncms-builder,
  .mini-page { overflow-x: clip; }
  .tncms-builder .builder-section,
  .mini-page .mini-section { padding-top: clamp(5.25rem, 7vw, 7.5rem); padding-bottom: clamp(5.25rem, 7vw, 7.5rem); }
}
/*普通桌面与小尺寸笔记本：保留双栏，但收紧视觉与文案间距。*/
@media (min-width: 992px) and (max-width: 1199.98px) {
  .tncms-builder .builder-hero > .container > .row,
  .mini-page .mini-hero > .container > .row { --bs-gutter-x: 1.5rem; }
  .tncms-builder .builder-hero h1,
  .mini-page .mini-hero h1 { font-size: clamp(2.4rem, 3.6vw, 2.75rem); }
  .tncms-builder .builder-hero-lead,
  .mini-page .mini-hero-copy > p { font-size: 1rem; line-height: 1.75; }
}
/*平板及手机依赖页面原有堆叠布局，并强制视觉组件不超过视口。*/
@media (max-width: 991.98px) {
  .tncms-builder .builder-browser,
  .mall-page .mall-hero-visual,
  .mini-page .mini-hero-art { max-width: 100%; }
  .tncms-builder .builder-section,
  .mini-page .mini-section { padding-top: clamp(4.5rem, 9vw, 6rem); padding-bottom: clamp(4.5rem, 9vw, 6rem); }
}
@media (min-width: 1400px) {
  :root { --tncms-channel-gutter: 2rem; --tncms-channel-wide: 87.5rem; --tncms-channel-readable: 87.5rem; --tncms-product-canvas: 87.5rem; --tncms-product-hero-height: 44.5rem; }
  /*顶部导航与各栏目采用相同的大屏对齐基线。*/
  .tncms-header > .container,
  .tncms-header .navbar > .container { width: calc(100% - (var(--tncms-channel-gutter) * 2)); max-width: var(--tncms-channel-wide); }
  /*建站产品与小程序页共用 1400px 画布，避免四列能力卡和长流程组件被横向拉散。*/
  .tncms-builder .container,
  .mini-page .container { width: calc(100% - (var(--tncms-channel-gutter) * 2)); max-width: var(--tncms-channel-wide); }
  .tncms-builder .container,
  .mini-page .container { max-width: var(--tncms-product-canvas); }
  /*建站、出海、商城、门店通、客户通：首屏让视觉区获得更多空间。*/
  .tncms-builder .builder-hero > .container > .row > .col-lg-6:first-child,
  .mini-page .mini-hero > .container > .row > .col-lg-6:first-child { width: 44%; flex: 0 0 44%; padding-right: clamp(2rem, 3vw, 3.75rem); }
  .tncms-builder .builder-hero > .container > .row > .col-lg-6:last-child,
  .mini-page .mini-hero > .container > .row > .col-lg-6:last-child { display: flex; width: 56%; flex: 0 0 56%; align-items: flex-start; justify-content: center; }
  .tncms-builder .builder-hero h1 { max-width: 43rem; font-size: clamp(2.9rem, 3.1vw, 3.375rem); }
  .tncms-builder .builder-hero-lead { max-width: 39rem; }
  .tncms-builder .builder-browser { width: min(100%, 40.625rem); margin-top: .375rem; margin-bottom: 2.25rem; transform: scale(1.08); transform-origin: center top; }
  /*大屏流程区保持视觉与说明均衡，避免一侧内容贴边。*/
  .tncms-builder .builder-workflow > .container > .row,
  .mini-page .mini-development > .container > .row { column-gap: clamp(2.5rem, 3vw, 4rem); }
  .tncms-builder .builder-workflow > .container > .row > .col-lg-6,
  .mini-page .mini-development > .container > .row > .col-lg-6 { width: calc(50% - 2rem); flex: 1 1 0; }
}
/*大屏但纵向空间有限时，首屏优先完整展示核心操作区。*/
@media (min-width: 1400px) and (max-height: 899.98px) {
  .tncms-builder .builder-browser { margin-bottom: 1.25rem; transform: scale(1.02); }
  .mall-page .mall-hero-visual,
  .mini-page .mini-hero-art { margin-top: -1rem; }
}
/*Product detail hero highlight strokes rely on a single desktop line; hide the
   absolute stroke on mobile where emphasized title text wraps onto several lines.*/
@media (max-width: 767.98px) {
  .tncms-builder[class*="-page"] [class*="-hero"] h1 em::after { content: none; display: none; }
}
@media (max-width: 767.98px) {
  nav.builder-subnav .builder-subnav-brand,
  nav.about-subnav .about-subnav-brand,
  nav.solution-anchor-nav .solution-anchor-brand,
  nav[class*="-product-nav"] [class*="nav-brand"],
  nav[class*="-anchor-nav"] [class*="nav-brand"] { display: block; width: auto; max-width: 34vw; min-width: 0; flex: 0 0 auto; overflow: hidden; padding-right: .45rem; font-size: .96rem; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
  nav.builder-subnav .builder-subnav-brand img,
  nav.about-subnav .about-subnav-brand img,
  nav.solution-anchor-nav .solution-anchor-brand img,
  nav[class*="-product-nav"] [class*="nav-brand"] img,
  nav[class*="-anchor-nav"] [class*="nav-brand"] img { display: none !important; }
  nav.builder-subnav .builder-subnav-links,
  nav.about-subnav .about-subnav-links,
  nav.solution-anchor-nav .solution-anchor-links,
  nav[class*="-product-nav"] [class*="nav-links"],
  nav[class*="-anchor-nav"] [class*="nav-links"] { display: flex; height: 100%; min-width: 0; flex: 1 1 0%; align-self: stretch; align-items: stretch; gap: .55rem; margin-left: .35rem; padding-inline: 0; overflow-x: auto; overflow-y: hidden; scroll-padding-inline: 0; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-mask-image: none; mask-image: none; }
  nav.builder-subnav,
  nav[class*="-product-nav"] { overflow: hidden; }
  nav[class*="-product-nav"] > .container { width: 100%; max-width: 100%; min-width: 0; }
  nav.builder-subnav .builder-subnav-links::-webkit-scrollbar,
  nav.about-subnav .about-subnav-links::-webkit-scrollbar,
  nav.solution-anchor-nav .solution-anchor-links::-webkit-scrollbar,
  nav[class*="-product-nav"] [class*="nav-links"]::-webkit-scrollbar,
  nav[class*="-anchor-nav"] [class*="nav-links"]::-webkit-scrollbar { display: none; width: 0; height: 0; }
  nav[class*="-product-nav"] [class*="nav-links"] a { position: relative; display: flex; height: 100%; flex: 0 0 auto; align-items: center; font-weight: 500; }
  nav[class*="-product-nav"] [class*="nav-links"] a::after { bottom: 0 !important; height: 2px; transform-origin: center; transition: transform .2s ease; }
  nav[class*="-product-nav"] [class*="nav-links"] a.active { font-weight: 700; }
  nav[class*="-product-nav"] [class*="nav-links"] a.active::after { transform: scaleX(1); }
  nav [data-sticky-brand-ready] .sticky-brand-company,
  nav [data-sticky-brand-ready] .sticky-brand-divider { display: none; }
  nav.builder-subnav .builder-subnav-links a,
  nav.about-subnav .about-subnav-links a,
  nav.solution-anchor-nav .solution-anchor-links a,
  nav[class*="-product-nav"] [class*="nav-links"] a,
  nav[class*="-anchor-nav"] [class*="nav-links"] a { scroll-snap-align: center; }
}
@media (min-width: 992px) {
  nav[class] [data-sticky-brand-ready] { display: flex; width: auto; max-width: none; min-width: 0; flex: 0 0 auto; align-items: center; gap: .5rem; overflow: visible; padding-right: .75rem; border-right: 0; white-space: nowrap; }
  nav[class] [data-sticky-brand-ready] .sticky-brand-company { display: inline-flex; flex: 0 0 auto; align-items: center; gap: .35rem; color: #172033; font-size: 1.02rem; font-weight: 800; white-space: nowrap; }
  nav[class] [data-sticky-brand-ready] .sticky-brand-logo { display: block; width: auto; max-width: 5.5rem; height: 1.9rem; flex: 0 0 auto; object-fit: contain; }
  nav[class] [data-sticky-brand-ready] .sticky-brand-divider { display: inline-block; width: 1px; height: 1.05rem; flex: 0 0 1px; background: #c6cede; }
  nav[class] [data-sticky-brand-ready] .sticky-brand-topic { display: inline-block; color: #172033; font-size: 1.05rem; font-weight: 800; line-height: 1.2; white-space: nowrap; }
  nav[class] [data-sticky-brand-ready] .sticky-brand-company,
  nav[class] [data-sticky-brand-ready] .sticky-brand-divider { display: none; }
  body[class*="product-nav-docked"] nav[class] [data-sticky-brand-ready] .sticky-brand-company,
  body.about-nav-docked nav[class] [data-sticky-brand-ready] .sticky-brand-company,
  body.solution-nav-docked nav[class] [data-sticky-brand-ready] .sticky-brand-company,
  body[class*="product-nav-docked"] nav[class] [data-sticky-brand-ready] .sticky-brand-divider,
  body.about-nav-docked nav[class] [data-sticky-brand-ready] .sticky-brand-divider,
  body.solution-nav-docked nav[class] [data-sticky-brand-ready] .sticky-brand-divider { display: inline-flex; }
}