/* aoyun.critical.css - 首屏关键样式 | 2026-01-14 | 变量由 tokens.css 提供 */

*,*::before,*::after{box-sizing:border-box}
html,body{overflow-x:hidden;margin:0;padding:0}
body{font-family:var(--font-family);background-color:var(--color-bg)}

.pb-skip{position:absolute;top:calc(var(--space-2)*-1);left:var(--space-4);z-index:var(--z-tooltip);padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-inverse);background-color:var(--color-primary);border-radius:var(--radius-md);transform:translateY(-100%);transition:transform var(--duration-200) var(--easing-in-out)}

.pb-skip:focus{transform:translateY(0)}

.pb-header{position:sticky;top:0;z-index:var(--z-sticky);background-color:var(--color-bg);border-bottom:1px solid var(--color-border)}

.pb-header.is-scrolled{background-color:var(--overlay-white-85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}

.pb-header__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);max-width:var(--container-2xl);height:64px;margin-inline:auto;padding-inline:var(--space-4)}

/* R17: pb-header__act 固定宽高，防止冷启动按钮/图标载入后宽度变化 */
.pb-header__act{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;min-width:48px;min-height:40px}

.pb-header__contact{display:none}

.pb-header__act .pb-header__contact{display:none}

/* R17: 移动端菜单按钮固定尺寸 */
.pb-header__menu{display:flex;align-items:center;justify-content:center;width:40px;height:40px;color:var(--color-text-secondary)}

.pb-brand{display:flex;align-items:center;gap:var(--space-3);min-width:0;overflow:hidden;text-decoration:none;color:inherit}

.pb-brand img{width:40px;height:40px;object-fit:contain}

.pb-brand__meta{display:flex;flex-direction:column}

.pb-brand__t{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text);line-height:var(--line-height-tight)}

.pb-brand__s{font-size:var(--font-size-xs);color:var(--color-text-muted)}

.pb-brand--compact .pb-brand__t{font-size:var(--font-size-md)}

.pb-burger{position:relative;display:block;width:20px;height:2px;background-color:currentColor;border-radius:var(--radius-full)}

.pb-burger::before,.pb-burger::after{content:'';position:absolute;left:0;width:100%;height:2px;background-color:currentColor;border-radius:var(--radius-full);transition:transform var(--duration-200) var(--easing-in-out)}

.pb-burger::before{top:-6px}

.pb-burger::after{bottom:-6px}

.is-open .pb-burger{background-color:transparent}

.is-open .pb-burger::before{transform:translateY(6px) rotate(45deg)}

.is-open .pb-burger::after{transform:translateY(-6px) rotate(-45deg)}

.pb-nav{position:fixed;top:0;right:0;z-index:var(--z-tooltip);display:flex;flex-direction:column;width:100%;max-width:320px;height:100vh;background-color:var(--color-bg);box-shadow:var(--shadow-2xl);transform:translateX(100%);transition:transform var(--duration-300) var(--easing-in-out);overflow-y:auto}

.pb-nav.is-open{transform:translateX(0)}

.pb-nav__head{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4);border-bottom:var(--space-px) solid var(--color-border)}

.pb-nav__list{display:flex;flex-direction:column;margin:0;padding:var(--space-4);list-style:none}

.pb-nav__item{border-bottom:var(--space-px) solid var(--color-border-light)}

.pb-nav__row{display:flex;align-items:center}

.pb-nav__link{flex:1;display:flex;align-items:center;padding:var(--space-3) 0;font-size:var(--font-size-md);font-weight:var(--font-weight-medium);color:var(--color-text);text-decoration:none}

.pb-nav__link:hover,.pb-nav__item.is-active>.pb-nav__row>.pb-nav__link{color:var(--color-primary)}

.pb-nav__toggle{flex-shrink:0}

.pb-nav__item.is-expanded .pb-nav__toggle{transform:rotate(180deg)}

.pb-nav__foot{margin-top:auto;padding:var(--space-4);border-top:var(--space-px) solid var(--color-border)}

.pb-nav__contact{width:100%}

.pb-nav__close{padding:.5rem;background:0 0;border:none;cursor:pointer}

.pb-nav__text{font-size:.875rem}

.pb-ico{display:inline-block;flex-shrink:0;width:var(--icon-md);height:var(--icon-md);vertical-align:middle;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.pb-ico--xs{width:var(--icon-xs);height:var(--icon-xs)}

.pb-ico--sm{width:var(--icon-sm);height:var(--icon-sm)}

.pb-ico--lg{width:var(--icon-lg);height:var(--icon-lg)}

.pb-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:40px;padding-inline:var(--space-4);font-family:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-none);text-decoration:none;white-space:nowrap;border:var(--space-px) solid transparent;border-radius:var(--radius-lg);cursor:pointer}

.pb-btn--primary{color:var(--color-text-inverse);background-color:var(--color-primary);border-color:var(--color-primary)}

.pb-btn--primary:hover{background-color:var(--color-primary-hover);border-color:var(--color-primary-hover)}

.pb-btn--icon{width:40px;padding:0;color:var(--color-text-secondary);background-color:transparent;border-color:transparent}

.pb-btn--icon:hover{color:var(--color-primary);background-color:var(--color-bg-tertiary)}

.pg-main{display:block;min-height:100vh}

.pg-container{width:100%;max-width:var(--container-xl);margin-inline:auto;padding-inline:var(--space-4)}

.pg-ico{display:inline-block;flex-shrink:0;width:var(--icon-md);height:var(--icon-md);vertical-align:middle;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.pg-ico--filled{fill:currentColor;stroke:none}

.pg-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:40px;padding-inline:var(--space-4);font-family:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-none);text-decoration:none;white-space:nowrap;border:1px solid transparent;border-radius:var(--radius-lg);cursor:pointer}

.pg-btn--xl{height:56px;padding-inline:var(--space-6);font-size:var(--font-size-lg);border-radius:var(--radius-xl)}

.pg-btn--primary{color:var(--color-text-inverse);background:var(--color-gradient-primary-shine);border-color:transparent;box-shadow:var(--shadow-sm),var(--inset-glow)}

.pg-btn--ghost{color:var(--color-text-inverse);background-color:var(--color-white-5);border-color:var(--color-border-glow);backdrop-filter:blur(8px)}

.pg-hero{position:relative;display:flex;align-items:center;min-height:600px;padding-block:var(--space-20);overflow:hidden;isolation:isolate}

.pg-hero--fullscreen{min-height:100vh;min-height:100dvh}

.pg-hero__bg{position:absolute;inset:0;z-index:var(--z-hide)}

.pg-hero__gradient{position:absolute;inset:0;background:var(--color-gradient-radial)}

.pg-hero__pattern{position:absolute;inset:0;background-image:radial-gradient(var(--color-white-10) 1px,transparent 1px);background-size:32px 32px;opacity:.3}

.pg-hero__content{position:relative;z-index:var(--z-base);max-width:800px}

.pg-hero__badge{display:inline-flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-6);padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-inverse);background:linear-gradient(135deg,var(--overlay-white-10) 0%,var(--overlay-white-05) 100%);border:1px solid var(--color-white-15);border-radius:var(--radius-full);backdrop-filter:blur(12px)}

.pg-hero__title{margin:0 0 var(--space-6);font-size:var(--font-size-4xl);font-weight:var(--font-weight-extrabold);line-height:var(--line-height-tight);letter-spacing:var(--tracking-tight);color:var(--color-text-inverse)}

.pg-hero__desc{margin:0 0 var(--space-8);font-size:var(--font-size-lg);line-height:var(--line-height-relaxed);color:var(--color-text-inverse-secondary)}

.pg-hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-4)}

.pg-hero__trust{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-6);margin-top:var(--space-12);padding-top:var(--space-8);border-top:1px solid var(--color-white-15)}

.pg-hero__trust-item{display:flex;flex-direction:column;gap:var(--space-1)}

.pg-hero__trust-num{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text-inverse)}

.pg-hero__trust-label{font-size:var(--font-size-sm);color:var(--color-text-inverse-secondary)}

@media(max-width:1023px){.pb-nav{position:fixed;overflow-x:hidden}

.pb-nav:not(.is-open){visibility:hidden}
body.nav-open{overflow:hidden;position:fixed;width:100%}
body.nav-open .pb-mobile-bar{display:none}}

@media(min-width:768px){.pb-header__inner{height:72px;padding-inline:var(--space-6)}

.pb-header__act .pb-header__menu{display:none}

.pb-header__act .pb-header__contact{display:inline-flex}

.pb-nav{position:static;flex-direction:row;width:auto;max-width:none;height:auto;background-color:transparent;box-shadow:none;transform:none;overflow:visible}

.pb-nav__head{display:none}

.pb-nav__list{flex-direction:row;gap:var(--space-1);padding:0}

.pb-nav__item{position:relative;border-bottom:none}

.pb-nav__link{padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);border-radius:var(--radius-md)}

.pb-nav__link:hover{background-color:var(--color-bg-secondary)}

.pb-nav__toggle{display:none}

.pb-nav__foot{display:none}

.pb-mobile-bar{display:none}

.pg-quicknav__inner{justify-content:center}}

@media(min-width:1024px){.pb-header__inner{padding-inline:var(--space-8)}}

/* R15: 首屏关键布局样式（防止冷启动CLS） */
.pb-breadcrumb{min-height:48px;max-width:var(--container-xl);margin-inline:auto;padding:var(--space-4);background-color:var(--color-bg-secondary);border-bottom:1px solid var(--color-border)}
.pb-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin:0;padding:0;list-style:none;font-size:var(--font-size-sm);line-height:1.5;min-height:24px}
.pb-breadcrumb__item{display:flex;align-items:center;gap:var(--space-2)}
.pb-breadcrumb__item:not(:last-child)::after{content:'/';display:inline-block;width:8px;text-align:center;color:var(--color-text-muted)}
.pb-breadcrumb__link{color:var(--color-text-secondary);text-decoration:none}
.pb-breadcrumb__current{color:var(--color-text);font-weight:var(--font-weight-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}
.pb-sortnav{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-2);min-height:56px;max-width:var(--container-xl);margin-inline:auto;padding:var(--space-4);background-color:var(--color-bg);border-bottom:1px solid var(--color-border)}
.pb-sortnav__link{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);text-decoration:none;background-color:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--radius-lg)}
.pb-sortnav__link.is-active,.pb-sortnav__link[aria-current="page"]{color:var(--color-text-inverse);background-color:var(--color-primary);border-color:var(--color-primary)}
.pd-article__header{min-height:80px;padding:var(--space-6);border-bottom:1px solid var(--color-border)}
.pd-article__title{margin:0 0 var(--space-4);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-snug);color:var(--color-text)}
.pd-article__meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4);font-size:var(--font-size-sm);color:var(--color-text-muted)}
.pl-page-header{min-height:100px;padding:var(--space-10) var(--space-4);text-align:center;background-color:var(--color-bg);border-bottom:1px solid var(--color-border)}
.pl-page-header__title{max-width:var(--container-lg);margin:0 auto var(--space-3);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--color-text)}
.pg-contact-card{display:flex;align-items:flex-start;gap:var(--space-4);min-height:80px;padding:var(--space-5);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-xl)}
.pg-contact-card__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:48px;height:48px;background-color:var(--color-primary-light);border-radius:var(--radius-lg);color:var(--color-primary)}
.tp-hero{min-height:120px;padding:var(--space-10) var(--space-4);text-align:center;background-color:var(--color-bg);border-bottom:1px solid var(--color-border)}
.tp-card{min-height:120px;background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg)}
.tp-index-card{display:flex;flex-direction:column;min-height:180px;padding:var(--space-5);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg)}
/* R15: 产品页关键布局 */
.pdt-hero{min-height:400px;padding:var(--space-2xl) 0;background:var(--color-bg-card)}
.pdt-hero__main-img{position:relative;aspect-ratio:1/1;background:var(--color-bg);border-radius:var(--radius-xl);overflow:hidden}
.pdt-hero__thumbs{display:flex;gap:var(--space-2);margin-top:var(--space-4)}
.pdt-hero__thumb{width:64px;height:64px;border-radius:var(--radius-md);overflow:hidden;border:2px solid var(--color-border);cursor:pointer}
.pdt-hero__thumb.is-active{border-color:var(--color-primary)}
.pd-faq-detail__header{position:relative;min-height:100px;padding:var(--space-6);padding-left:calc(var(--space-6) + var(--space-14));border-bottom:1px solid var(--color-border)}
