/* 2026-09 客户复核：公告、移动导航、认证卡片及产品优势对齐。 */

/* 公告图标在滚动窗口之外，文字始终裁切在自己的窗口内。 */
.util__notice{position:relative;gap:10px;overflow:hidden;isolation:isolate}
.util__notice>svg{position:relative;z-index:1;flex:0 0 16px;width:16px;height:16px}
.util__notice .util__notice-win{display:block;flex:1 1 auto;width:0;min-width:0;overflow:hidden;isolation:isolate;mask-image:none;-webkit-mask-image:none}
.util__notice .util__notice-roll{display:flex;flex:none;width:max-content;max-width:none}
.util__notice>.util__notice-roll{display:none}
.util__notice:focus-within .util__notice-roll{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){
  .util__notice .util__notice-roll{width:100%;animation:none;transform:none;will-change:auto}
  .util__notice .util__notice-roll i{padding-right:0;overflow:hidden;text-overflow:ellipsis}
  .util__notice .util__notice-roll i~i{display:none}
}

/* 沿用 main.js 的开关事件，仅补足清晰的分组及可访问状态。 */
html.has-mobile-drawer{overflow:hidden;overscroll-behavior:none}
.drawer.drawer--review{overscroll-behavior:none}
.drawer--review .drawer__panel{
  width:min(88vw,360px);max-height:100vh;max-height:100dvh;
  padding:0 20px max(24px,env(safe-area-inset-bottom));
  overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;
  box-shadow:-18px 0 60px rgba(15,36,80,.16);
}
.drawer--review .drawer__head{
  position:sticky;top:0;z-index:2;margin:0 -20px 10px;
  padding:max(16px,env(safe-area-inset-top)) 20px 16px;
  background:rgba(255,255,255,.98);border-bottom:1px solid var(--line);
}
.drawer--review .drawer__head>span{font-size:18px;font-weight:700;color:var(--blue-900)}
.drawer--review .drawer__close{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  width:auto;min-width:80px;height:44px;padding:0 14px;border-radius:24px;
  background:var(--blue-50);border-color:#DCE5F5;color:var(--blue-700);
}
.drawer--review .drawer__close span{font-size:14px;font-weight:600;color:inherit}
.drawer--review .drawer__close svg{flex:none}
.drawer--review .drawer__close:hover{background:var(--blue-600);color:#fff}
.drawer--review .drawer__panel>a,
.drawer--review .drawer__group>a{min-height:56px;padding:14px 10px;font-size:16px;line-height:1.6}
.drawer--review .drawer__group{display:flex;align-items:center;border-bottom:1px solid var(--line-2);border-radius:10px 10px 0 0}
.drawer--review .drawer__group>a{flex:1;min-width:0;border:0}
.drawer--review .drawer__group[data-expanded="true"]{background:var(--blue-50);border-color:transparent}
.drawer--review .drawer__tog{flex:0 0 44px;width:44px;height:44px;margin-right:2px;border-radius:10px;color:var(--blue-700)}
.drawer--review .drawer__tog:hover{background:var(--blue-100)}
.drawer--review .drawer__tog svg{width:16px;height:16px}
.drawer--review .drawer__panel .sub{max-height:none;margin:0 0 8px;padding:5px 10px 10px;border-radius:0 0 10px 10px;background:var(--blue-50);transition:none}
.drawer--review .drawer__panel .sub[hidden]{display:none!important}
.drawer--review .drawer__panel .sub a{min-height:46px;padding:11px 12px;border-bottom:1px solid #E3EAF7;font-size:14px;line-height:1.65}
.drawer--review .drawer__panel .sub a:last-child{border-bottom:0}
.drawer--review .drawer__panel .sub a.is-on{color:var(--blue-700)}
.drawer--review .drawer__panel :focus-visible{outline-offset:-2px}

/* 徽章容器不再沿用 width:max-content，窄屏内保持完整、等宽。 */
.power .power__badge>i{flex:none}
.power .power__badge>i svg{color:#fff}
@media(max-width:760px){
  .power .power__badges{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;max-width:100%;gap:12px}
  .power .power__badges>.power__badge{min-width:0;max-width:100%;padding:16px 12px;gap:10px}
  .power .power__badge>b{min-width:0;max-width:100%;font-size:16px;line-height:1.4}
  .power .power__badge em{display:block;margin-top:3px;line-height:1.55;white-space:normal;overflow-wrap:anywhere}
}
@media(max-width:520px){
  .power .power__badges>.power__badge{flex-direction:column;justify-content:flex-start;text-align:center;padding:16px 10px;gap:10px}
  .power .power__badge>i{width:40px;height:40px}
  .power .power__badge em{font-size:11.5px}
}

/* 桌面与平板卡片显式居中，手机端沿用独立的左图右文布局。 */
@media(min-width:761px){
  .page-products .advbox__cards>.advc>h4,
  .page-products .advbox__cards>.advc>.advc__d{align-self:stretch;width:100%;text-align:center}
}
/* 显式居中标题与图标，避免浏览器按钮默认样式造成移动端偏移。 */
@media(max-width:1180px){
  .page-products .advbox__cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-products .advbox__cards>.advc{align-items:center;min-width:0;text-align:center}
  .page-products .advbox__cards>.advc>h4{align-self:stretch;width:100%;margin:0;text-align:center;line-height:1.5;white-space:normal;overflow-wrap:anywhere}
}
@media(max-width:640px){
  .page-products .advbox__cards>.advc{padding-inline:10px}
  .page-products .advbox__cards>.advc>h4{font-size:15px}
}
@media(max-width:360px){
  .page-products .advbox__cards>.advc>h4{font-size:14px}
}

/* 专用竖幅技术支持配图：保留底部留白，文字不遮挡科研资料主体。 */
.nav__panel .nav__mega-art--technical{
  padding:0;border-radius:12px;background:#e9f3ff;
  box-shadow:inset 0 0 0 1px rgba(67,113,190,.08);
}
.nav__mega-art--technical img{
  object-position:center top;transition:transform .35s ease;
}
.nav__mega-art--technical .nav__mega-cap{
  padding:30px 14px 15px;gap:4px;color:#193c77;
  background:linear-gradient(180deg,rgba(225,240,255,0),rgba(225,240,255,.92) 42%,#deedff);
}
.nav__mega-art--technical .nav__mega-cap b{font-size:16px;line-height:1.4}
.nav__mega-art--technical .nav__mega-cap i{font-size:11px;line-height:1.6;color:#496990;opacity:1}
.nav__mega-art--technical:hover img{transform:scale(1.025)}
@media(prefers-reduced-motion:reduce){
  .nav__mega-art--technical img{transition:none}
  .nav__mega-art--technical:hover img{transform:none}
}

/* 福利中心专用 4:9 竖图，与技术支持保持统一的蓝白视觉。 */
.nav__panel .nav__mega-art--welfare{
  padding:0;border-radius:12px;background:#e9f3ff;
  box-shadow:inset 0 0 0 1px rgba(67,113,190,.08);
}
.nav__mega-art--welfare img{
  object-position:center top;transition:transform .35s ease;
}
.nav__mega-art--welfare .nav__mega-cap{
  padding:30px 16px 18px;gap:5px;color:#193c77;
  background:linear-gradient(180deg,rgba(225,240,255,0),rgba(225,240,255,.92) 42%,#deedff);
}
.nav__mega-art--welfare .nav__mega-cap b{font-size:16px;line-height:1.4}
.nav__mega-art--welfare .nav__mega-cap i{font-size:12px;line-height:1.6;color:#496990;opacity:1}
.nav__mega-art--welfare:hover img{transform:scale(1.025)}
@media(prefers-reduced-motion:reduce){
  .nav__mega-art--welfare img{transition:none}
  .nav__mega-art--welfare:hover img{transform:none}
}
/* One shared capsule: service, phone, WeChat and search. */
.float.float--search-ready,.trial-visible .float.float--search-ready{transform:none;opacity:1;pointer-events:auto;bottom:clamp(16px,14vh,130px)}
.trial-visible .float--search-ready .float__mascot{display:none}
/* Keep raster artwork out of the capsule edges, icons and shadow. */
.float--crisp{right:max(24px,calc(50vw - 892px));width:64px;overflow:visible;transform:none;transition:opacity .2s}
.float--crisp .float__panel{display:grid;justify-items:center;gap:10px;position:relative;isolation:isolate;width:64px;padding:12px 0;overflow:visible}
.float--crisp .float__panel::before{content:"";position:absolute;inset:0;z-index:1;border:1px solid #dce5f3;border-radius:34px;background:#fff;box-shadow:0 6px 18px rgba(37,67,125,.13);pointer-events:none}
.float--crisp .float__mascot{position:absolute;right:calc(100% - 9px);top:20px;z-index:0;display:block;width:66px;height:auto;max-width:none;pointer-events:none;user-select:none}
.float--crisp .float__action{position:relative;inset:auto;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:48px;height:60px;padding:0;margin:0;border:0;border-radius:10px;background:transparent;box-shadow:none;color:#2453c4;cursor:pointer;transition:background .18s,color .18s}
.float--crisp .float__action>svg{display:block;flex:none;width:26px;height:26px;pointer-events:none}
.float--crisp .float__hit--3>svg{width:28px;height:28px}
.float--crisp .float__hit--3{--float-icon-surface:#fff}
.float--crisp .float__hit--3:hover,.float--crisp .float__hit--3:focus-visible{--float-icon-surface:#eef4ff}
.float--crisp .float__label{font-family:inherit;font-size:12px;line-height:1.4;font-weight:500;letter-spacing:normal;pointer-events:none}
.float--crisp .float__action:hover{background:#eef4ff;color:#1a43a5}
/* Separators live in the gap, outside the rounded hover/focus surface. */
.float--crisp .float__action+.float__action::before{content:"";position:absolute;left:7px;right:7px;top:-5px;height:1px;background:#e0e8f5;pointer-events:none}
.float--crisp .float__action:focus-visible{outline:2px solid #7394df;outline-offset:1px;background:#eef4ff}
.float--crisp .float__hit span{z-index:6;pointer-events:none}
.float--crisp .float__hit:focus-visible span{opacity:1;visibility:visible;transform:translateY(-50%)}
/* Contrast with both the white content area and the blue footer. */
.float__top{background:var(--orange-d);color:#fff;border:2px solid #fff;box-shadow:0 6px 18px rgba(117,55,13,.24)}
.float__top:hover{background:#C45B0A}
.float__top:focus-visible{background:#C45B0A;outline:3px solid #FFCA96;outline-offset:3px}
.float__top:focus-visible span{opacity:1;visibility:visible;transform:translateY(-50%)}
.float--crisp .float__top{width:52px;height:52px;margin-right:6px}
.float-dock-viewport{display:contents}
.float__peek{display:none}
@media(min-width:761px) and (hover:hover) and (pointer:fine){
  .float-dock-viewport{display:block;position:fixed;inset:0;z-index:150;contain:layout paint;overflow:hidden;pointer-events:none}
  .float-dock-viewport .float.float--search-ready.float--dock{right:0;width:88px;padding-right:24px;transform:translateX(100%);transition:transform .3s var(--ease) .16s;pointer-events:auto}
  .float-dock-viewport .float__mascot{opacity:0;transition:opacity .18s}
  .float-dock-viewport .float__peek{position:absolute;right:0;bottom:calc(clamp(16px,14vh,130px) + 170px);z-index:151;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:28px;height:88px;padding:10px 5px;border:1px solid #dce5f3;border-right:0;border-radius:15px 0 0 15px;background:#fff;color:#2453c4;box-shadow:-3px 3px 12px rgba(37,67,125,.1);pointer-events:auto;transition:opacity .18s}
  .float__peek span{font-size:12px;font-weight:500;line-height:1.4;writing-mode:vertical-rl;letter-spacing:.16em}
  .float-dock-viewport .float__peek{overflow:visible}
  .float__peek-mascot{position:absolute;right:0;bottom:calc(100% - 4px);display:block;width:54px;height:auto;max-width:none;user-select:none;pointer-events:auto}
  .float__peek:focus-visible{outline:2px solid #7394df;outline-offset:-3px}
  .float-dock-viewport:is(:hover,:has(:focus-visible),:has([data-svc-pop]:not([hidden]))) .float.float--search-ready.float--dock,
  .float-search-open .float-dock-viewport .float.float--search-ready.float--dock{transform:translateX(0);transition-delay:0s}
  .float-dock-viewport:is(:hover,:has(:focus-visible),:has([data-svc-pop]:not([hidden]))) .float__peek:not(:focus-visible),
  .float-search-open .float-dock-viewport .float__peek:not(:focus-visible){opacity:0}
  .float-dock-viewport:is(:hover,:has(:focus-visible),:has([data-svc-pop]:not([hidden]))) .float__mascot,
  .float-search-open .float-dock-viewport .float__mascot{opacity:1}
  .float-dock-viewport .float__pop::after{content:"";position:absolute;top:0;bottom:0;left:100%;width:17px}
}
@media(min-width:761px) and (hover:hover) and (pointer:fine) and (max-height:650px){.float-dock-viewport .float__peek{bottom:156px}}
@media(min-width:761px) and (max-width:1180px) and (hover:none){
  .float-dock-viewport{display:block;position:fixed;inset:0;z-index:150;contain:layout paint;overflow:hidden;pointer-events:none}
  .float-dock-viewport .float.float--search-ready.float--dock{right:0;width:88px;padding-right:16px;transform:translateX(100%);pointer-events:auto}
  .float-dock-viewport.is-open .float.float--search-ready.float--dock,.float-dock-viewport:has([data-svc-pop]:not([hidden])) .float.float--search-ready.float--dock,.float-search-open .float-dock-viewport .float.float--search-ready.float--dock{transform:translateX(0)}
  .float-dock-viewport .float__peek{position:absolute;right:0;bottom:32px;display:flex;align-items:center;justify-content:center;gap:3px;min-width:48px;min-height:48px;padding:9px;border:1px solid #dce5f3;border-right:0;border-radius:12px 0 0 12px;background:#fff;color:#2453c4;pointer-events:auto}
  .float-dock-viewport .float__peek-mascot{display:none}
  .float-dock-viewport .float__mascot{visibility:hidden}
  .float-dock-viewport.is-open .float__mascot,.float-dock-viewport:has([data-svc-pop]:not([hidden])) .float__mascot{visibility:visible}
  .float-dock-viewport .float__peek span{font-size:12px}
}
@media(min-width:761px) and (hover:hover) and (pointer:fine) and (max-height:430px){.float-dock-viewport .float__peek{bottom:102px}}
@media(min-width:761px) and (hover:hover) and (pointer:fine) and (max-height:430px){.float__peek-mascot{width:34px}}
@media(prefers-reduced-motion:reduce){.float-dock-viewport .float.float--search-ready.float--dock,.float-dock-viewport .float__peek,.float-dock-viewport .float__mascot{transition:none}}
.float-search-open{overflow:hidden}
.float-search:not([open]){display:none}
.float-search{position:fixed;inset:0;width:min(600px,calc(100vw - 40px));max-height:calc(100dvh - 40px);margin:auto;padding:40px;border:1px solid #dce6f6;border-radius:22px;background:linear-gradient(140deg,#f4f8ff,#fff 55%);color:#202a3e;box-shadow:0 24px 100px rgba(20,40,90,.24);overflow:auto}
.float-search::backdrop{background:rgba(19,36,67,.36);backdrop-filter:blur(4px)}
.float-search__close{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:#697891;cursor:pointer}
.float-search__close:hover{background:#eaf0fb;color:#244cb4}
.float-search h2{margin:0 38px 10px 0;font-size:27px;line-height:1.4;font-weight:650}
.float-search>p{margin:0;color:#67758d;font-size:14px;line-height:1.8}
.float-search__form{margin-top:26px}
.float-search__field{display:flex;gap:8px;align-items:center;padding:6px;border:1px solid #c7d5ef;border-radius:12px;background:#fff}
.float-search__field:focus-within{border-color:#4168c9;box-shadow:0 0 0 3px rgba(65,104,201,.12)}
.float-search__field input{width:100%;min-width:0;height:44px;padding:0 10px;border:0;outline:0;background:transparent;color:#202a3e;font:inherit;font-size:16px}
.float-search__field input::placeholder{color:#8390a6;font-size:13px}
.float-search__field button{flex:none;min-width:82px;min-height:44px;padding:10px 16px;border:0;border-radius:8px;background:#244cb4;color:#fff;font:inherit;font-size:15px;font-weight:600;cursor:pointer}
.float-search__field button:hover{background:#193b97}
.float-search__error{margin:10px 0 0;color:#b33636;font-size:13px;line-height:1.6}
.float-search__error[hidden]{display:none}
.float-search__examples{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:18px;font-size:13px}
.float-search__examples>span{margin-right:5px;color:#7c899f}
.float-search__examples a{display:inline-flex;align-items:center;min-height:38px;padding:6px 12px;border:1px solid #e0e7f3;border-radius:7px;color:#345ba8;background:#f6f9ff}
.float-search__examples a:hover{background:#eaf1ff;border-color:#afc4e9}
.float-search :is(button,a):focus-visible{outline:3px solid #97b5f1;outline-offset:3px}
@media(max-height:650px){.float.float--search-ready,.trial-visible .float.float--search-ready{bottom:16px}}
@media(max-height:650px){
  .float--crisp .float__panel{padding-block:10px}
  .float--crisp .float__action{height:52px}
  .float--crisp .float__mascot{top:16px;width:58px}
}
@media(max-height:430px){
  .float.float--search-ready,.trial-visible .float.float--search-ready{bottom:12px}
  .float--crisp .float__panel{gap:8px;padding-block:10px}
  .float--crisp .float__action{height:40px}
  .float--crisp .float__label,.float--crisp .float__mascot{display:none}
  .float--crisp .float__action+.float__action::before{top:-4px}
  .float--crisp .float__action>svg{width:23px;height:23px}
  .float--crisp .float__top{width:44px;height:44px;margin-right:10px}
}
@media(max-width:760px){.float-search{width:calc(100vw - 28px);padding:30px 20px;border-radius:18px}.float-search h2{font-size:23px}.float-search__field button{min-width:68px;padding-inline:12px}.float-search__field input::placeholder{font-size:12px}}
