/* 动效只作用于呈现，不依赖动画控制内容的可见性。 */
.header { transition: background .35s, box-shadow .35s; }
.header.is-scrolled { background: #fafdfbf2; box-shadow: 0 5px 24px #163a2410; }
.reading-progress { position: absolute; height: 2px; background: linear-gradient(90deg,#18a97c,#8dd4ab); left: 0; right: 0; bottom: -1px; transform: scaleX(0); transform-origin: left; pointer-events: none; }
.button { position: relative; overflow: hidden; letter-spacing: .3px; }
.button::before { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg,transparent 20%,#ffffff20 50%,transparent 80%); transform: translateX(-120%); transition: transform .7s ease; pointer-events: none; }
.button:hover::before { transform: translateX(120%); }
.button:active { transform: translateY(0) scale(.97); }
.button.small { padding-left: 24px; padding-right: 24px; }
.text-link { text-decoration: underline; text-decoration-color: #109b7638; text-underline-offset: 6px; transition: text-decoration-color .25s,color .25s; }
.text-link:hover { text-decoration-color: currentColor; color: #07543e; }
.product-tabs .product-jump { transition: transform .35s,background .35s,box-shadow .35s,border-color .35s; }
.product-tabs .product-jump:hover { transform: translateY(-4px); box-shadow: 0 12px 24px #21482b0b; }
.product-browser { transform: translate3d(0,var(--image-shift,0px),0) rotate(var(--image-rotate,-1deg)); }
.product-browser img { transition: transform .8s cubic-bezier(.16,1,.3,1); }
.product-browser:hover img { transform: scale(1.018); }
.detail-gallery button img { transition: transform .8s cubic-bezier(.16,1,.3,1); }
.detail-gallery button:hover img { transform: scale(1.025); }
.detail-gallery button > span { transition: background .25s,box-shadow .25s; }
.detail-gallery button:hover > span { background: #fff; box-shadow: 0 4px 14px #153e2512; }
.capability-grid article { transition: background .35s,border-color .35s,box-shadow .35s; }
.capability-grid article:hover { background: #fff; border-color: #bad6c3; box-shadow: 0 12px 30px #193c2407; }
.detail-workflow li:not(:last-child)::after { content: ''; height: 4px; width: 4px; right: -2px; border-radius: 50%; background: #9ebca6; }
.hero-bottom > a { align-items: center; }
.hero-bottom > a::after { content: ''; width: 10px; height: 18px; border-radius: 8px; border: 1px solid #acc6b5; background: radial-gradient(circle at 50% 6px,#69a482 1px,transparent 2px); }
.product-reading-dock { position: fixed; z-index: 45; bottom: 24px; left: 50%; transform: translate(-50%,20px); opacity: 0; visibility: hidden; display: flex; align-items: center; gap: 20px; border: 1px solid #ffffffb3; border-radius: 50px; background: #183d31ed; backdrop-filter: blur(18px); box-shadow: 0 10px 36px #0a2d2530; color: #f2faf5; padding: 15px 23px; transition: opacity .35s,transform .45s cubic-bezier(.16,1,.3,1),visibility .35s; white-space: nowrap; }
.product-reading-dock.is-visible { transform: translate(-50%,0); opacity: 1; visibility: visible; }
.dock-index { font-size: 10px; color: #a9c6b6; border-right: 1px solid #ffffff24; padding-right: 17px; }
.dock-product { font-size: 11px; min-width: 125px; }
.dock-dots { display: flex; gap: 5px; }
.dock-dots i { display: block; height: 4px; width: 4px; border-radius: 5px; background: #ffffff35; transition: width .4s,background .4s; }
.dock-dots i.is-current { width: 15px; background: #a5e6be; }
.dock-next { font-size: 10px; color: #caf0d7; padding-left: 17px; border-left: 1px solid #ffffff24; }
.dock-index:hover,.dock-next:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 800px) {
  .product-browser { transform: none; }
  .product-reading-dock { padding: 13px 18px; bottom: max(15px,env(safe-area-inset-bottom)); gap: 14px; max-width: calc(100% - 28px); }
  .dock-dots { display: none; }
  .dock-product { font-size: 10px; min-width: 0; }
  .dock-index,.dock-next { font-size: 9px; }
  .dock-index { padding-right: 12px; }
  .dock-next { padding-left: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .product-browser,.hero-visual { transform: none !important; }
  .button::before { display: none; }
  .button:hover,.product-tabs .product-jump:hover,.product-browser:hover img,.detail-gallery button:hover img { transform: none; }
}