/* 留言弹窗标题中文字体（Figma: WenQuanYi Zen Hei，此处用 Noto Sans SC 替代） */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@500&display=swap');

/* ============================================================
   GLOBAL: Custom Properties & Reset
   设计基准：1920px 宽桌面端设计稿，1rem = 100px
   html font-size 通过 vw 实现流式缩放：5.208vw ≈ 100px@1920px
   ============================================================ */

/* --- CSS 自定义属性 --- */
:root {
  --c-primary:        #005a9e;
  --c-primary-light:  #a1c9ff;
  --c-primary-btn:    #1673c3;
  --c-dark:           #0f172a;
  --c-dark-2:         #020617;
  --c-text:           #181c21;
  --c-text-2:         #414751;
  --c-text-3:         #475569;
  --c-text-slate:     #94a3b8;
  --c-text-light:     #cbd5e1;
  --c-bg:             #f8f9ff;
  --c-bg-alt:         #f2f3fb;
  --c-bg-card:        #f1f5f9;
  --c-white:          #ffffff;
  --c-border:         #c1c7d3;
  --font-sans:        'Space Grotesk', sans-serif;
  --font-mono:        'Liberation Mono', 'Courier New', Courier, monospace;
  --transition:       0.25s ease;
}

/* --- Reset --- */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  /* 流式根字体：1rem = 100px @ 1920px 视口 */
  font-size: 5.208333vw;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

/* 超过 1920px 不再放大 */
@media (min-width: 1920px) {
  html { font-size: 100px; }
}

body {
  font-family: var(--font-sans);
  font-size: 0.16rem;
  line-height: 1.5;
  color: var(--c-text);
  background-color: var(--c-bg);
  overflow-x: hidden;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a { text-decoration: none; color: inherit; }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }

/* ============================================================
   BUTTONS（全局）
   ============================================================ */

.btn--primary {
  display: -webkit-inline-box;
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  gap: 0.08rem;
  background-color: var(--c-primary-btn);
  color: #f3f6ff;
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 700;
  padding: 0.205rem 0.4rem;
  line-height: 0.24rem;
  -webkit-transition: background-color var(--transition);
  transition: background-color var(--transition);
  white-space: nowrap;
}
.btn--primary:hover { background-color: #1261a8; }

.btn--outline {
  display: -webkit-inline-box;
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  border: 1px solid var(--c-border);
  color: var(--c-white);
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 700;
  padding: 0.21rem 0.41rem;
  line-height: 0.24rem;
  -webkit-transition: background-color var(--transition);
  transition: background-color var(--transition);
  white-space: nowrap;
}
.btn--outline:hover { background-color: rgba(255,255,255,0.1); }

.btn--specs {
  display: -webkit-inline-box;
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  gap: 0.08rem;
  background-color: var(--c-primary-btn);
  color: var(--c-white);
  font-family: var(--font-sans);
  font-size: 0.12rem;
  font-weight: 700;
  padding: 0.12rem 0.24rem;
  -webkit-transition: background-color var(--transition);
  transition: background-color var(--transition);
  white-space: nowrap;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.btn--specs:hover { background-color: #1261a8; }

.btn--contact {
  display: -webkit-inline-box;
  display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  gap: 0.16rem;
  background-color: var(--c-primary);
  color: var(--c-white);
  font-family: var(--font-sans);
  font-size: 0.18rem;
  font-weight: 700;
  padding: 0.24rem 0.48rem;
  -webkit-transition: background-color var(--transition);
  transition: background-color var(--transition);
  white-space: nowrap;
}
.btn--contact:hover { background-color: #004d87; }

.btn__icon    { width: 0.15rem;  height: 0.15rem;  -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
.btn__icon-sm { width: 0.099rem; height: 0.099rem; -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
.btn__icon-lg { width: 0.184rem; height: 0.184rem; -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }

/* ============================================================
   SECTION HEADER（共享）
   ============================================================ */
.section-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.24rem;
  width: 100%;
}
.section-header__title {
  font-family: var(--font-sans);
  font-size: 0.48rem;
  font-weight: 700;
  color: var(--c-text);
  text-align: center;
  letter-spacing: -0.024rem;
  line-height: 1;
}
.section-header__line {
  width: 0.8rem;
  height: 0.04rem;
  background-color: var(--c-primary);
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

/* ============================================================
   TOP NAVIGATION BAR
   ============================================================ */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  height: 1rem;
  background-color: var(--c-bg);
  border-bottom: 1px solid rgba(148,163,184,0.15);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.nav__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  max-width: 14rem;
  margin: 0 auto;
  padding: 0 0.48rem;
  height: 100%;
}

/* Logo (image version) */
.nav__logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.nav__logo-img {
  height: 0.56rem;
  width: auto;
  -o-object-fit: contain;
  object-fit: contain;
  display: block;
}
/* Fallback text logo for pages without image */
.nav__logo-text {
  font-family: var(--font-sans);
  font-size: 0.09rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: 0.01rem;
  line-height: 1.2;
  text-transform: uppercase;
}

/* Nav links */
.nav__links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.32rem;
  height: 100%;
}
.nav__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
}
.nav__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.04rem;
  font-family: var(--font-sans);
  font-size: 0.14rem;
  font-weight: 400;
  color: var(--c-text-3);
  letter-spacing: -0.0035rem;
  text-transform: uppercase;
  padding-bottom: 0.04rem;
  white-space: nowrap;
  -webkit-transition: color var(--transition);
  transition: color var(--transition);
}
.nav__item--active .nav__link {
  font-weight: 700;
  color: var(--c-primary);
  border-bottom: 2px solid var(--c-primary);
  padding-bottom: 0.06rem;
}
.nav__link:hover { color: var(--c-primary); }
.nav__chevron { width: 0.057rem; height: 0.034rem; -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }

/* Right controls */
.nav__controls {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.24rem;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.nav__search { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.nav__search-input {
  width: 1.92rem;
  background-color: var(--c-bg-card);
  border: none;
  outline: none;
  font-family: var(--font-sans);
  font-size: 0.12rem;
  color: #6b7280;
  padding: 0.08rem 0.4rem 0.08rem 0.16rem;
  line-height: normal;
}
.nav__search-input::-webkit-input-placeholder { color: #6b7280; }
.nav__search-input::-moz-placeholder { color: #6b7280; }
.nav__search-input:-ms-input-placeholder { color: #6b7280; }
.nav__search-input::placeholder { color: #6b7280; }
.nav__search-icon { position: absolute; right: 0.08rem; width: 0.129rem; height: 0.129rem; pointer-events: none; -o-object-fit: contain; object-fit: contain; }
.nav__search-submit {
  position: absolute;
  right: 0.04rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  border: 0;
  padding: 0.06rem 0.08rem;
  margin: 0;
  background: transparent;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  line-height: 0;
}
.nav__search-submit:focus-visible { outline: 2px solid var(--c-primary); outline-offset: 2px; border-radius: 2px; }
.nav__search-suggest {
  position: absolute;
  top: calc(100% + 0.04rem);
  left: 0;
  min-width: 100%;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  max-width: 4.8rem;
  max-height: 3.2rem;
  overflow-y: auto;
  z-index: 500;
  background-color: var(--c-white);
  border: 1px solid rgba(193,199,211,0.45);
  border-radius: 0.06rem;
  -webkit-box-shadow: 0 0.12rem 0.32rem rgba(22, 35, 54, 0.12);
  box-shadow: 0 0.12rem 0.32rem rgba(22, 35, 54, 0.12);
}
.nav__search-suggest-list { list-style: none; margin: 0; padding: 0; }
.nav__search-suggest-item {
  display: block;
  padding: 0.12rem 0.16rem;
  font-family: var(--font-sans);
  font-size: 0.12rem;
  font-weight: 600;
  color: var(--c-text);
  text-decoration: none;
  border-bottom: 1px solid rgba(193,199,211,0.2);
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 4.8rem;
}
.nav__search-suggest-list li:last-child .nav__search-suggest-item { border-bottom: none; }
.nav__search-suggest-item:hover { background-color: rgba(0,90,158,0.06); color: var(--c-primary); }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.page--product-search .product-search { margin-top: 0.8rem; min-height: 50vh; padding: 0.64rem 2.6rem 0.96rem; background-color: var(--c-bg); }
.product-search__container { max-width: 14rem; margin: 0 auto; padding: 0 0.48rem; }
.product-search__heading { font-family: var(--font-sans); font-size: 0.36rem; font-weight: 700; color: var(--c-text); margin: 0 0 0.32rem; }
.product-search__form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.16rem; margin-bottom: 0.4rem; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.product-search__input {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 3.2rem;
  flex: 1 1 3.2rem;
  max-width: 6rem;
  padding: 0.12rem 0.16rem;
  border: 1px solid rgba(193,199,211,0.5);
  border-radius: 0.06rem;
  font-family: var(--font-sans);
  font-size: 0.14rem;
}
.product-search__submit {
  padding: 0.12rem 0.28rem;
  border: 0;
  border-radius: 0.06rem;
  background-color: var(--c-primary-btn);
  color: var(--c-white);
  font-family: var(--font-sans);
  font-size: 0.14rem;
  font-weight: 700;
  cursor: pointer;
}
.product-search__hint,
.product-search__empty { font-family: var(--font-sans); font-size: 0.14rem; color: var(--c-text-2); margin: 0.16rem 0; }
.product-search__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(193,199,211,0.25); }
.product-search__item { border-bottom: 1px solid rgba(193,199,211,0.2); }
.product-search__link {
  display: block;
  padding: 0.2rem 0.08rem;
  text-decoration: none;
  color: inherit;
}
.product-search__link:hover { background-color: rgba(0,90,158,0.04); }
.product-search__name { display: block; font-family: var(--font-sans); font-size: 0.16rem; font-weight: 700; color: var(--c-text); }
.product-search__slug { display: block; font-family: var(--font-mono); font-size: 0.1rem; color: var(--c-text-3); margin-top: 0.04rem; text-transform: uppercase; }
.product-search__snippet { display: block; font-family: var(--font-sans); font-size: 0.12rem; color: var(--c-text-2); margin-top: 0.08rem; line-height: 1.5; }

.nav__lang { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.08rem; }
.nav__lang-btn { font-family: var(--font-sans); font-size: 0.12rem; font-weight: 700; color: var(--c-text-3); -webkit-transition: color var(--transition); transition: color var(--transition); }
.nav__lang-btn--active { color: var(--c-primary); border-bottom: 1px solid var(--c-primary); padding-bottom: 1px; }
.nav__lang-sep { font-family: var(--font-sans); font-size: 0.12rem; font-weight: 700; color: var(--c-text-light); }

/* Mobile hamburger */
.nav__hamburger {
  display: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 5px;
  width: 0.28rem;
  padding: 0.05rem;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.nav__hamburger span {
  display: block;
  height: 2px;
  background-color: var(--c-text);
  border-radius: 2px;
  -webkit-transition: -webkit-transform var(--transition), opacity var(--transition);
  transition: transform var(--transition), opacity var(--transition);
}

/* ============================================================
   INDEX PAGE: HERO SECTION
   ============================================================ */
.hero {
  position: relative;
  height: 9.21rem;
  background-color: var(--c-dark);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  overflow: hidden;
  margin-top: 1rem;
}
.hero__bg { position: absolute; inset: 0; pointer-events: none; }
.hero__bg-img {
  position: absolute;
  width: 100%; height: 208.47%;
  top: -54.23%; left: 0;
  -o-object-fit: cover; object-fit: cover;
  opacity: 0.4;
  max-width: none;
}
.hero__bg-grid {
  position: absolute; inset: 0; opacity: 0.3;
  background-image:
    linear-gradient(90deg,  rgba(0,90,158,0.05) 2.5%, rgba(0,90,158,0) 2.5%),
    linear-gradient(180deg, rgba(0,90,158,0.05) 2.5%, rgba(0,90,158,0) 2.5%);
  background-size: 40px 40px;
}
.hero__bg-gradient {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, #020617 0%, rgba(2,6,23,0.4) 50%, rgba(2,6,23,0) 100%);
}
.hero__container {
  position: relative; z-index: 1;
  width: 100%; max-width: 14rem;
  margin: 0 auto; padding: 0 0.48rem;
}
.hero__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.24rem; max-width: 7.68rem; }
.hero__divider { width: 0.48rem; height: 1px; background-color: var(--c-primary); }
.hero__heading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
.hero__heading-white,
.hero__heading-blue {
  font-family: var(--font-sans);
  font-size: 0.96rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.048rem;
  display: block;
}
.hero__heading-white { color: var(--c-white); }
.hero__heading-blue  { color: var(--c-primary-light); }
.hero__desc {
  font-family: var(--font-sans);
  font-size: 0.2rem; font-weight: 300;
  color: var(--c-text-light); line-height: 1.625;
  padding-top: 0.08rem; max-width: 5.76rem;
}
.hero__buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.16rem;
  padding-top: 0.16rem;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

/* ============================================================
   INDEX PAGE: ABOUT US SECTION
   ============================================================ */
.about {
  background-color: var(--c-white);
  padding: 0.96rem 3.08rem;
  overflow: hidden;
}
.about__container {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 0.64rem 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 0 0.64rem;
  max-width: 14rem; margin: 0 auto;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: 6.96rem;
}
.about__text { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.16rem; }
.about__divider { width: 100%; height: 1px; background-color: var(--c-border); opacity: 0.2; }
.about__heading { font-family: var(--font-sans); font-size: 0.36rem; font-weight: 700; color: var(--c-text); line-height: 1.11; letter-spacing: -0.009rem; }
.about__paragraphs { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.24rem; padding-top: 0.16rem; }
.about__paragraphs p { font-family: var(--font-sans); font-size: 0.16rem; font-weight: 400; color: var(--c-text-2); line-height: 1.5; }
.about__stats { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.24rem; padding-top: 0.24rem; }
.about__stat { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; }
.about__stat-value { font-family: var(--font-sans); font-size: 0.24rem; font-weight: 700; color: var(--c-primary); line-height: 1.33; }
.about__stat-label { font-family: var(--font-mono); font-size: 0.1rem; font-style: normal; font-weight: 400; color: var(--c-text); letter-spacing: 0.01rem; text-transform: uppercase; opacity: 0.6; }
.about__stat-sep { width: 1px; height: 0.4rem; background-color: var(--c-border); opacity: 0.2; -ms-flex-negative: 0; flex-shrink: 0; }
.about__image-col { position: relative; }
.about__image-frame { position: relative; }
.about__image-frame::before {
  content: '';
  position: absolute;
  top: -0.16rem; right: -0.16rem;
  bottom: 0.16rem; left: 0.16rem;
  border: 1px solid rgba(0,90,158,0.2);
  pointer-events: none; z-index: 0;
}
.about__image-inner { position: relative; background-color: var(--c-bg-card); overflow: hidden; z-index: 1; aspect-ratio: 4/3; }
.about__image {
  display: block; width: 100%; height: 133.33%;
  -o-object-fit: cover; object-fit: cover;
  -o-object-position: center; object-position: center;
  /*-webkit-filter: saturate(0); filter: saturate(0);*/
  margin-top: -16.67%;
}
.about__image-caption {
  position: absolute; bottom: 0; left: 0;
  background-color: rgba(0,90,158,0.9);
  padding: 0.16rem;
  font-family: var(--font-mono); font-size: 0.1rem; color: var(--c-white);
  letter-spacing: 0.005rem; white-space: nowrap; line-height: 1.5;
}

/* ============================================================
   INDEX PAGE: BUSINESS PILLARS SECTION
   ============================================================ */
.pillars { background-color: var(--c-bg); padding: 0.96rem 2.6rem; }
.pillars__container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.64rem; max-width: 14rem; margin: 0 auto; padding: 0 0.48rem; }
.pillars__grid { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 0.24rem 1fr 0.24rem 1fr 0.24rem 1fr 0.24rem 1fr; grid-template-columns: repeat(5,1fr); gap: 0.24rem; width: 100%; }
.pillar-card { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 3.96rem; background-color: var(--c-white); border: 1px solid rgba(193,199,211,0.3); overflow: hidden; }
a.pillar-card--link { color: inherit; text-decoration: none; cursor: pointer; -webkit-box-sizing: border-box; box-sizing: border-box; }
a.pillar-card--link:focus-visible { outline: 2px solid var(--c-primary-btn); outline-offset: 2px; }
.pillar-card--active { -webkit-box-shadow: inset 0 0 0 1px var(--c-white), inset 0 0 0 3px var(--c-primary); box-shadow: inset 0 0 0 1px var(--c-white), inset 0 0 0 3px var(--c-primary); }
.pillar-card:hover,
a.pillar-card--link:hover { -webkit-box-shadow: inset 0 0 0 1px var(--c-white), inset 0 0 0 3px var(--c-primary); box-shadow: inset 0 0 0 1px var(--c-white), inset 0 0 0 3px var(--c-primary); }
.pillar-card__image-wrap { position: relative; width: 100%; height: 1.6rem; background-color: var(--c-bg-card); overflow: hidden; -ms-flex-negative: 0; flex-shrink: 0; }
.pillar-card__image { display: block; width: 110%; height: 164.72%; -o-object-fit: cover; object-fit: cover;}
.pillar-card__badge { position: absolute; top: 0.12rem; left: 0.12rem; background-color: var(--c-primary); color: var(--c-white); font-family: var(--font-sans); font-size: 0.09rem; font-weight: 700; padding: 0.02rem 0.06rem; line-height: 1.5; white-space: nowrap; }
.pillar-card__body { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.152rem; padding: 0.24rem 0.24rem 0; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; min-width: 0; }
.pillar-card__title { font-family: var(--font-sans); font-size: 0.18rem; font-weight: 700; color: var(--c-text); letter-spacing: -0.0045rem; line-height: 1.56; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pillar-card__desc { font-family: var(--font-sans); font-size: 0.12rem; font-weight: 400; color: var(--c-text-2); line-height: 1.625; min-width: 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow-wrap: anywhere; }
.pillar-card__tags { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 0.06rem; margin-top: 0.02rem; }
.pillar-card__tag { display: inline-block; background-color: rgba(0,90,158,0.1); border: 1px solid rgba(0,90,158,0.2); color: var(--c-primary); font-family: var(--font-sans); font-size: 0.09rem; font-weight: 700; padding: 0.02rem 0.09rem; line-height: 1.5; white-space: nowrap; }
.pillar-card__footer { border-top: 1px solid rgba(193,199,211,0.1); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0.13rem 0.12rem 0.12rem; margin-top: auto; }
.pillar-card__link { font-family: var(--font-sans); font-size: 0.1rem; font-weight: 700; color: var(--c-primary); text-transform: uppercase; line-height: 1.5; -webkit-transition: opacity var(--transition); transition: opacity var(--transition); }
.pillar-card:hover .pillar-card__link,
a.pillar-card--link:hover .pillar-card__link { opacity: 0.7; }

/* ============================================================
   INDEX PAGE: PRODUCT MATRIX SECTION
   ============================================================ */
.products { background-color: var(--c-bg-alt); padding: 0.96rem 2.6rem; position: relative; }
.products::before,
.products::after { content: ''; position: absolute; left: 0; right: 0; height: 1px; background-color: rgba(193,199,211,0.2); pointer-events: none; }
.products::before { top: 25%; }
.products::after  { top: 75%; }
.products__container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.64rem; max-width: 14rem; margin: 0 auto; padding: 0 0.48rem; position: relative; z-index: 1; }
.products__grid { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr 1fr 1fr; grid-template-columns: repeat(4,1fr); border: 1px solid rgba(193,199,211,0.2); width: 100%; }
.product-card { position: relative; aspect-ratio: 3/4; background-color: var(--c-white); overflow: hidden; border-right: 1px solid rgba(193,199,211,0.2); cursor: pointer; }
a.product-card--link { display: block; color: inherit; text-decoration: none; -webkit-box-sizing: border-box; box-sizing: border-box; }
a.product-card--link:focus-visible { outline: 2px solid var(--c-primary-light); outline-offset: 2px; }
.product-card:last-child { border-right: none; }
.product-card__bg { position: absolute; inset: 0; background-color: var(--c-dark); overflow: hidden; }
.product-card__img { width: 133.74%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: 0.6; display: block; -webkit-transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; }
.product-card:hover .product-card__img { -webkit-transform: scale(1.03); transform: scale(1.03); }
.product-card__accent { position: absolute; bottom: 0; left: 0; right: 0; height: 0.04rem; background-color: var(--c-primary); z-index: 3; opacity: 0; -webkit-transition: opacity var(--transition); transition: opacity var(--transition); }
.product-card--active .product-card__accent,
.product-card:hover .product-card__accent { opacity: 1; }
.product-card__content { position: absolute; inset: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0.32rem; z-index: 2; -webkit-transition: opacity var(--transition); transition: opacity var(--transition); }
.product-card--active .product-card__content,
.product-card:hover .product-card__content { opacity: 0; pointer-events: none; }
.product-card__num { font-family: var(--font-mono); font-size: 0.3rem; font-weight: 700; color: rgba(255,255,255,0.2); line-height: 1.2; display: block; }
.product-card__info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.08rem; }
.product-card__title { font-family: var(--font-sans); font-size: 0.24rem; font-weight: 700; color: var(--c-white); line-height: 1.33; min-width: 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow-wrap: anywhere; }
.product-card__desc { font-family: var(--font-sans); font-size: 0.14rem; font-weight: 400; color: var(--c-text-light); line-height: 1.43; min-width: 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow-wrap: anywhere; }
.product-card__overlay { position: absolute; inset: 0; background-color: rgba(0,28,56,0.9); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0.32rem; gap: 0.24rem; z-index: 4; opacity: 0; -webkit-transition: opacity var(--transition); transition: opacity var(--transition); }
.product-card--active .product-card__overlay,
.product-card:hover .product-card__overlay { opacity: 1; }
.product-card__specs { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.05rem; }
.product-card__spec-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-bottom: 0.05rem; border-bottom: 1px solid rgba(255,255,255,0.1); }
.product-card__spec-key { font-family: var(--font-mono); font-size: 0.1rem; font-weight: 400; color: var(--c-primary-light); letter-spacing: 0.005rem; text-transform: uppercase; line-height: 1.5; }
.product-card__spec-val { font-family: var(--font-mono); font-size: 0.1rem; font-weight: 400; color: var(--c-white); letter-spacing: 0.005rem; text-transform: uppercase; line-height: 1.5; }
.product-card__spec-row--wide .product-card__spec-val { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: left; text-transform: none; }
span.btn--specs { pointer-events: none; }

/* ============================================================
   INDEX PAGE: CONTACT US SECTION
   Bento：左侧 CTA 大卡纵向占满，右侧 2×2 统计小卡（参考布局稿）
   ============================================================ */
.contact {
  position: relative;
  background: linear-gradient(118deg, rgba(0, 90, 158, 0.92) 0%, rgba(61, 143, 217, 0.65) 35%, rgba(180, 215, 240, 0.5) 65%, rgba(232, 244, 252, 0.98) 100%);
  padding: 1.28rem 2.6rem;
  overflow: hidden;
}
.contact__bg-grid {
  position: absolute;
  inset: 0;
  opacity: 0.06;
  background-image: linear-gradient(90deg, rgba(255,255,255,0.08) 2.5%, rgba(255,255,255,0) 2.5%), linear-gradient(180deg, rgba(255,255,255,0.08) 2.5%, rgba(255,255,255,0) 2.5%);
  background-size: 40px 40px;
  pointer-events: none;
}
.contact__container {
  position: relative;
  z-index: 1;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 0.24rem 1fr 0.24rem 1fr;
  grid-template-columns: repeat(3, 1fr);
  -ms-grid-rows: 1fr 0.24rem 1fr;
  grid-template-rows: repeat(2, minmax(1.4rem, auto));
  gap: 0.24rem;
  max-width: 14rem;
  margin: 0 auto;
  padding: 0.24rem;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  min-height: 3.52rem;
  border-radius: 0.04rem;
  background: linear-gradient(118deg, rgba(61, 143, 217, 0.35) 0%, rgba(180, 215, 240, 0.22) 55%, rgba(255, 255, 255, 0.12) 100%);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.contact__left {
  -ms-grid-column: 1;
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  grid-column: 1;
  grid-row: 1 / span 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.32rem;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-height: calc(1.4rem * 2 + 0.24rem);
  padding: 0.48rem 0.4rem;
  background-color: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(24, 28, 33, 0.28);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
.contact__heading { font-family: var(--font-sans); font-size: 0.6rem; font-weight: 700; color: var(--c-text); line-height: 1; letter-spacing: -0.03rem; }
.contact__desc { font-family: var(--font-sans); font-size: 0.18rem; font-weight: 400; color: var(--c-text-2); line-height: 1.56; max-width: none; padding-bottom: 0.08rem; }
.contact__stats {
  -ms-grid-column: 3;
  -ms-grid-column-span: 3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 3;
  grid-column: 2 / span 2;
  grid-row: 1 / span 2;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 0.24rem 1fr;
  grid-template-columns: 1fr 1fr;
  -ms-grid-rows: 1fr 0.24rem 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 0.24rem;
  height: 100%;
  min-height: calc(1.4rem * 2 + 0.24rem);
}
.contact__stat {
  background-color: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(24, 28, 33, 0.28);
  padding: 0.33rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.08rem;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-height: 1.4rem;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
.contact__stat-value { font-family: var(--font-sans); font-size: 0.3rem; font-weight: 700; color: var(--c-primary); line-height: 1.2; }
.contact__stat-label { font-family: var(--font-mono); font-size: 0.12rem; font-weight: 400; color: var(--c-text-2); letter-spacing: 0.012rem; text-transform: uppercase; line-height: 1.33; }

/* ============================================================
   LEGAL SIMPLE PAGES（隐私政策 / 法律声明）
   ============================================================ */
.page--legal-simple .legal-simple { margin-top: 0.8rem; min-height: 50vh; padding: 0.64rem 2.6rem 0.96rem; background-color: var(--c-bg); }
.legal-simple__container { max-width: 14rem; margin: 0 auto; padding: 0 0.48rem; }
.legal-simple__title { font-family: var(--font-sans); font-size: 0.36rem; font-weight: 700; color: var(--c-text); letter-spacing: -0.01rem; line-height: 1.25; margin: 0 0 0.4rem; padding-bottom: 0.24rem; border-bottom: 1px solid rgba(193,199,211,0.35); }
.legal-simple__body { font-family: var(--font-sans); font-size: 0.14rem; font-weight: 400; color: var(--c-text-2); line-height: 1.65; max-width: 9.6rem; }
.legal-simple__body p { margin: 0 0 0.2rem; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer { background-color: var(--c-bg-alt); border-top: 1px solid rgba(193,199,211,0.2); padding: 0.65rem 2.685rem 0.32rem; }
.footer__container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.64rem; max-width: 14rem; margin: 0 auto; padding: 0 0.48rem; }
.footer__grid { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 0.48rem 1fr 0.48rem 1fr 0.48rem 1fr; grid-template-columns: repeat(4,1fr); gap: 0 0.48rem; }
.footer__col { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.24rem; }
.footer__company-name { font-family: var(--font-sans); font-size: 0.2rem; font-weight: 700; color: var(--c-text); letter-spacing: -0.01rem; line-height: 1.4; }
.footer__contact-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.16rem; }
.footer__contact-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: flex-start; -ms-flex-align: start; align-items: flex-start; gap: 0.12rem; }
.footer__contact-icon { -ms-flex-negative: 0; flex-shrink: 0; margin-top: 2px; -o-object-fit: contain; object-fit: contain; }
.footer__contact-item span { font-family: var(--font-sans); font-size: 0.14rem; font-weight: 400; color: var(--c-text-2); line-height: 1.43; }
.footer__contact-rich { word-break: break-word; }
.footer__contact-rich--phones .footer__phone-block { display: block; margin-bottom: 0.12rem; }
.footer__contact-rich--phones .footer__phone-block:last-child { margin-bottom: 0; }
.footer__phone-sub { font-size: 0.9em; opacity: 0.9; }
.footer__contact-rich--emails .footer__email-line { display: block; margin-bottom: 0.06rem; }
.footer__contact-rich--emails .footer__email-line:last-child { margin-bottom: 0; }
.footer__col-title { font-family: var(--font-sans); font-size: 0.12rem; font-weight: 700; color: var(--c-primary); letter-spacing: 0.024rem; text-transform: uppercase; line-height: 1.33; }
.footer__links { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.12rem; }
.footer__link { font-family: var(--font-sans); font-size: 0.14rem; font-weight: 400; color: var(--c-text-2); letter-spacing: 0.007rem; text-transform: uppercase; line-height: 1.43; -webkit-transition: color var(--transition); transition: color var(--transition); }
.footer__link:hover { color: var(--c-primary); }
.footer__social { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 0.16rem; }
.footer__social-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 0.4rem; height: 0.4rem; border: 1px solid var(--c-border); -webkit-transition: border-color var(--transition), background-color var(--transition); transition: border-color var(--transition), background-color var(--transition); }
.footer__social-link:hover { border-color: var(--c-primary); background-color: rgba(0,90,158,0.05); }
.footer__social-link img { max-width: 0.19rem; max-height: 0.19rem; -o-object-fit: contain; object-fit: contain; }
.footer__bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding-top: 0.33rem; border-top: 1px solid rgba(193,199,211,0.1); -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 0.16rem; }
.footer__copyright { font-family: var(--font-mono); font-size: 0.1rem; font-weight: 400; color: #717783; letter-spacing: 0.01rem; text-transform: uppercase; white-space: nowrap; line-height: 1.5; }
.footer__bottom-right { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.24rem; }
.footer__icp { font-family: var(--font-mono); font-size: 0.1rem; font-weight: 400; color: #717783; letter-spacing: 0.01rem; text-transform: uppercase; white-space: nowrap; line-height: 1.5; }
.footer__bottom-divider { width: 1px; height: 0.12rem; background-color: rgba(193,199,211,0.3); -ms-flex-negative: 0; flex-shrink: 0; }
.footer__status { font-family: var(--font-mono); font-size: 0.1rem; font-weight: 700; color: var(--c-text-2); letter-spacing: 0.01rem; text-transform: uppercase; white-space: nowrap; line-height: 1.5; }

/* ============================================================
   FLOATING ACTION BUTTON
   ============================================================ */
.fab {
  position: fixed;
  bottom: 0.4rem; right: 0.4rem;
  z-index: 200;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.12rem;
  background-color: var(--c-primary-btn);
  color: var(--c-white);
  padding: 0.2rem 0.32rem;
  border-radius: 0.08rem;
  -webkit-box-shadow: 0 15px 17.5px rgba(22,115,195,0.3);
  box-shadow: 0 15px 17.5px rgba(22,115,195,0.3);
  font-family: var(--font-sans);
  font-size: 0.14rem;
  font-weight: 700;
  letter-spacing: 0.007rem;
  text-transform: uppercase;
  -webkit-transition: background-color var(--transition), -webkit-box-shadow var(--transition);
  transition: background-color var(--transition), box-shadow var(--transition);
  white-space: nowrap;
}
.fab:hover { background-color: #1261a8; -webkit-box-shadow: 0 20px 25px rgba(22,115,195,0.4); box-shadow: 0 20px 25px rgba(22,115,195,0.4); }
.fab__icon { width: 0.16rem; height: 0.186rem; -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
button.fab { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
a.fab { text-decoration: none; cursor: pointer; color: #fff; }

/* ============================================================
   联系留言弹窗（Figma: PYwjZ0s5ar5gTuWV8I9uLU 节点 1:2 / 1:3）
   ============================================================ */
body:has(#contactModal.contact-modal--open) {
  overflow: hidden;
}
.contact-modal {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0.24rem;
}
/* 仅用 .contact-modal--open 控制显示，避免关闭后 hash 未清时 :target 仍匹配导致关不掉 */
#contactModal.contact-modal.contact-modal--open {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.contact-modal__backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: var(--c-dark-2);
  /* Figma: linear 叠加白层，等效为纯色底 */
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font: inherit;
  color: inherit;
  display: block;
}
.contact-modal__panel-close {
  position: absolute;
  top: 0.14rem;
  right: 0.14rem;
  z-index: 10;
  margin: 0;
  padding: 0.06rem 0.12rem;
  font-family: var(--font-sans);
  font-size: 0.28rem;
  font-weight: 400;
  line-height: 1;
  color: var(--c-text-2);
  text-decoration: none;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.contact-modal__panel-close:hover {
  color: var(--c-text);
}
.contact-modal__form-msg {
  grid-column: 1 / -1;
  margin: 0 0 0.12rem;
  padding: 0;
  font-family: var(--font-sans);
  font-size: 0.12rem;
  line-height: 1.45;
  min-height: 0.18rem;
}
.contact-modal__req {
  color: #b91c1c;
  font-weight: 700;
}
.contact-modal__panel {
  position: relative;
  z-index: 1;
  -webkit-box-flex: 0;
  -ms-flex: 0 1 8.96rem;
  flex: 0 1 8.96rem;
  max-width: 8.96rem;
  width: 100%;
  min-height: 6.35rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: var(--c-white);
  border: 1px solid rgba(193, 199, 211, 0.3);
  -webkit-box-shadow: 0 0.4rem 0.4rem rgba(0, 0, 0, 0.5);
  box-shadow: 0 0.4rem 0.4rem rgba(0, 0, 0, 0.5);
  padding: 0.49rem;
}
.contact-modal__bracket {
  position: absolute;
  width: 0.16rem;
  height: 0.16rem;
  border-color: #005a9e;
  border-style: solid;
  pointer-events: none;
}
.contact-modal__bracket--tl { left: -1px; top: -1px; border-width: 2px 0 0 2px; }
.contact-modal__bracket--br { right: -1px; bottom: -0.5px; border-width: 0 2px 2px 0; opacity: 0.2; }
.contact-modal__content {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 0.48rem;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}
.contact-modal__left {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 2.5rem;
  flex: 0 0 2.5rem;
  min-width: 0;
  padding-top: 0.006rem;
}
.contact-modal__title {
  font-family: 'Noto Sans SC', 'Microsoft YaHei', sans-serif;
  font-size: 0.3rem;
  font-weight: 500;
  line-height: 0.36rem;
  letter-spacing: -0.015rem;
  color: var(--c-text);
  margin: 0;
}
.contact-modal__form {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.4rem 0.32rem;
  -webkit-box-flex: 0;
  -ms-flex: 0 1 5rem;
  flex: 0 1 5rem;
  width: 5rem;
  max-width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  min-width: 0;
}
.contact-modal__field { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.04rem; }
.contact-modal__field--full { -ms-grid-column: 1; -ms-grid-column-span: 2; grid-column: 1 / -1; }
.contact-modal__field--submit { padding-top: 0.24rem; }
.contact-modal__label {
  font-family: var(--font-sans);
  font-size: 0.1rem;
  font-weight: 700;
  line-height: 0.15rem;
  letter-spacing: 0.01rem;
  text-transform: uppercase;
  color: var(--c-text-2);
}
.contact-modal__input,
.contact-modal__textarea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  border: 1px solid var(--c-border);
  padding: 0.1rem 0.13rem;
  font-family: var(--font-sans);
  font-size: 0.14rem;
  font-weight: 400;
  color: var(--c-text);
  background: var(--c-white);
  border-radius: 0;
}
.contact-modal__input::-webkit-input-placeholder { color: #6b7280; }
.contact-modal__input::-moz-placeholder { color: #6b7280; }
.contact-modal__input:-ms-input-placeholder { color: #6b7280; }
.contact-modal__input::placeholder { color: #6b7280; }
.contact-modal__textarea { min-height: 1.18rem; resize: vertical; line-height: 0.2rem; }
.contact-modal__textarea::-webkit-input-placeholder { color: #6b7280; }
.contact-modal__textarea::-moz-placeholder { color: #6b7280; }
.contact-modal__textarea:-ms-input-placeholder { color: #6b7280; }
.contact-modal__textarea::placeholder { color: #6b7280; }
.contact-modal__select-wrap {
  position: relative;
  width: 100%;
}
.contact-modal__select {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 1px solid var(--c-border);
  padding: 0.09rem 0.41rem 0.09rem 0.13rem;
  font-family: var(--font-sans);
  font-size: 0.14rem;
  line-height: 0.2rem;
  color: var(--c-text);
  background: var(--c-white);
  border-radius: 0;
  min-height: 0.4rem;
}
.contact-modal__select-chevron {
  position: absolute;
  right: 0.09rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 0.21rem;
  height: 0.21rem;
  pointer-events: none;
  -o-object-fit: contain;
  object-fit: contain;
}
.contact-modal__submit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 0.16rem;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #1673c3;
  color: #fff;
  font-family: 'Noto Sans SC', 'Microsoft YaHei', sans-serif;
  font-size: 0.12rem;
  font-weight: 500;
  line-height: 0.16rem;
  letter-spacing: 0.024rem;
  text-transform: none;
  padding: 0.2rem 0.2rem;
  border: none;
  cursor: pointer;
  -webkit-transition: background-color 0.2s;
  -o-transition: background-color 0.2s;
  transition: background-color 0.2s;
}
.contact-modal__submit:hover { background-color: #1261a8; }
.contact-modal__submit-text { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; }
.contact-modal__submit-icon { width: 0.111rem; height: 0.094rem; -o-object-fit: contain; object-fit: contain; -ms-flex-negative: 0; flex-shrink: 0; }

/* ≤1199px 时 html 为 62.5%（1rem≈10px），弹窗内原 rem 会缩成 1～3px，须单独用可读 rem/px */
@media (max-width: 1199px) {
  .contact-modal {
    padding: 12px;
    padding-top: max(12px, env(safe-area-inset-top, 0px));
    padding-right: max(12px, env(safe-area-inset-right, 0px));
    padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
    padding-left: max(12px, env(safe-area-inset-left, 0px));
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  #contactModal.contact-modal.contact-modal--open {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }
  .contact-modal__panel {
    max-width: 100%;
    width: 100%;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    min-height: 0;
    margin: 0 auto;
    padding: 20px 16px;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
  }
  .contact-modal__content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px;
  }
  .contact-modal__left {
    -ms-flex: 0 0 auto;
    -webkit-box-flex: 0;
    flex: 0 0 auto;
    width: 100%;
    padding-top: 0;
  }
  .contact-modal__title {
    font-size: 2rem;
    line-height: 1.3;
    letter-spacing: -0.02em;
  }
  .contact-modal__form {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 16px;
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
  }
  .contact-modal__field--full {
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
    grid-column: 1 / -1;
  }
  .contact-modal__field { gap: 6px; }
  .contact-modal__label {
    font-size: 1.1rem;
    line-height: 1.35;
    letter-spacing: 0.04em;
  }
  .contact-modal__input,
  .contact-modal__textarea {
    font-size: 1.6rem;
    line-height: 1.4;
    padding: 10px 12px;
    min-height: 44px;
  }
  .contact-modal__textarea {
    min-height: 120px;
    resize: vertical;
  }
  .contact-modal__select {
    font-size: 1.6rem;
    line-height: 1.4;
    padding: 10px 40px 10px 12px;
    min-height: 44px;
  }
  .contact-modal__select-chevron {
    width: 20px;
    height: 20px;
    right: 10px;
  }
  .contact-modal__field--submit { padding-top: 8px; }
  .contact-modal__submit {
    font-size: 1.5rem;
    line-height: 1.35;
    letter-spacing: 0.12em;
    padding: 14px 20px;
    min-height: 48px;
  }
  .contact-modal__submit-icon {
    width: 12px;
    height: 10px;
  }
  .contact-modal__bracket { width: 12px; height: 12px; }
  .contact-modal__panel-close {
    top: 12px;
    right: 12px;
    padding: 6px 10px;
    font-size: 2.4rem;
  }
  .contact-modal__form-msg {
    font-size: 1.3rem;
    margin-bottom: 10px;
    min-height: 1.2em;
  }
}

@media (max-width: 1199px) and (min-width: 640px) {
  .contact-modal__form {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 14px;
  }
  .contact-modal__field--full {
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1 / -1;
  }
}

/* ============================================================
   INDUSTRY APPLICATION PAGE: PAGE HERO
   ============================================================ */
.page-hero {
  position: relative;
  height: 5rem; /* 400px（500px - 100px nav） */
  background-color: var(--c-dark);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow: hidden;
  margin-top: 1rem;
}
.page-hero__bg { position: absolute; inset: 0; pointer-events: none; }
.page-hero__bg-img {
  position: absolute;
  width: 100%; height: 100%;
  top: -0%; left: 0;
  -o-object-fit: cover; object-fit: cover;
  /*opacity: 0.4;*/
  max-width: none;
  /* 灰度处理（对应 Figma 的 mix-blend-saturation white overlay） */
  /*-webkit-filter: grayscale(100%);*/
  /*filter: grayscale(100%);*/
}
/* 蓝色渐变遮罩（左不透明 → 右透明） */
/*.page-hero__bg-gradient {*/
/*  position: absolute; inset: 0;*/
/*  background: linear-gradient(90deg, rgba(22,115,195,0.8) 0%, rgba(22,115,195,0) 100%);*/
/*}*/
.page-hero__container {
  position: relative; z-index: 1;
  width: 100%; max-width: 14rem;
  margin: 0 auto; padding: 0 0.48rem;
}
/* 左侧蓝色竖线装饰 */
.page-hero__content {
  border-left: 4px solid var(--c-primary-btn);
  padding: 0.24rem;
  background-color: rgba(0, 90, 158,0.5);
}
.page-hero__title {
  font-family: var(--font-sans);
  font-size: 0.6rem;
  font-weight: 700;
  color: var(--c-white);
  line-height: 1;
  letter-spacing: -0.03rem;
}
.page-hero__subtitle {
  font-family: var(--font-sans);
  font-size: 0.24rem;
  font-weight: 300;
  color: #dbeafe;
  letter-spacing: 0.024rem;
  text-transform: uppercase;
  line-height: 1.33;
  margin-top: 0.28rem; /* ~28px，对应 Figma 垂直间距 */
}

/* ============================================================
   INDUSTRY APPLICATION PAGE: TABS
   ============================================================ */
.tabs {
  background-color: #eceef5;
  border-bottom: 1px solid rgba(193,199,211,0.3);
  padding: 0 3.08rem;
  overflow: hidden;
  max-width: 100%;
}
.tabs-swiper-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.12rem;
  width: 100%;
  min-width: 0;
}
.tabs-swiper {
  width: 100%;
  min-width: 0;
  overflow: hidden;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.tabs-swiper__nav {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 0.36rem;
  height: 0.36rem;
  padding: 0;
  border: 1px solid rgba(193,199,211,0.5);
  border-radius: 50%;
  background-color: var(--c-white);
  color: var(--c-primary-btn);
  cursor: pointer;
  -webkit-transition: border-color var(--transition), background-color var(--transition), opacity var(--transition);
  transition: border-color var(--transition), background-color var(--transition), opacity var(--transition);
  -webkit-appearance: none;
  appearance: none;
}
.tabs-swiper__nav:hover:not(.swiper-button-disabled) {
  border-color: var(--c-primary-btn);
  background-color: rgba(22, 115, 195, 0.06);
}
.tabs-swiper__nav:focus-visible {
  outline: 2px solid var(--c-primary-btn);
  outline-offset: 2px;
}
.tabs-swiper__nav.swiper-button-disabled {
  opacity: 0.35;
  cursor: default;
  pointer-events: none;
}
.tabs-swiper__nav-icon {
  display: block;
  width: 0.08rem;
  height: 0.08rem;
  border-left: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
}
.tabs-swiper__nav--prev .tabs-swiper__nav-icon {
  margin-left: 0.03rem;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.tabs-swiper__nav--next .tabs-swiper__nav-icon {
  margin-right: 0.03rem;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}
.tabs-swiper .swiper-wrapper {
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}
.tabs-swiper .swiper-slide {
  width: auto;
  height: auto;
}
.tabs__item {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0.24rem 0.32rem 0.26rem;
  font-family: var(--font-sans);
  font-size: 0.14rem;
  font-weight: 500;
  color: var(--c-text-2);
  letter-spacing: 0.014rem;
  text-transform: uppercase;
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  -webkit-transition: color var(--transition), border-color var(--transition), background-color var(--transition);
  transition: color var(--transition), border-color var(--transition), background-color var(--transition);
  background: none;
  border-top: none;
  border-left: none;
  border-right: none;
  margin: 0;
  -webkit-appearance: none;
  appearance: none;
}
a.tabs__item {
  text-decoration: none;
  color: var(--c-text-2);
}
.tabs__item--active {
  background-color: var(--c-white);
  color: var(--c-primary);
  font-weight: 700;
  border-bottom-color: var(--c-primary);
}
.tabs__item:hover:not(.tabs__item--active) { color: var(--c-text); }

/* ============================================================
   INDUSTRY APPLICATION PAGE: MAIN LAYOUT
   ============================================================ */
.page-main {
  background-color: var(--c-bg);
  background-image:
    linear-gradient(180deg, rgba(193,199,211,0.1) 2.5%, rgba(193,199,211,0) 2.5%),
    linear-gradient(90deg,  rgba(193,199,211,0.1) 2.5%, rgba(193,199,211,0) 2.5%);
  background-size: 40px 40px;
  padding: 0.64rem 0;
}
.page-main__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.8rem;
  max-width: 14rem;
  margin: 0 auto;
  padding: 0 0.48rem;
}
/* 行业分类面板：Grid 叠层，仅激活面板可交互，避免切换后隐藏面板挡住链接 */
.page-main__container[data-industry-panels-root] {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  -ms-grid-rows: auto auto;
  grid-template-rows: auto auto;
  gap: 0.8rem;
}
.page-main__container[data-industry-panels-root] > .tech-specs-placeholder {
  -ms-grid-row: 2;
  grid-row: 2;
}
.industry-category-panel {
  -ms-grid-row: 1;
  grid-row: 1;
  -ms-grid-column: 1;
  grid-column: 1;
  min-width: 0;
  width: 100%;
  visibility: hidden;
  pointer-events: none;
  opacity: 0;
  position: relative;
  z-index: 0;
  overflow: hidden;
  max-height: 0;
}
.industry-category-panel.industry-category-panel--active {
  visibility: visible;
  pointer-events: auto;
  opacity: 1;
  z-index: 2;
  overflow: visible;
  max-height: none;
}
.industry-category-panel[hidden] {
  display: block !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  z-index: 0 !important;
}
.industry-category-panel.industry-category-panel--active[hidden] {
  visibility: hidden !important;
  pointer-events: none !important;
}
.industry-category-panel.industry-category-panel--active .app-cards,
.industry-category-panel.industry-category-panel--active .app-cards__grid,
.industry-category-panel.industry-category-panel--active a.app-card--clickable {
  pointer-events: auto;
}

/* ============================================================
   INDUSTRY APPLICATION PAGE: APP CARDS (3-column)
   ============================================================ */
.app-cards__grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 0.32rem 1fr 0.32rem 1fr;
  grid-template-columns: repeat(3,1fr);
  gap: 0.32rem;
  width: 100%;
  min-width: 0;
}
/* 单张卡片 */
.app-card {
  position: relative;
  background-color: var(--c-white);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  height: 100%;
}
a.app-card--clickable {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  -webkit-transition: box-shadow var(--transition), transform var(--transition);
  transition: box-shadow var(--transition), transform var(--transition);
}
a.app-card--clickable:hover {
  box-shadow: 0 0.08rem 0.24rem rgba(22, 115, 195, 0.12);
}
a.app-card--clickable:focus-visible {
  outline: 2px solid var(--c-primary-btn);
  outline-offset: 2px;
}
/* 左上角蓝色双线装饰 */
.app-card__corner {
  position: absolute;
  top: 0; left: 0;
  width: 8px; height: 8px;
  border-top: 2px solid var(--c-primary-btn);
  border-left: 2px solid var(--c-primary-btn);
  z-index: 1;
}
/* 图片区域（232.5px 高度，使用绝对定位填充并裁剪） */
.app-card__image-wrap {
  position: relative;
  width: 100%;
  height: 2.325rem;
  overflow: hidden;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
.app-card__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  -o-object-fit: cover; object-fit: cover;
  display: block;
  max-width: none;
}
/* 卡片内容区 */
.app-card__body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.12rem;
  padding: 0.32rem;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
.app-card__meta { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100%; }
.app-card__sys-ref { font-family: var(--font-sans); font-size: 0.1rem; font-weight: 700; color: var(--c-border); letter-spacing: -0.005rem; text-transform: uppercase; line-height: 1.5; }
.app-card__icon { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
.app-card__title { font-family: var(--font-sans); font-size: 0.24rem; font-weight: 700; color: var(--c-text); letter-spacing: -0.006rem; line-height: 1.33; padding-top: 0.04rem; min-width: 0; overflow-wrap: anywhere; }
.app-card__desc { font-family: var(--font-sans); font-size: 0.14rem; font-weight: 400; color: var(--c-text-2); line-height: 1.625; min-width: 0; overflow-wrap: anywhere; }
.app-card__link {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.08rem;
  font-family: var(--font-sans);
  font-size: 0.12rem;
  font-weight: 700;
  color: var(--c-primary);
  letter-spacing: 0.012rem;
  text-transform: uppercase;
  padding-top: 0.12rem;
  margin-top: auto;
  -webkit-transition: opacity var(--transition);
  transition: opacity var(--transition);
}
.app-card__link:hover { opacity: 0.7; }
a.app-card--clickable:hover .app-card__link--cta { opacity: 0.7; }
.app-card__link-icon { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }

/* ============================================================
   INDUSTRY APPLICATION PAGE: PAIN POINTS & SOLUTIONS
   ============================================================ */
.pain-points {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.48rem;
  padding-top: 0.16rem;
}
.pain-points__header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.24rem;
  width: 100%;
}
.pain-points__heading { font-family: var(--font-sans); font-size: 0.36rem; font-weight: 700; color: var(--c-text); letter-spacing: -0.018rem; line-height: 1.11; -ms-flex-negative: 0; flex-shrink: 0; white-space: nowrap; }
.pain-points__divider { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; height: 1px; background-color: rgba(193,199,211,0.3); min-width: 0; }
.pain-points__label { font-family: var(--font-sans); font-size: 0.1rem; font-weight: 700; color: var(--c-primary); letter-spacing: 0.01rem; text-transform: uppercase; white-space: nowrap; -ms-flex-negative: 0; flex-shrink: 0; }
/* 3列网格 */
.pain-points__grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-columns: repeat(3,1fr);
  background-color: rgba(255,255,255,0.5);
  border: 1px solid rgba(193,199,211,0.3);
  width: 100%;
}
.pain-point {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.24rem;
  padding: 0.4rem;
  border-right: 1px solid rgba(193,199,211,0.3);
}
.pain-point:last-child { border-right: none; }
.pain-point__head { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.12rem; }
.pain-point__icon { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
.pain-point__title { font-family: var(--font-sans); font-size: 0.2rem; font-weight: 700; color: var(--c-text); letter-spacing: -0.005rem; line-height: 1.4; }
.pain-point__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.16rem; }
.pain-point__row { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 0.16rem; -webkit-box-align: flex-start; -ms-flex-align: start; align-items: flex-start; }
.pain-point__label-tag { font-family: var(--font-sans); font-size: 0.1rem; font-weight: 700; color: var(--c-border); white-space: nowrap; padding-top: 0.04rem; -ms-flex-negative: 0; flex-shrink: 0; line-height: 1.5; }
.pain-point__desc { font-family: var(--font-sans); font-size: 0.14rem; font-weight: 400; color: var(--c-text-2); line-height: 1.43; }
.pain-point__solution {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.16rem;
  -webkit-box-align: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  background-color: rgba(22,115,195,0.05);
  border-left: 2px solid var(--c-primary-btn);
  padding: 0.16rem 0.16rem 0.16rem 0.18rem;
}
.pain-point__solution-label { font-family: var(--font-sans); font-size: 0.1rem; font-weight: 700; color: var(--c-primary-btn); white-space: nowrap; -ms-flex-negative: 0; flex-shrink: 0; padding-top: 0.04rem; line-height: 1.5; }
.pain-point__solution-text { font-family: var(--font-sans); font-size: 0.14rem; font-weight: 500; color: var(--c-text); line-height: 1.43; }

/* ============================================================
   INDUSTRY APPLICATION PAGE: RELATED EQUIPMENT
   ============================================================ */
.related-equip {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.48rem;
  padding-top: 0.16rem;
}
.related-equip__header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
}
.related-equip__title { font-family: var(--font-sans); font-size: 0.36rem; font-weight: 700; color: var(--c-text); letter-spacing: -0.018rem; line-height: 1.11; }
.related-equip__catalog-link {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.08rem;
  font-family: var(--font-sans);
  font-size: 0.12rem;
  font-weight: 700;
  color: var(--c-text-2);
  letter-spacing: 0.012rem;
  text-transform: uppercase;
  -webkit-transition: color var(--transition);
  transition: color var(--transition);
}
.related-equip__catalog-link:hover { color: var(--c-primary); }
.related-equip__catalog-icon { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
/* 4列网格 */
.related-equip__grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 0.16rem 1fr 0.16rem 1fr 0.16rem 1fr;
  grid-template-columns: repeat(4,1fr);
  gap: 0.16rem;
  width: 100%;
}
.equip-card {
  background-color: var(--c-bg-alt);
  border: 1px solid rgba(193,199,211,0.2);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 1px;
}
a.equip-card--clickable {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  -webkit-transition: box-shadow var(--transition), transform var(--transition);
  transition: box-shadow var(--transition), transform var(--transition);
}
a.equip-card--clickable:hover {
  box-shadow: 0 0.08rem 0.24rem rgba(22, 115, 195, 0.12);
}
a.equip-card--clickable:focus-visible {
  outline: 2px solid var(--c-primary-btn);
  outline-offset: 2px;
}
/* 图片区域（312px，灰度处理） */
.equip-card__image-wrap {
  background-color: var(--c-white);
  width: 100%;
  height: 3.12rem;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.equip-card__image {
  width: 100%; height: 100%;
  -o-object-fit: contain; object-fit: contain;
  display: block;
  /* 灰度效果（等效 Figma mix-blend-multiply + mix-blend-saturation） */
  /*-webkit-filter: grayscale(100%);*/
  /*filter: grayscale(100%);*/
  /*mix-blend-mode: multiply;*/
}
.equip-card__info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.04rem;
  padding: 0.17rem 0.16rem 0.16rem;
  border-top: 1px solid rgba(193,199,211,0.2);
}
.equip-card__name { font-family: var(--font-sans); font-size: 0.14rem; font-weight: 700; color: var(--c-text); letter-spacing: -0.0035rem; line-height: 1.43; }
.equip-card__model { font-family: var(--font-sans); font-size: 0.1rem; font-weight: 400; color: var(--c-border); text-transform: uppercase; line-height: 1.5; }

/* 技术规格占位区 */
/* .tech-specs-placeholder { height: 1.24rem; border-top: 1px solid rgba(193,199,211,0.1); } */

/* ============================================================
   RESPONSIVE: TABLET  768px – 1199px
   ============================================================ */
@media (max-width: 1199px) {
  html { font-size: 62.5%; /* 1rem = 10px */ }

  /* 桌面稿 14rem=1400px；此处 1rem=10px 时 14rem 仅 140px，会导致整站主栏极窄、两侧留白过大 */
  .nav__inner,
  .hero__container,
  .about__container,
  .pillars__container,
  .products__container,
  .contact__container,
  .footer__container,
  .page-hero__container,
  .page-main__container,
  .detail-hero__container,
  .detail-main,
  .about-banner__container,
  .about-section-inner,
  .about-vision__inner,
  .vlist-banner__container,
  .vlist-content,
  .vd-banner__container,
  .vd-layout {
    max-width: 100%;
  }

  .hero__desc,
  .contact__desc,
  .about-banner__inner,
  .about-banner__subtitle-wrap,
  .about-vision__content,
  .about-vision__desc,
  .about-expertise__panel-head {
    max-width: 100%;
  }

  /* 联系弹窗：见上文「联系留言弹窗」内 @media (max-width: 1199px) */

  /* Nav */
  .nav { height: 70px; }
  .nav__links {
    display: none;
    position: fixed; top: 70px; left: 0; right: 0;
    background-color: var(--c-bg);
    -webkit-box-orient: vertical; -webkit-box-direction: normal;
    -ms-flex-direction: column; flex-direction: column;
    -webkit-box-align: flex-start; -ms-flex-align: start; align-items: flex-start;
    gap: 0; height: auto; padding: 12px 24px 24px;
    border-bottom: 1px solid rgba(148,163,184,0.15); z-index: 99;
  }
  .nav--open .nav__links { display: -webkit-box; display: -ms-flexbox; display: flex; }
  .nav__item { width: 100%; height: auto; border-bottom: 1px solid rgba(193,199,211,0.15); }
  .nav__link { padding: 12px 0; font-size: 1.3rem; width: 100%; }
  .nav__item--active .nav__link { border-bottom: none; padding-bottom: 12px; }
  .nav__controls { display: none; }
  .nav__hamburger { display: -webkit-box; display: -ms-flexbox; display: flex; }
  .nav__logo-img { height: 40px; }
  .nav__inner { padding: 0 24px; max-width: 100%; }

  /* INDEX: Hero */
  .hero { margin-top: 70px; height: auto; min-height: 520px; padding: 80px 24px; }
  .hero__bg-img { height: 100%; top: 0; }
  .hero__container { padding: 0; }
  .hero__content { gap: 2rem; max-width: 100%; }
  .hero__heading-white,
  .hero__heading-blue { font-size: clamp(3.6rem, 6vw, 7rem); letter-spacing: -2px; }
  .hero__desc { font-size: 1.5rem; max-width: 100%; }

  /* INDEX: About */
  .about { padding: 64px 24px; }
  .about__container { grid-template-columns: 1fr; gap: 48px; min-height: auto; }

  /* INDEX: Pillars */
  .pillars { padding: 64px 24px; }
  .pillars__container { padding: 0; gap: 40px; }
  .pillars__grid { grid-template-columns: repeat(3,1fr); gap: 16px; }
  .pillar-card { height: auto; min-height: 350px; }
  .pillar-card__image-wrap { height: 140px; }

  /* INDEX: Products */
  .products { padding: 64px 24px; }
  .products__container { padding: 0; gap: 40px; }
  .products__grid { grid-template-columns: repeat(2,1fr); }
  .product-card { border-right: 1px solid rgba(193,199,211,0.2); border-bottom: 1px solid rgba(193,199,211,0.2); }
  .product-card:nth-child(2n) { border-right: none; }

  /* INDEX: Contact — 平板：CTA 通栏 + 下方 2×2 */
  .contact { padding: 80px 24px; }
  .contact__container {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 16px;
    padding: 16px;
    min-height: auto;
  }
  .contact__left {
    grid-column: 1 / -1;
    grid-row: auto;
    min-height: auto;
    padding: 32px 28px;
  }
  .contact__stats {
    grid-column: 1 / -1;
    grid-row: auto;
    min-height: auto;
    gap: 16px;
  }
  .contact__heading { font-size: clamp(3.2rem, 4.5vw, 5rem); }
  .contact__stats { width: 100%; }

  .page--legal-simple .legal-simple { margin-top: 70px; padding: 48px 24px 64px; }
  .legal-simple__title { font-size: clamp(2rem, 4vw, 2.8rem); }
  .legal-simple__body { font-size: 1.35rem; max-width: none; }

  .page--product-search .product-search { margin-top: 70px; padding: 48px 24px 64px; }
  .product-search__heading { font-size: clamp(1.6rem, 3.5vw, 2.2rem); }

  /* Footer（html 62.5% 下须重写 rem，否则 0.14rem≈1.4px 不可读） */
  .footer { padding: 48px 24px 24px; }
  .footer__container { padding: 0; gap: 40px; }
  .footer__grid { grid-template-columns: repeat(2,1fr); gap: 32px; }
  .footer__company-name { font-size: 1.8rem; line-height: 1.35; }
  .footer__contact-item span { font-size: 1.4rem; line-height: 1.5; }
  .footer__col-title { font-size: 1.15rem; letter-spacing: 0.06em; }
  .footer__link { font-size: 1.4rem; line-height: 1.45; }
  .footer__copyright,
  .footer__icp,
  .footer__status { font-size: 1.25rem; line-height: 1.45; white-space: normal; }
  .footer__bottom-right { -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 12px; }
  .footer__social-link { width: 44px; height: 44px; min-width: 44px; min-height: 44px; }
  .footer__social-link img { width: 22px; height: 22px; max-width: none; max-height: none; -o-object-fit: contain; object-fit: contain; }
  .footer__contact-icon { width: 18px; height: auto; -ms-flex-negative: 0; flex-shrink: 0; }

  /* Shared */
  .section-header__title { font-size: clamp(3rem, 4vw, 4.8rem); }
  .section-header__line { width: 60px; height: 4px; }

  /* FAB */
  .fab { bottom: 20px; right: 20px; padding: 14px 20px; font-size: 1.2rem; border-radius: 6px; }
  .fab__icon { width: 14px; height: 16px; }

  /* PAGE HERO */
  .page-hero { margin-top: 70px; height: auto; min-height: 260px; padding: 60px 24px; }
  .page-hero__bg-img { height: 100%; top: 0; }
  .page-hero__container { padding: 0; }
  .page-hero__title { font-size: clamp(2.8rem, 5vw, 5rem); }
  .page-hero__subtitle { font-size: 1.6rem; margin-top: 12px; }

  /* Tabs */
  .tabs { padding: 0 24px; }
  .tabs-swiper-wrap { gap: 8px; }
  .tabs-swiper__nav { width: 36px; height: 36px; }
  .tabs-swiper__nav-icon { width: 8px; height: 8px; }
  .tabs__item { padding: 16px 20px 18px; font-size: 1.2rem; }

  /* Page main */
  .page-main { padding: 48px 0; }
  .page-main__container { padding: 0 24px; gap: 64px; }

  /* App cards */
  .app-cards__grid { grid-template-columns: 1fr; gap: 24px; }
  .app-card__image-wrap { height: 220px; }

  /* Pain points */
  .pain-points__heading { font-size: clamp(2rem, 3.5vw, 3.6rem); white-space: normal; }
  .pain-points__grid { grid-template-columns: 1fr; }
  .pain-point { border-right: none; border-bottom: 1px solid rgba(193,199,211,0.3); }
  .pain-point:last-child { border-bottom: none; }

  /* Equipment */
  .related-equip__grid { grid-template-columns: repeat(2,1fr); }
  .equip-card__image-wrap { height: 220px; }
  .related-equip__title { font-size: 2.8rem; }

  /* Tech specs placeholder */
  .tech-specs-placeholder { height: 80px; }
}

/* ============================================================
   RESPONSIVE: MOBILE  < 768px
   ============================================================ */
@media (max-width: 767px) {
  html { font-size: 62.5%; }

  /* Nav */
  .nav { height: 60px; }
  .nav__links { top: 60px; }

  /* INDEX: Hero */
  .hero { margin-top: 60px; min-height: 420px; padding: 60px 20px; }
  .hero__heading-white,
  .hero__heading-blue { font-size: clamp(3rem, 9vw, 5rem); letter-spacing: -1px; }
  .hero__desc { font-size: 1.4rem; }
  .hero__buttons { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: flex-start; -ms-flex-align: start; align-items: flex-start; gap: 12px; padding-top: 12px; }
  .btn--primary, .btn--outline { padding: 14px 28px; font-size: 1.4rem; }

  /* INDEX: About */
  .about { padding: 48px 20px; }
  .about__heading { font-size: 2.4rem; }
  .about__paragraphs p { font-size: 1.4rem; }
  .about__stat-value { font-size: 2rem; }

  /* INDEX: Pillars */
  .pillars { padding: 48px 20px; }
  .pillars__grid { grid-template-columns: repeat(2,1fr); gap: 12px; }
  .pillar-card { min-height: 300px; }
  .pillar-card__image-wrap { height: 120px; }
  .pillar-card__title { font-size: 1.5rem; }
  .pillar-card__desc { font-size: 1.1rem; }

  /* INDEX: Products */
  .products { padding: 48px 20px; }
  .products__grid { grid-template-columns: 1fr; }
  .product-card { aspect-ratio: 16/9; border-right: none; border-bottom: 1px solid rgba(193,199,211,0.2); }
  .product-card__title { font-size: 2rem; }
  .product-card__desc { font-size: 1.3rem; }

  /* INDEX: Contact */
  .contact { padding: 60px 20px; }
  .contact__container { padding: 12px; gap: 12px; }
  .contact__left { padding: 24px 20px; }
  .contact__stats { gap: 12px; }
  .contact__heading { font-size: clamp(2.8rem, 7vw, 4rem); }
  .contact__desc { font-size: 1.4rem; }
  .contact__stats { grid-template-columns: 1fr 1fr; }
  .contact__stat { padding: 20px; min-height: 0; }
  .contact__stat-value { font-size: 2.4rem; }
  .btn--contact { font-size: 1.5rem; padding: 16px 32px; }

  .page--legal-simple .legal-simple { margin-top: 60px; padding: 40px 20px 48px; }
  .legal-simple__title { font-size: clamp(1.85rem, 6vw, 2.4rem); }
  .legal-simple__body { font-size: 1.3rem; }

  .page--product-search .product-search { margin-top: 60px; padding: 40px 20px 48px; }
  .product-search__form { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
  .product-search__input { max-width: none; }

  /* Footer：单列 + 可读字号与换行（避免 nowrap 挤出视口） */
  .footer { padding: 40px 20px calc(20px + env(safe-area-inset-bottom, 0px)); }
  .footer__container { gap: 28px; }
  .footer__grid { grid-template-columns: 1fr; gap: 28px; }
  .footer__company-name { font-size: 1.8rem; line-height: 1.35; }
  .footer__contact-item span { font-size: 1.4rem; line-height: 1.55; word-break: break-word; }
  .footer__col-title { font-size: 1.2rem; letter-spacing: 0.05em; }
  .footer__link { font-size: 1.4rem; line-height: 1.5; }
  .footer__bottom {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    gap: 16px;
    padding-top: 24px;
  }
  .footer__copyright,
  .footer__icp,
  .footer__status {
    font-size: 1.3rem;
    line-height: 1.5;
    white-space: normal;
    word-break: break-word;
  }
  .footer__bottom-right {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    gap: 10px;
    width: 100%;
  }
  .footer__bottom-divider { display: none; }
  .footer__social-link { width: 44px; height: 44px; min-width: 44px; min-height: 44px; }
  .footer__social-link img { width: 22px; height: 22px; max-width: none; max-height: none; -o-object-fit: contain; object-fit: contain; }
  .footer__contact-icon { width: 18px; height: auto; -ms-flex-negative: 0; flex-shrink: 0; }

  /* Shared */
  .section-header__title { font-size: clamp(2.4rem, 6vw, 3.6rem); }

  /* FAB */
  .fab { bottom: 16px; right: 16px; padding: 12px; width: 48px; height: 48px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border-radius: 4px; }
  .fab__text { display: none; }

  /* PAGE HERO */
  .page-hero { margin-top: 60px; min-height: 200px; padding: 40px 20px; }
  .page-hero__title { font-size: clamp(2rem, 7vw, 3.2rem); }
  .page-hero__subtitle { font-size: 1.3rem; margin-top: 10px; }

  /* Tabs */
  .tabs { padding: 0 20px; }
  .tabs-swiper-wrap { gap: 6px; }
  .tabs-swiper__nav { width: 32px; height: 32px; }
  .tabs__item { font-size: 1.1rem; padding: 14px 16px 16px; }

  /* Page main */
  .page-main { padding: 40px 0; }
  .page-main__container { padding: 0 20px; gap: 48px; }

  /* App cards */
  .app-card__image-wrap { height: 180px; }
  .app-card__title { font-size: 2rem; }
  .app-card__desc { font-size: 1.3rem; }

  /* Pain points */
  .pain-points__heading { font-size: 2.2rem; }
  .pain-point { padding: 24px 20px; }
  .pain-point__title { font-size: 1.6rem; }
  .pain-point__desc, .pain-point__solution-text { font-size: 1.3rem; }

  /* Equipment */
  .related-equip__grid { grid-template-columns: repeat(2,1fr); gap: 12px; }
  .equip-card__image-wrap { height: 140px; }
  .equip-card__name { font-size: 1.2rem; }
  .related-equip__title { font-size: 2.2rem; }

  /* Tech specs */
  .tech-specs-placeholder { height: 60px; }
}

/* ============================================================
   PETROCHEMICAL DETAIL PAGE: HERO BANNER
   ============================================================ */

/* 页面网格背景（蓝色细点网格）*/
.page--detail {
  background-image:
    linear-gradient(90deg,  rgba(22,115,195,0.05) 2.5%, rgba(22,115,195,0) 2.5%),
    linear-gradient(180deg, rgba(22,115,195,0.05) 2.5%, rgba(22,115,195,0) 2.5%);
  background-size: 40px 40px;
  background-color: var(--c-bg);
}

/* Hero Banner（450px 实际高度，设计稿含 nav 偏移共 550px） */
.detail-hero {
  position: relative;
  height: 5rem; /* 450px */
  background-color: var(--c-dark);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow: hidden;
  margin-top: 1rem; /* nav 高度 */
}
.detail-hero__bg { position: absolute; inset: 0; pointer-events: none; }
.detail-hero__bg-img {
  position: absolute;
  width: 100%; height: 100%;
  top: 0; left: 0;
  -o-object-fit: cover; object-fit: cover;
  /*opacity: 0.5; */
  max-width: none;
  /* 灰度处理（mix-blend-saturation white overlay 效果）*/
  /*-webkit-filter: grayscale(100%);*/
  /*filter: grayscale(100%);*/
}
/* 三段蓝色渐变遮罩：0.9 → 0.4 → 0 */
/*.detail-hero__bg-gradient {*/
/*  position: absolute; inset: 0;*/
/*  background: linear-gradient(90deg,*/
/*    rgba(22,115,195,0.9) 0%,*/
/*    rgba(22,115,195,0.4) 50%,*/
/*    rgba(22,115,195,0)   100%);*/
/*}*/
.detail-hero__container {
  position: relative; z-index: 1;
  width: 100%; max-width: 14rem;
  margin: 0 auto; padding: 0 0.4rem; /* 40px */
}
/* 左竖线 + 内容块（对应 Figma border-l-4 #1673c3, h-160px） */
.detail-hero__content {
  border-left: 4px solid var(--c-primary-btn);
  padding: 0.24rem;
  background-color: rgba(0, 90, 158,0.5);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.detail-hero__version {
  font-family: var(--font-sans);
  font-size: 0.12rem;
  font-weight: 400;
  color: #d3e4ff;
  letter-spacing: 0.048rem; /* 4.8px */
  text-transform: uppercase;
  opacity: 0.8;
  line-height: 1.33;
  margin-bottom: 0.12rem;
}
.detail-hero__title {
  font-family: var(--font-sans);
  font-size: 0.72rem; /* 72px */
  font-weight: 700;
  color: var(--c-white);
  line-height: 1;
  letter-spacing: -0.036rem;
}
.detail-hero__subtitle {
  font-family: var(--font-sans);
  font-size: 0.24rem;
  font-weight: 300;
  color: #dbeafe;
  letter-spacing: 0.048rem;
  text-transform: uppercase;
  line-height: 1.33;
  margin-top: 0.2rem;
}

/* ============================================================
   PETROCHEMICAL DETAIL PAGE: MAIN LAYOUT (sidebar + content)
   ============================================================ */

/* 外层 padding: 0 260px */
.detail-outer {
  padding: 0 2.6rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
}
/* 内层容器 max-width 1400px，两列布局 */
.detail-main {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  max-width: 14rem;
  width: 100%;
}

/* ---- 左侧导航边栏 ---- */
.detail-sidebar {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 2.88rem; /* 288px */
  background-color: rgba(255,255,255,0.4);
  border-right: 1px solid rgba(193,199,211,0.15);
  padding: 0.32rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.4rem;
  /* Sticky 固定在视口内 */
  position: -webkit-sticky;
  position: sticky;
  top: 1rem;
  -ms-flex-item-align: start;
  align-self: flex-start;
  max-height: calc(100vh - 1rem);
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.detail-sidebar::-webkit-scrollbar { display: none; }

/* 边栏区块标题 */
.sidebar__header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.12rem;
}
.sidebar__header-icon { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
.sidebar__header-text {
  font-family: var(--font-sans);
  font-size: 0.12rem; font-weight: 700;
  color: var(--c-primary-btn);
  letter-spacing: 0.012rem; text-transform: uppercase;
  white-space: nowrap; line-height: 1.33;
}

/* 导航树 */
.sidebar__nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.08rem; }
.sidebar__cat-header {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 0.08rem; padding: 0.12rem 0.08rem;
}
.sidebar__cat-icon { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
.sidebar__cat-label {
  font-family: var(--font-sans); font-size: 0.1rem; font-weight: 700;
  color: var(--c-text-slate); letter-spacing: 0.02rem;
  text-transform: uppercase; white-space: nowrap; line-height: 1.5;
}

/* 激活一级分类行（PETROCHEMICAL） */
.sidebar__cat-active {
  background-color: rgba(241,245,249,0.5);
  border-left: 2px solid var(--c-primary-btn);
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
  padding: 0 0.16rem;
  height: 0.52rem;
}
.sidebar__cat-active-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.12rem; }
/* 工业分类彩色圆点（代替 Material Symbols petrology 图标）*/
.sidebar__cat-active-dot {
  width: 0.18rem; height: 0.18rem;
  border-radius: 50%;
  background-color: rgba(22,115,195,0.15);
  border: 2px solid var(--c-primary-btn);
  -ms-flex-negative: 0; flex-shrink: 0;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  font-size: 0.1rem; color: var(--c-primary-btn); font-weight: 700;
}
.sidebar__cat-active-name {
  font-family: var(--font-sans); font-size: 0.11rem; font-weight: 700;
  color: var(--c-dark); letter-spacing: 0.00275rem;
  text-transform: uppercase; white-space: nowrap; line-height: 1.5;
}
.sidebar__cat-arrow { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }

/* 二级分类（PROCESSING UNITS）*/
.sidebar__subcat {
  border-left: 1px solid rgba(193,199,211,0.3);
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end;
  width: calc(100% - 1px); margin-left: 1px;
}
.sidebar__subcat-row {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 0.08rem; padding: 0.12rem 0.16rem; width: 100%;
}
.sidebar__subcat-icon { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
.sidebar__subcat-label {
  font-family: var(--font-sans); font-size: 0.11rem; font-weight: 700;
  color: #64748b; letter-spacing: 0.0055rem;
  text-transform: uppercase; white-space: nowrap; line-height: 1.5;
}

/* 三级导航条目 */
.sidebar__items {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.04rem;
  width: calc(1.82rem); /* 182px */
  -ms-flex-item-align: end; align-self: flex-end;
}
.sidebar__item {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
  padding: 0.12rem 0.16rem; width: 100%;
}
.sidebar__item--active {
  background-color: rgba(22,115,195,0.1);
  border-left: 4px solid var(--c-primary-btn);
}
.sidebar__item--inactive { opacity: 0.4; }
.sidebar__item-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.12rem; }
.sidebar__item-dot { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
.sidebar__item-bullet {
  width: 0.08rem;
  height: 0.08rem;
  border-radius: 50%;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  display: block;
}
.sidebar__item-bullet--active { background: var(--c-primary-btn); }
.sidebar__item-bullet--inactive { background: #94a3b8; }
.sidebar__item-name {
  font-family: var(--font-sans); font-size: 0.14rem;
  white-space: normal; line-height: 1.5;
}
.sidebar__item--active .sidebar__item-name { font-weight: 700; color: var(--c-primary-btn); }
.sidebar__item--inactive .sidebar__item-name { font-weight: 500; color: #475569; }
.sidebar__item-chevron { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }

/* ---- 右侧内容区 ---- */
.detail-content {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 0;
  background-color: rgba(255,255,255,0.2);
  padding: 0.4rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.4rem;
}

/* ---- 面包屑导航 ---- */
.detail-breadcrumbs {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -ms-flex-wrap: wrap; flex-wrap: wrap;
  gap: 0.08rem;
  padding-bottom: 0.17rem;
  border-bottom: 1px solid rgba(193,199,211,0.1);
}
.detail-breadcrumbs__link {
  font-family: var(--font-sans); font-size: 0.1rem; font-weight: 400;
  color: #414751; letter-spacing: 0.02rem;
  text-transform: uppercase; white-space: nowrap; line-height: 1.5;
  -webkit-transition: color var(--transition); transition: color var(--transition);
}
.detail-breadcrumbs__link:hover { color: var(--c-primary); }
.detail-breadcrumbs__link--current { font-weight: 700; color: var(--c-primary); }
.detail-breadcrumbs__sep { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }

/* ---- 产品详情（2列：图片 + 描述）---- */
.detail-product {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 0.48rem 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 0.48rem;
  width: 100%;
}
/* 左列：产品图片 */
.detail-product__image-wrap {
  position: relative;
  background-color: #f1f5f9;
  border: 1px solid rgba(193,199,211,0.15);
  padding: 1px;
  overflow: hidden;
  height: 5.92rem; /* 592px */
}
.detail-product__image {
  position: absolute;
  height: 100%;
  left: -10.41%;
  top: 0;
  width: 120.82%;
  -o-object-fit: cover; object-fit: cover;
  display: block; max-width: none;
}
/* 底部渐变遮罩（深色 → 透明） */
.detail-product__image-gradient {
  position: absolute; inset: 0;
  /*background: linear-gradient(0deg, rgba(2,6,23,0.4) 0%, rgba(2,6,23,0) 50%);*/
}
/* 左上角白色边框装饰 */
.detail-product__corner-tl {
  position: absolute;
  top: 0.32rem; left: 0.32rem;
  width: 0.64rem; height: 0.64rem;
  border-top: 2px solid rgba(255,255,255,0.3);
  border-left: 2px solid rgba(255,255,255,0.3);
}
/* 右下角白色边框装饰 */
.detail-product__corner-br {
  position: absolute;
  bottom: 0.32rem; right: 0.32rem;
  width: 0.64rem; height: 0.64rem;
  border-bottom: 2px solid rgba(255,255,255,0.3);
  border-right: 2px solid rgba(255,255,255,0.3);
}
/* 右列：产品文案 */
.detail-product__info {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
}
.detail-product__title {
  font-family: var(--font-sans);
  font-size: 0.6rem; /* 60px */
  font-weight: 700; color: var(--c-text);
  line-height: 1; letter-spacing: -0.03rem;
  text-transform: uppercase;
  padding-bottom: 0.24rem;
}
.detail-product__desc { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.24rem; }
.detail-product__desc p { font-family: var(--font-sans); font-size: 0.16rem; font-weight: 400; color: #414751; line-height: 1.625; }
.detail-product__cta { padding-top: 0.24rem; }
/* 黑色 CONTACT US 按钮 */
.detail-product__btn {
  display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 0.16rem;
  background-color: #000;
  color: var(--c-white);
  padding: 0.2rem 0.48rem;
  font-family: var(--font-sans);
  font-size: 0.14rem; font-weight: 700;
  letter-spacing: 0.042rem; /* 4.2px */
  text-transform: uppercase; white-space: nowrap;
  -webkit-box-shadow: 0 20px 25px -5px rgba(0,0,0,0.2), 0 8px 10px -6px rgba(0,0,0,0.2);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.2), 0 8px 10px -6px rgba(0,0,0,0.2);
  -webkit-transition: background-color var(--transition);
  transition: background-color var(--transition);
}
.detail-product__btn:hover { background-color: #1a1a1a; }
.detail-product__btn-icon { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }

/* ---- 附加详情（遥测数据卡片）---- */
.detail-telemetry {
  border-top: 1px solid rgba(193,199,211,0.1);
  padding-top: 0.89rem; /* 89px */
}
.telemetry-card {
  background-color: var(--c-bg-alt);
  border: 1px solid rgba(193,199,211,0.1);
  padding: 0.41rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.16rem;
}
.telemetry-card__icon { width: 0.27rem; height: 0.27rem; -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
.telemetry-card__title {
  font-family: var(--font-sans); font-size: 0.12rem; font-weight: 700;
  color: var(--c-text); letter-spacing: 0.024rem;
  text-transform: uppercase; line-height: 1.33; padding-top: 0.08rem;
}
.telemetry-card__desc {
  font-family: var(--font-sans); font-size: 0.12rem; font-weight: 500;
  color: #414751; line-height: 2;
}

/* ---- 其他行业解决方案 ---- */
.other-solutions {
  border-top: 1px solid rgba(193,199,211,0.1);
  padding-top: 1.05rem; /* 105px */
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.4rem;
}
.other-solutions__header {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 0.24rem;
}
/* 蓝色左竖线装饰 */
.other-solutions__accent {
  -ms-flex-negative: 0; flex-shrink: 0;
  width: 0.04rem; height: 0.4rem;
  background-color: var(--c-primary-btn);
}
.other-solutions__title {
  font-family: var(--font-sans); font-size: 0.24rem; font-weight: 700;
  color: var(--c-text); letter-spacing: -0.012rem;
  text-transform: uppercase; line-height: 1.33; white-space: nowrap;
}
.other-solutions__grid {
  display: -ms-grid; display: grid;
  -ms-grid-columns: 1fr 0.32rem 1fr 0.32rem 1fr;
  grid-template-columns: repeat(3,1fr);
  gap: 0.32rem;
}
/* 解决方案卡片 */
.sol-card { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.113rem; padding-bottom: 0.1625rem; }
a.sol-card--link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  -webkit-transition: box-shadow var(--transition), transform var(--transition);
  transition: box-shadow var(--transition), transform var(--transition);
}
a.sol-card--link:hover {
  box-shadow: 0 0.08rem 0.24rem rgba(22, 115, 195, 0.12);
}
a.sol-card--link:focus-visible {
  outline: 2px solid var(--c-primary-btn);
  outline-offset: 2px;
}
.sol-card__image-wrap {
  background-color: #f1f5f9;
  border: 1px solid rgba(193,199,211,0.15);
  padding: 1px;
  height: 1.735rem; /* 173.5px */
  position: relative; overflow: hidden;
}
.sol-card__image {
  position: absolute;
  width: 100%; height: 133.72%;
  top: -16.86%; left: 0;
  -o-object-fit: cover; object-fit: cover;
  display: block; max-width: none;
}
.sol-card__label {
  font-family: var(--font-sans); font-size: 0.12rem; font-weight: 700;
  color: var(--c-primary-btn); letter-spacing: 0.024rem;
  text-transform: uppercase; line-height: 1.33; padding-top: 0.127rem;
}
.sol-card__desc {
  font-family: var(--font-sans); font-size: 0.1rem; font-weight: 500;
  color: #414751; line-height: 1.625;
}

/* ============================================================
   PETROCHEMICAL DETAIL PAGE: RESPONSIVE
   ============================================================ */

@media (max-width: 1199px) {
  .detail-hero { margin-top: 70px; height: auto; min-height: 280px; padding: 60px 24px; }
  .detail-hero__bg-img { height: 100%; top: 0; }
  .detail-hero__container { padding: 0; }
  .detail-hero__title { font-size: clamp(3.6rem, 6vw, 6rem); }
  .detail-hero__subtitle { font-size: 1.6rem; }
  .detail-hero__version { font-size: 1rem; }
  .detail-outer { padding: 0; }
  .detail-main { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
  .detail-sidebar {
    width: 100%; position: relative; top: 0;
    max-height: none; border-right: none;
    border-bottom: 1px solid rgba(193,199,211,0.15);
    -webkit-box-orient: horizontal; -webkit-box-direction: normal;
    -ms-flex-direction: row; flex-direction: row;
    -webkit-box-align: center; -ms-flex-align: center; align-items: center;
    gap: 0; padding: 12px 24px; overflow-x: auto;
    -webkit-flex-wrap: wrap; flex-wrap: wrap;
  }
  .sidebar__header, .sidebar__nav { -ms-flex-negative: 0; flex-shrink: 0; }
  .sidebar__nav { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  .sidebar__cat-active { height: auto; padding: 8px 12px; }
  .sidebar__subcat { border-left: none; margin-left: 0; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: auto; }
  .sidebar__items { width: auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
  .detail-content { padding: 24px; }
  .detail-product { grid-template-columns: 1fr; gap: 24px; }
  .detail-product__image-wrap { height: 320px; }
  .detail-product__title { font-size: clamp(3rem, 5vw, 5rem); }
  .detail-product__desc p { font-size: 1.4rem; }
  .other-solutions__grid { grid-template-columns: 1fr; gap: 24px; }
  .sol-card__image-wrap { height: 180px; }
  .detail-telemetry { padding-top: 48px; }
  .other-solutions { padding-top: 48px; }
  .telemetry-card { padding: 24px; }
  .telemetry-card__title { font-size: 1.1rem; }
  .telemetry-card__desc { font-size: 1.1rem; }
}

@media (max-width: 767px) {
  .detail-hero { margin-top: 60px; min-height: 220px; padding: 40px 20px; }
  .detail-hero__title { font-size: clamp(2.8rem, 9vw, 4.8rem); }
  .detail-hero__subtitle { font-size: 1.3rem; }
  .detail-content { padding: 20px; }
  .detail-product__image-wrap { height: 240px; }
  .detail-product__title { font-size: clamp(2.4rem, 8vw, 3.6rem); }
  .detail-product__btn { padding: 14px 28px; font-size: 1.2rem; }
  .other-solutions__grid { grid-template-columns: repeat(2,1fr); gap: 16px; }
  .sol-card__image-wrap { height: 130px; }
  .sol-card__label { font-size: 1rem; }
  .other-solutions__title { font-size: 1.8rem; }
}

/* ============================================================
   PRODUCT DETAIL PAGE: SIDEBAR (产品中心导航树)
   ============================================================ */

/* 复用 .detail-sidebar, .sidebar__header 等基础类；以下为产品页新增侧边树样式 */

/* PRODUCT CLASSIFICATION 激活块（类似 sidebar__cat-active，但为两行标签） */
.sidebar__prod-class {
  background-color: rgba(241,245,249,0.5);
  border-left: 2px solid var(--c-primary-btn);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0.12rem 0.16rem 0.12rem 0.18rem;
}
.sidebar__prod-class-label {
  font-family: var(--font-sans);
  font-size: 0.14rem;
  font-weight: 700;
  color: var(--c-primary-btn);
  letter-spacing: 0.007rem;
  text-transform: uppercase;
  line-height: 1.43;
}
.sidebar__prod-class-arrow { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }

/* 分类树容器（垂直左边线） */
.sidebar__prod-nav {
  border-left: 1px solid rgba(193,199,211,0.3);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.08rem;
  width: calc(100% - 1px);
  margin-left: 1px;
}

/* 分类组（如 LIQUID-LIQUID EXTRACTION）*/
.sidebar__cat-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.08rem;
  padding: 0.08rem 0.16rem;
}
/* 分类标题行（蓝色实心圆点 + 名称）*/
.sidebar__cat-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.08rem;
}
.sidebar__cat-dot-sm {
  width: 5px; height: 6px;
  border-radius: 9999px;
  background-color: var(--c-primary-btn);
  -ms-flex-negative: 0; flex-shrink: 0;
}
.sidebar__cat-name {
  font-family: var(--font-sans);
  font-size: 0.13rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: 0.0065rem;
  text-transform: uppercase;
  line-height: 1.5;
}
/* 行业场景详情 sidebar：分类手风琴（默认折叠，点击展开应用列表） */
[data-industry-sidebar-accordion] .sidebar__cat-toggle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 0.08rem;
  width: 100%;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
}
[data-industry-sidebar-accordion] .sidebar__cat-toggle:focus-visible {
  outline: 2px solid var(--c-primary-btn);
  outline-offset: 2px;
}
[data-industry-sidebar-accordion] .sidebar__cat-toggle .sidebar__cat-item {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 0;
}
[data-industry-sidebar-accordion] .sidebar__cat-toggle-arrow {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -o-object-fit: contain;
  object-fit: contain;
  -webkit-transition: -webkit-transform var(--transition);
  transition: transform var(--transition);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
[data-industry-sidebar-accordion] .sidebar__cat-group--expanded .sidebar__cat-toggle-arrow {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}
[data-industry-sidebar-accordion] .sidebar__cat-group:not(.sidebar__cat-group--expanded) .sidebar__sub-list {
  display: none !important;
}
[data-industry-sidebar-accordion] .sidebar__cat-item--static {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.08rem;
}
/* 子链接列表（垂直左边线） */
.sidebar__sub-list {
  border-left: 1px solid rgba(193,199,211,0.2);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.04rem;
  margin-left: 1px;
  padding-left: 1px;
}
.sidebar__sub-link {
  display: block;
  padding: 0.08rem 0.16rem;
  font-family: var(--font-sans);
  font-size: 0.16rem;
  line-height: 1.5;
  -webkit-transition: color var(--transition), background-color var(--transition);
  transition: color var(--transition), background-color var(--transition);
}
.sidebar__sub-link--active {
  background-color: rgba(22,115,195,0.05);
  border-left: 2px solid var(--c-primary-btn);
  color: var(--c-primary-btn);
  font-weight: 700;
}
.sidebar__sub-link--inactive {
  color: #555;
  font-weight: 500;
}
.sidebar__sub-link--inactive:hover { color: var(--c-text); }

/* 分类间分隔线 */
.sidebar__cat-sep {
  height: 1px;
  background-color: rgba(193,199,211,0.1);
  margin: 0 0.12rem;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

/* ============================================================
   PRODUCT DETAIL PAGE: SECTIONS（产品介绍、技术详情等）
   ============================================================ */

/* 蓝色左竖线 + 标题 行（通用区块标题，宽度 6px，高度 24px）*/
.prod-section-hd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.16rem;
}
.prod-section-hd__bar {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 0.06rem; /* 6px */
  height: 0.24rem; /* 24px */
  background-color: var(--c-primary-btn);
}
.prod-section-hd__title {
  font-family: var(--font-sans);
  font-size: 0.2rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.005rem;
  text-transform: uppercase;
  white-space: nowrap;
  line-height: 1.4;
}

/* 产品介绍区 */
.prod-intro {
  border-top: 1px solid rgba(193,199,211,0.1);
  padding: 1.29rem 0.4rem 0.64rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.32rem;
}
.prod-intro__paragraphs { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.24rem; }
.prod-intro__paragraphs p,
.prod-intro__paragraphs .prod-intro__block { font-family: var(--font-sans); font-size: 0.16rem; font-weight: 400; color: #414751; line-height: 1.625; }
.prod-intro__paragraphs .prod-intro__block > p:last-child { margin-bottom: 0; }

/* 技术详情区（#f8fafc 背景）*/
.prod-technical {
  background-color: #f8fafc;
  border-top: 1px solid rgba(193,199,211,0.1);
  border-bottom: 1px solid rgba(193,199,211,0.1);
  padding: 0.81rem 0.4rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.8rem;
}

/* 技术亮点区（左列图片 + 右列要点列表）*/
.tech-hl { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.32rem; }
.tech-hl__grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 0.48rem 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 0.48rem;
}
/* 左列：插图（background #e6e8ef） */
.tech-hl__img-wrap {
  background-color: #e6e8ef;
  border: 1px solid rgba(193,199,211,0.2);
  padding: 1px;
  overflow: hidden;
  position: relative;
  height: 2.75rem; /* ~275px */
}
.tech-hl__img {
  position: absolute;
  width: 100%; height: 178.34%;
  top: -39.17%; left: 0;
  -o-object-fit: cover; object-fit: cover;
  opacity: 0.8; display: block; max-width: none;
}
/* 图片上蓝色渐变 */
.tech-hl__img-gradient {
  position: absolute; inset: 0;
  background: linear-gradient(29deg, rgba(22,115,195,0.2) 0%, rgba(22,115,195,0) 100%);
}
/* 右列：要点列表 */
.tech-hl__list {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.16rem;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
}
.tech-hl__item {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  gap: 0.12rem; -webkit-box-align: flex-start; -ms-flex-align: start; align-items: flex-start;
}
.tech-hl__bullet {
  font-size: 0.16rem;
  color: var(--c-primary-btn);
  line-height: 1.625;
  -ms-flex-negative: 0; flex-shrink: 0;
  font-weight: 700;
}
.tech-hl__text {
  font-family: var(--font-sans); font-size: 0.16rem; font-weight: 400;
  color: #414751; line-height: 1.625;
}
.tech-hl__richtext {
  font-family: var(--font-sans); font-size: 0.16rem; font-weight: 400;
  color: #414751; line-height: 1.625;
}
.tech-hl__richtext p { margin: 0 0 0.12rem; }
.tech-hl__richtext p:last-child { margin-bottom: 0; }
.tech-hl__richtext ul,
.tech-hl__richtext ol { margin: 0.08rem 0 0; padding-left: 1.1em; }

/* 技术规格表区 */
.tech-specs-tbl { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.32rem; }
.tech-specs-tbl__wrap {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  overflow: hidden; padding: 0.32rem 0; width: 100%;
}
.tech-specs-tbl__img {
  /*max-width: 5.12rem; */
  width: 100%; height: auto;
  opacity: 0.9;
  mix-blend-mode: multiply;
  -o-object-fit: contain; object-fit: contain;
  display: block;
}

/* 下载中心区 */
.dl-center { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.32rem; }
.dl-grid {
  display: -ms-grid; display: grid;
  -ms-grid-columns: 1fr 0.24rem 1fr 0.24rem 1fr;
  grid-template-columns: repeat(3,1fr);
  gap: 0.24rem;
  width: 100%;
}
.dl-card {
  background-color: var(--c-white);
  border: 1px solid rgba(193,199,211,0.15);
  height: 0.86rem; /* 86px */
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
  padding: 0.25rem;
  -webkit-transition: border-color var(--transition); transition: border-color var(--transition);
}
.dl-card:hover { border-color: var(--c-primary); }
.dl-card__inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.16rem; }
.dl-card__file-icon { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }
.dl-card__file-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
.dl-card__title {
  font-family: var(--font-sans); font-size: 0.12rem; font-weight: 700;
  color: var(--c-text); letter-spacing: -0.003rem; text-transform: uppercase; line-height: 1.33;
}
.dl-card__size {
  font-family: var(--font-sans); font-size: 0.1rem; font-weight: 700;
  color: var(--c-text-slate); line-height: 1.5;
}
.dl-card__dl-icon { -ms-flex-negative: 0; flex-shrink: 0; -o-object-fit: contain; object-fit: contain; }

/* 应用案例区（3列，图片 + 标题 + 描述）*/
.app-cases { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.32rem; }
.case-grid {
  display: -ms-grid; display: grid;
  -ms-grid-columns: 1fr 0.32rem 1fr 0.32rem 1fr;
  grid-template-columns: repeat(3,1fr);
  gap: 0.32rem;
}
.case-card {
  background-color: var(--c-white);
  border: 1px solid rgba(193,199,211,0.1);
  overflow: hidden;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
}
.case-card__img-wrap {
  position: relative; width: 100%;
  height: 1.8rem; /* 180.36px */
  overflow: hidden; -ms-flex-negative: 0; flex-shrink: 0;
}
.case-card__img {
  position: absolute;
  width: 100%; height: 177.79%;
  top: -38.89%; left: 0;
  -o-object-fit: cover; object-fit: cover;
  display: block; max-width: none;
  /* 黑白效果 */
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
.case-card__body {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.113rem; padding: 0.24rem; -webkit-box-flex: 1; -ms-flex: 1; flex: 1;
}
.case-card__title {
  font-family: var(--font-sans); font-size: 0.16rem; font-weight: 700;
  color: var(--c-text); letter-spacing: -0.004rem; text-transform: uppercase; line-height: 1.5;
}
.case-card__desc {
  font-family: var(--font-sans); font-size: 0.12rem; font-weight: 400;
  color: #414751; line-height: 1.625;
}

/* 产品标题区蓝色副标题（18px，#005a9e，大写）*/
.prod-header-subtitle {
  font-family: var(--font-sans);
  font-size: 0.18rem;
  font-weight: 700;
  color: var(--c-primary);
  letter-spacing: -0.0045rem;
  text-transform: uppercase;
  line-height: 1.375;
}

/* 产品图像微调（该页面图片定位与 detail-product 略有不同）*/
.prod-img-fill {
  left: -6.35% !important;
  width: 112.7% !important;
}
.prod-img-wrap-lg {
  height: 5.52rem !important; /* 552px */
}

/* ============================================================
   PRODUCT DETAIL PAGE: RESPONSIVE
   ============================================================ */

@media (max-width: 1199px) {
  .prod-intro { padding: 48px 24px 40px; }
  .prod-intro__paragraphs p,
  .prod-intro__paragraphs .prod-intro__block { font-size: 1.4rem; }
  .prod-technical { padding: 48px 24px; gap: 48px; }
  .tech-hl__grid { grid-template-columns: 1fr; }
  .tech-hl__img-wrap { height: 220px; }
  .tech-hl__text { font-size: 1.4rem; }
  .tech-hl__bullet { font-size: 1.4rem; }
  .dl-grid { grid-template-columns: 1fr; gap: 16px; }
  .dl-card { height: auto; min-height: 70px; padding: 16px 20px; }
  .dl-card__title { font-size: 1.1rem; }
  .case-grid { grid-template-columns: 1fr; gap: 24px; }
  .case-card__img-wrap { height: 200px; }
  .case-card__title { font-size: 1.4rem; }
  .case-card__desc { font-size: 1.1rem; }
  .prod-section-hd__title { font-size: 1.6rem; }
  .prod-header-subtitle { font-size: 1.4rem; }
  .prod-img-wrap-lg { height: 320px !important; }
}

@media (max-width: 767px) {
  .prod-intro { padding: 32px 20px 32px; }
  .prod-intro__paragraphs p,
  .prod-intro__paragraphs .prod-intro__block { font-size: 1.3rem; }
  .prod-technical { padding: 32px 20px; }
  .tech-hl__img-wrap { height: 180px; }
  .dl-card { padding: 14px 16px; }
  .case-grid { grid-template-columns: repeat(2,1fr); gap: 16px; }
  .case-card__img-wrap { height: 140px; }
  .case-card__title { font-size: 1.2rem; }
  .prod-header-subtitle { font-size: 1.2rem; }
  .prod-img-wrap-lg { height: 240px !important; }
}

/* ============================================================
   ABOUT US PAGE（关于我们页面）
   Figma node-id: 1:1098
   ============================================================ */

/* ── Banner (Hero) ── */
.about-banner {
  position: relative;
  height: 5rem; /* 500px */
  margin-top: 1rem; /* offset fixed nav (100px) */
  overflow: hidden;
  background-color: var(--c-dark);
}
.about-banner__bg { position: absolute; inset: 0; }
.about-banner__bg-img {
  position: absolute;
  width: 100%; height: 100%;
  top: 0; left: 0;
  -o-object-fit: cover; object-fit: cover; display: block; max-width: none;
}
.about-banner__overlay {
  position: absolute; inset: 0;
  /*background-color: rgba(0, 90, 158, 0.2);*/
  mix-blend-mode: multiply;
}
.about-banner__container {
  position: relative; z-index: 1;
  max-width: 14rem; /* 1400px */
  width: 100%; height: 100%;
  margin: 0 auto;
  padding: 0 0.32rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
}
.about-banner__inner {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.24rem; max-width: 7.68rem;
}
.about-banner__h1 {
  font-family: var(--font-sans);
  font-size: 0.72rem;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: -0.036rem;
  text-transform: uppercase;
  line-height: 1;
}
.about-banner__h1-blue { color: #d3e4ff; }
.about-banner__subtitle-wrap {
  border-left: 4px solid var(--c-primary);
  padding-left: 0.28rem;
  max-width: 6.72rem;
}
.about-banner__subtitle {
  font-family: var(--font-sans);
  font-size: 0.2rem;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.625;
}
.about-banner__corner {
  position: absolute; bottom: 0; right: 0;
  width: 2.56rem; height: 2.56rem;
  border-right: 8px solid rgba(0, 90, 158, 0.2);
  border-bottom: 8px solid rgba(0, 90, 158, 0.2);
}

/* ── 通用区块标题 h2 ── */
.about-h2 {
  font-family: var(--font-sans);
  font-size: 0.48rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.012rem;
  text-align: center;
  line-height: 1.5;
}
.about-h2--white { color: #ffffff; }
.about-h2--light { color: #f8f9ff; }

/* ── 区块内容容器 ── */
.about-section-inner {
  max-width: 14rem;
  width: 100%;
  margin: 0 auto;
  padding: 0 0.32rem;
}

/* ── Section 01: Corporate Overview ── */
.about-overview {
  padding: 0.8rem 0; /* 80px */
}
.about-overview__grid {
  display: -ms-grid; display: grid;
  -ms-grid-columns: 1fr 0.64rem 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 0.64rem; /* 64px */
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  margin-top: 0.48rem;
}
.about-overview__text-col {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
}
.about-overview__profile-title {
  font-family: var(--font-sans);
  font-size: 0.6rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.03rem;
  text-transform: uppercase;
  line-height: 0.9;
  margin-bottom: 0.32rem;
}
.about-overview__desc {
  font-family: var(--font-sans);
  font-size: 0.18rem;
  font-weight: 400;
  color: var(--c-text-2);
  line-height: 1.625;
}
/* 右列：图片 + 偏移边框装饰 */
.about-overview__img-col {
  position: relative;
  min-height: 4rem; /* 400px */
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch;
}
.about-overview__img-wrap {
  position: relative;
  -webkit-box-flex: 1; -ms-flex: 1; flex: 1;
  min-height: 4rem;
  border: 1px solid rgba(193, 199, 211, 0.3);
  -webkit-box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);
  overflow: hidden;
}
.about-overview__img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  -o-object-fit: cover; object-fit: cover; display: block; max-width: none;
}
/* 偏移边框（右下各 20px 延伸）*/
.about-overview__img-border {
  position: absolute;
  top: 4px; left: 4px;
  right: -20px; bottom: -20px;
  border: 2px solid rgba(0, 90, 158, 0.2);
  pointer-events: none;
}

/* ── Section 02: Core Expertise ── */
.about-expertise {
  background-color: #f0f4f8;
  padding: 0.56rem 0; /* 56px 垂直，避免区块过疏 */
}
.about-expertise__tab-nav {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  gap: 0.16rem;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  margin-top: 0.32rem;
}
.about-tab-btn {
  padding: 0.13rem 0.33rem;
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 700;
  letter-spacing: 0.016rem;
  text-transform: uppercase;
  line-height: 1.5;
  border: 1px solid rgba(193, 199, 211, 0.3);
  background-color: var(--c-bg);
  color: var(--c-text);
  cursor: pointer;
  -webkit-transition: background-color var(--transition), color var(--transition), border-color var(--transition);
  transition: background-color var(--transition), color var(--transition), border-color var(--transition);
}
.about-tab-btn--active {
  background-color: var(--c-primary-btn);
  border-color: var(--c-primary-btn);
  color: #ffffff;
}
.about-tab-btn:focus-visible { outline: 2px solid var(--c-primary-btn); outline-offset: 2px; }
/* 标签内容面板 */
.about-tab-panel { display: none; }
.about-tab-panel--active { display: block; }
.about-expertise__panel-content {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.36rem;
  padding-top: 0.12rem;
}
.about-expertise__panel-head {
  max-width: 8.96rem; /* 896px */
}
.about-expertise__panel-h3 {
  font-family: var(--font-sans);
  font-size: 0.36rem;
  font-weight: 700;
  color: var(--c-primary);
  letter-spacing: -0.018rem;
  text-transform: uppercase;
  line-height: 1.11;
  margin-bottom: 0.16rem;
}
.about-expertise__panel-text {
  font-family: var(--font-sans);
  font-size: 0.18rem;
  font-weight: 400;
  color: var(--c-text-2);
  line-height: 1.625;
}
/* 3 列卡片 */
.about-expertise__cards {
  display: -ms-grid; display: grid;
  -ms-grid-columns: 1fr 0.22rem 1fr 0.22rem 1fr;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.22rem;
}
.about-exp-card {
  background-color: var(--c-bg);
  border: 1px solid rgba(193, 199, 211, 0.3);
  padding: 0.28rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start;
  gap: 0;
  min-height: 0;
  height: 100%;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.05); box-shadow: 0 1px 1px rgba(0,0,0,0.05);
}
.about-exp-card__icon-wrap {
  width: 0.56rem; height: 0.56rem;
  background-color: rgba(0, 90, 158, 0.1);
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  -ms-flex-negative: 0; flex-shrink: 0;
  margin-bottom: 0.2rem;
}
.about-exp-card__icon { -o-object-fit: contain; object-fit: contain; display: block; }
.about-exp-card__title {
  font-family: var(--font-sans);
  font-size: 0.24rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.006rem;
  text-transform: uppercase;
  line-height: 1.33;
  margin-bottom: 0.16rem;
}
.about-exp-card__text {
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 400;
  color: var(--c-text-2);
  line-height: 1.625;
}

/* ── Section 03: R&D & Manufacturing ── */
.about-rnd {
  padding: 1.6rem 0 0.8rem; /* pt-160 pb-80 */
}
.about-rnd__grid {
  display: -ms-grid; display: grid;
  -ms-grid-columns: 1fr 0.64rem 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 0.64rem;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  margin-top: 0.48rem;
}
/* 左列：照片 */
.about-rnd__photo-col {
  position: relative;
  height: 4.05rem; /* 405px */
}
/* 蓝色扩展背景框 */
.about-rnd__photo-bg {
  position: absolute;
  top: -0.232rem; right: 0; bottom: -0.088rem; left: 0;
  background-color: rgba(22, 115, 195, 0.1);
  border: 1px solid rgba(193, 199, 211, 0.15);
}
/* 照片卡片区域 */
.about-rnd__photo-inner {
  position: absolute;
  inset: 0.32rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
}
.about-rnd__photo-card {
  background-color: var(--c-bg);
  border: 1px solid rgba(193, 199, 211, 0.15);
  padding: 5px;
  position: relative;
  overflow: hidden;
  height: 3.2rem; /* 320px */
  -ms-flex-negative: 0; flex-shrink: 0;
}
.about-rnd__photo-img {
  position: absolute;
  width: 100%; height: 175.63%;
  top: -37.81%; left: 0;
  -o-object-fit: cover; object-fit: cover; display: block; max-width: none;
}
/* 右列：文本内容 */
.about-rnd__text-col {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.4rem;
}
.about-rnd__title {
  font-family: var(--font-sans);
  font-size: 0.36rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.018rem;
  text-transform: uppercase;
  line-height: 1;
}
.about-rnd__items {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.32rem;
}
.about-rnd-item {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  gap: 0.24rem; -webkit-box-align: flex-start; -ms-flex-align: start; align-items: flex-start;
}
.about-rnd-item__num-box {
  width: 0.48rem; height: 0.48rem;
  -ms-flex-negative: 0; flex-shrink: 0;
  border: 1px solid var(--c-primary);
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
}
.about-rnd-item__num {
  font-family: var(--font-sans);
  font-size: 0.2rem;
  font-weight: 700;
  color: var(--c-primary);
  line-height: 1.4;
  text-align: center;
}
.about-rnd-item__body {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.12rem;
}
.about-rnd-item__title {
  font-family: var(--font-sans);
  font-size: 0.2rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.005rem;
  text-transform: uppercase;
  line-height: 1.4;
}
.about-rnd-item__text {
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 400;
  color: var(--c-text-2);
  line-height: 1.625;
}
/* ISO 证书徽章 */
.about-rnd-badges {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  gap: 0.12rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  padding-top: 0.04rem;
  -ms-flex-wrap: wrap; flex-wrap: wrap;
}
.about-rnd-badge {
  background-color: #e6e8ef;
  border: 1px solid rgba(193, 199, 211, 0.3);
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 8px;
  padding: 5px 13px;
}
.about-rnd-badge__icon { width: 12px; height: 11px; -o-object-fit: contain; object-fit: contain; -ms-flex-negative: 0; flex-shrink: 0; }
.about-rnd-badge__text {
  font-family: var(--font-sans);
  font-size: 0.1rem;
  font-weight: 700;
  color: var(--c-primary);
  letter-spacing: 0.01rem;
  text-transform: uppercase;
  white-space: nowrap;
  line-height: 1.5;
}

/* ── Section 04: Applications & Global Reach ── */
.about-global {
  padding: 1.6rem 0 0.8rem;
}
.about-global__bg {
  background-color: var(--c-bg-alt);
  padding: 0.48rem; /* 48px */
  overflow: hidden;
  margin-top: 0.48rem;
}
.about-global__grid {
  display: -ms-grid; display: grid;
  -ms-grid-columns: 1fr 0.48rem 2fr;
  grid-template-columns: 1fr 2fr;
  gap: 0.48rem;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.about-global__text-col {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.24rem;
  padding-bottom: 0.32rem;
}
.about-global__title {
  font-family: var(--font-sans);
  font-size: 0.36rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.018rem;
  text-transform: uppercase;
  line-height: 1.11;
}
.about-global__text {
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 400;
  color: var(--c-text-2);
  line-height: 1.625;
}
/* 地图列 */
.about-global__map-col {
  position: relative;
  height: 4.5rem; /* 450px */
  border: 1px solid rgba(193, 199, 211, 0.3);
  overflow: hidden;
}
.about-global__map-img {
  position: absolute;
  width: 100%; height: 180.15%;
  top: -40.07%; left: 0;
  -o-object-fit: cover; object-fit: cover;
  display: block; max-width: none;
  opacity: 0.6;
}
/* 位置标记点 */
.about-global__pin {
  position: absolute;
  background-color: var(--c-primary);
}
.about-global__pin--sm  { width: 8px; height: 10px; }
.about-global__pin--md  { width: 8px; height: 10px; background-color: rgba(0,90,158,0.6); }
.about-global__pin--bar { width: 2%; height: 16px; background-color: var(--c-primary); }
.about-global__pin--dot { width: 4px; height: 10px; background-color: rgba(0,90,158,0.4); }

/* ── Section 05: Vision & Commitment ── */
.about-vision {
  background-color: #181c21;
  padding: 0.64rem 0 0.8rem;
  position: relative;
  overflow: hidden;
}
.about-vision__bg-vector {
  position: absolute;
  top: -0.64rem; right: 0;
  width: 6.42rem; height: 7.2rem;
  opacity: 0.1;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  overflow: hidden;
  pointer-events: none;
}
.about-vision__bg-vector img {
  width: 100%; height: auto; display: block; max-width: none;
}
.about-vision__inner {
  position: relative; z-index: 1;
  max-width: 14rem;
  margin: 0 auto;
  padding: 0 0.32rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 0.48rem;
}
.about-vision__content {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 0.4rem;
  max-width: 8.96rem;
}
.about-vision__title {
  font-family: var(--font-sans);
  font-size: 0.48rem;
  font-weight: 700;
  color: #f8f9ff;
  letter-spacing: -0.024rem;
  text-transform: uppercase;
  text-align: center;
  line-height: 1.25;
}
.about-vision__desc {
  font-family: var(--font-sans);
  font-size: 0.2rem;
  font-weight: 300;
  color: rgba(248, 249, 255, 0.8);
  text-align: center;
  line-height: 1.625;
  max-width: 6.72rem;
}
.about-vision__actions {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  gap: 0.32rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  padding-top: 0.08rem;
}
.about-vision__btn-primary {
  background-color: #f8f9ff;
  padding: 0.165rem 0.4rem 0.175rem;
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 700;
  color: var(--c-primary);
  letter-spacing: 0.016rem;
  text-transform: uppercase;
  white-space: nowrap;
  line-height: 1.5;
  border: none;
  cursor: pointer;
  -webkit-transition: background-color var(--transition); transition: background-color var(--transition);
}
.about-vision__btn-primary:hover { background-color: #dbeafe; }
.about-vision__btn-ghost {
  border: 1px solid rgba(248, 249, 255, 0.3);
  padding: 0.17rem 0.41rem;
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 700;
  color: #f8f9ff;
  letter-spacing: 0.016rem;
  text-transform: uppercase;
  white-space: nowrap;
  line-height: 1.5;
  background: none;
  cursor: pointer;
  -webkit-transition: border-color var(--transition), background-color var(--transition);
  transition: border-color var(--transition), background-color var(--transition);
}
.about-vision__btn-ghost:hover { border-color: rgba(248,249,255,0.7); background-color: rgba(248,249,255,0.05); }

/* ── About Us: Responsive ── */
@media (max-width: 1199px) {
  html { font-size: 62.5%; }

  .about-banner { margin-top: 70px; height: auto; min-height: 360px; padding: 60px 24px; }
  .about-banner__bg-img { height: 100%; top: 0; }
  .about-banner__container { padding: 0; max-width: 100%; }
  .about-banner__h1 { font-size: 4.8rem; }
  .about-banner__subtitle { font-size: 1.6rem; }
  .about-banner__inner { max-width: 100%; gap: 16px; }
  .about-banner__corner { width: 120px; height: 120px; }

  .about-h2 { font-size: 3.2rem; }
  .about-overview { padding: 60px 24px; }
  .about-overview__grid { grid-template-columns: 1fr; gap: 40px; }
  .about-overview__profile-title { font-size: 3.6rem; }
  .about-overview__desc { font-size: 1.5rem; }
  .about-overview__img-col { min-height: 280px; }
  .about-overview__img-wrap { min-height: 280px; }
  .about-overview__img-border { display: none; }

  .about-expertise { padding: 48px 24px; }
  .about-expertise__tab-nav { margin-top: 24px; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  .about-tab-btn { font-size: 1.2rem; padding: 10px 20px; }
  .about-expertise__panel-h3 { font-size: 2.4rem; }
  .about-expertise__panel-text { font-size: 1.4rem; }
  .about-expertise__cards { grid-template-columns: 1fr; gap: 16px; }
  .about-exp-card { min-height: auto; padding: 24px; }
  .about-exp-card__title { font-size: 1.8rem; }
  .about-exp-card__text { font-size: 1.3rem; }
  .about-exp-card__icon-wrap { width: 48px; height: 48px; }

  .about-rnd { padding: 80px 24px 60px; }
  .about-rnd__grid { grid-template-columns: 1fr; gap: 40px; }
  .about-rnd__title { font-size: 2.4rem; }
  .about-rnd-item__title { font-size: 1.6rem; }
  .about-rnd-item__text { font-size: 1.3rem; }
  .about-rnd__photo-col { height: 280px; }
  .about-rnd__photo-card { height: 220px; }
  .about-rnd-badge__text { font-size: 1rem; }
  .about-rnd-item__num { font-size: 1.6rem; }
  .about-rnd-item__num-box { width: 40px; height: 40px; }

  .about-global { padding: 80px 24px 60px; }
  .about-global__bg { padding: 32px; }
  .about-global__grid { grid-template-columns: 1fr; gap: 32px; }
  .about-global__title { font-size: 2.4rem; }
  .about-global__text { font-size: 1.3rem; }
  .about-global__map-col { height: 280px; }

  .about-vision { padding: 60px 24px; }
  .about-vision__title { font-size: 2.8rem; }
  .about-vision__desc { font-size: 1.5rem; max-width: 100%; }
  .about-vision__btn-primary,
  .about-vision__btn-ghost { font-size: 1.3rem; padding: 12px 28px; }
}

@media (max-width: 767px) {
  .about-banner { min-height: 300px; padding: 50px 20px; }
  .about-banner__h1 { font-size: 3.6rem; }
  .about-banner__subtitle { font-size: 1.4rem; }
  .about-overview { padding: 40px 20px; }
  .about-overview__profile-title { font-size: 2.8rem; }
  .about-expertise { padding: 36px 20px; }
  .about-expertise__cards { grid-template-columns: 1fr; }
  .about-rnd { padding: 48px 20px; }
  .about-global { padding: 40px 20px; }
  .about-global__bg { padding: 20px; }
  .about-vision { padding: 48px 20px; }
  .about-vision__title { font-size: 2.2rem; }
  .about-vision__actions { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 12px; }
}

/* ============================================================
   DOWNLOAD REGISTRATION MODAL（下载登记弹窗）
   Figma node-id: 1:1953 – 1:1997
   ============================================================ */

/* 遮罩层：fixed 全屏，默认隐藏；添加 .dl-modal-overlay--open 后显示 */
.dl-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 16px;
  background-color: rgba(24, 28, 33, 0.85);
  /* backdrop-filter 毛玻璃（Safari 需要 -webkit-）*/
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  /* 默认隐藏 */
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}
.dl-modal-overlay--open {
  opacity: 1;
  pointer-events: auto;
}

/* 弹窗主体 */
.dl-modal {
  background-color: #ffffff;
  border: 1px solid #e5e7eb;
  width: 576px;
  max-width: calc(100vw - 32px);
  position: relative;
  padding: 1px 1px 17px;
  /* 大阴影 */
  -webkit-box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  /* 入场动画 */
  -webkit-transform: translateY(12px) scale(0.98);
  -ms-transform: translateY(12px) scale(0.98);
  transform: translateY(12px) scale(0.98);
  -webkit-transition: -webkit-transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
  transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.dl-modal-overlay--open .dl-modal {
  -webkit-transform: translateY(0) scale(1);
  -ms-transform: translateY(0) scale(1);
  transform: translateY(0) scale(1);
}

/* 关闭按钮（右上角 16px 处）*/
.dl-modal__close {
  position: absolute;
  top: 16px; right: 16px;
  width: 28px; height: 28px;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  background: none; border: none;
  cursor: pointer;
  padding: 0;
  -webkit-transition: opacity var(--transition); transition: opacity var(--transition);
}
.dl-modal__close:hover { opacity: 0.6; }
.dl-modal__close:focus-visible { outline: 2px solid var(--c-primary-btn); outline-offset: 2px; }

/* 弹窗 Header（含标题行 + 副标题，底部边线）*/
.dl-modal__header {
  border-bottom: 1px solid #e5e7eb;
  padding: 32px 32px 33px;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 8px;
}

/* 标题行：蓝色竖线 + 标题文字 */
.dl-modal__title-row {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 12px;
}
.dl-modal__bar {
  -ms-flex-negative: 0; flex-shrink: 0;
  width: 6px; height: 24px;
  background-color: var(--c-primary-btn);
}
.dl-modal__title {
  font-family: var(--font-sans);
  font-size: 18px;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.9px;
  text-transform: uppercase;
  white-space: nowrap;
  line-height: 1.56;
}

/* 副标题（灰色注释行）*/
.dl-modal__subtitle {
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 700;
  color: var(--c-text-slate);
  letter-spacing: 2px;
  text-transform: uppercase;
  line-height: 1.5;
}

/* 表单区 */
.dl-modal__form {
  padding: 32px;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 24px;
}

/* 两列字段行 */
.dl-modal__row-2col {
  display: -ms-grid; display: grid;
  -ms-grid-columns: 1fr 24px 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

/* 单个字段（label + input）*/
.dl-modal__field {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 8px;
}

/* 字段标签 */
.dl-modal__label {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: 1.1px;
  text-transform: uppercase;
  line-height: 1.5;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline;
  gap: 2px;
}
.dl-modal__required {
  color: #dc2626;
  font-size: 11px;
  line-height: 1.5;
}

/* 输入框 & 文本域 */
.dl-modal__input,
.dl-modal__textarea {
  width: 100%;
  background-color: #f8fafc;
  border: 1px solid #6b7280;
  padding: 14px 17px;
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 400;
  color: var(--c-text);
  line-height: normal;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  -webkit-transition: border-color var(--transition); transition: border-color var(--transition);
  -webkit-box-sizing: border-box; box-sizing: border-box;
}
.dl-modal__input::-webkit-input-placeholder,
.dl-modal__textarea::-webkit-input-placeholder { color: #6b7280; }
.dl-modal__input:-ms-input-placeholder,
.dl-modal__textarea:-ms-input-placeholder  { color: #6b7280; }
.dl-modal__input::-ms-input-placeholder,
.dl-modal__textarea::-ms-input-placeholder { color: #6b7280; }
.dl-modal__input::placeholder,
.dl-modal__textarea::placeholder            { color: #6b7280; }
.dl-modal__input:focus,
.dl-modal__textarea:focus {
  border-color: var(--c-primary-btn);
  background-color: #ffffff;
}

/* 文本域独立高度（pt-13px pb-53px）*/
.dl-modal__textarea {
  padding-top: 13px;
  padding-bottom: 53px;
  resize: vertical;
  min-height: 80px;
}

/* Phone 行标签（含"(REQUIRED)"后缀）*/
.dl-modal__label-suffix {
  font-size: 10px;
  font-weight: 500;
  color: var(--c-text);
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-left: 4px;
}

/* 提交按钮行（右对齐）*/
.dl-modal__submit-row {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end;
  padding-top: 16px;
}

/* 提交按钮 */
.dl-modal__submit-btn {
  background-color: var(--c-primary-btn);
  border: none;
  display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 12px;
  padding: 16px 40px;
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 3.6px;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  -webkit-box-shadow: 0 10px 15px -3px rgba(22,115,195,0.2), 0 4px 6px -4px rgba(22,115,195,0.2);
  box-shadow: 0 10px 15px -3px rgba(22,115,195,0.2), 0 4px 6px -4px rgba(22,115,195,0.2);
  -webkit-transition: background-color var(--transition), -webkit-box-shadow var(--transition);
  transition: background-color var(--transition), box-shadow var(--transition);
}
.dl-modal__submit-btn:hover {
  background-color: var(--c-primary);
  -webkit-box-shadow: 0 20px 25px -5px rgba(22,115,195,0.25), 0 8px 10px -6px rgba(22,115,195,0.2);
  box-shadow: 0 20px 25px -5px rgba(22,115,195,0.25), 0 8px 10px -6px rgba(22,115,195,0.2);
}
.dl-modal__submit-btn:focus-visible { outline: 2px solid var(--c-primary-btn); outline-offset: 2px; }
.dl-modal__submit-btn img { -ms-flex-negative: 0; flex-shrink: 0; }

/* 下载卡片点击态（cursor pointer + hover 边框高亮）*/
.dl-card { cursor: pointer; }
.dl-card:focus-visible { outline: 2px solid var(--c-primary-btn); outline-offset: 2px; }

/* ── 响应式 ── */
@media (max-width: 599px) {
  .dl-modal__row-2col {
    grid-template-columns: 1fr;
  }
  .dl-modal__header { padding: 24px 20px; }
  .dl-modal__form   { padding: 20px; gap: 16px; }
  .dl-modal__title  { font-size: 15px; }
}

/* ============================================================
   MODERN BROWSER ENHANCEMENTS
   ============================================================ */
@supports ((-webkit-backdrop-filter: blur(8px)) or (backdrop-filter: blur(8px))) {
  .nav {
    background-color: rgba(248,249,255,0.92);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
}
@supports not (aspect-ratio: 3/4) {
  .product-card::before { content: ''; display: block; padding-top: 133.33%; }
}

/* ============================================================
   VIDEO ARCHIVE LIST PAGE（视频归档/列表页）
   Figma node-id: 1:559
   ============================================================ */

/* ── 主体 ── */
.vlist-main {
  padding-top: 1rem;            /* 100px — 让内容从固定 nav 下方开始 */
  background-color: var(--c-bg);
}

/* ── Banner Hero ── */
.vlist-banner {
  position: relative;
  height: 5rem;                 /* 400px */
  background-color: #0f172a;
  overflow: hidden;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
}
/* 背景图层（全幅，去饱和）*/
.vlist-banner__bg-wrap {
  position: absolute; inset: 0; pointer-events: none;
}
.vlist-banner__bg-img {
  position: absolute;
  width: 100%; height: 100%;
  top: 0%; left: 0;
  display: block; max-width: none;
  -o-object-fit: cover; object-fit: cover;
}
/* 去饱和叠层 */
/*.vlist-banner__sat {*/
/*  position: absolute; inset: 0;*/
/*  background: #ffffff;*/
/*  mix-blend-mode: saturation;*/
/*}*/
/* 海军蓝 multiply 遮罩 */
/*.vlist-banner__overlay {*/
/*  position: absolute; inset: 0;*/
/*  background-color: rgba(30, 58, 138, 0.4);*/
/*  mix-blend-mode: multiply;*/
/*}*/
/* 内容容器 */
.vlist-banner__container {
  position: relative; z-index: 1;
  max-width: 14rem;
  width: 100%;
  padding: 0 0.32rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.16rem;
  -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;
}
/* 短横线装饰（左蓝竖线 + 透明占位高 20px）*/
.vlist-banner__line {
  height: 20px; width: 100%;
  border-left: 4px solid var(--c-primary);
  padding-left: 0.36rem;
  opacity: 0.8;
}
/* 标题区 */
.vlist-banner__h1 {
  font-family: var(--font-sans);
  font-size: 0.48rem; font-weight: 700;
  color: #ffffff;
  letter-spacing: -0.024rem;
  text-transform: uppercase;
  line-height: 1;
}
.vlist-banner__h1-dim { color: rgba(255, 255, 255, 0.3); }

/* ── Content Section ── */
.vlist-content {
  max-width: 14rem; width: 100%;
  margin: 0 auto;
  padding: 0.8rem 0.32rem; /* py-80px px-32px */
  position: relative;
}
/* 页头行（下边框 + pb-25px）*/
.vlist-content-header {
  border-bottom: 1px solid rgba(193, 199, 211, 0.3);
  padding-bottom: 0.25rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: flex-end; -ms-flex-align: end; align-items: flex-end;
  -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
  margin-bottom: 0.48rem;
}
.vlist-content-title {
  font-family: var(--font-sans);
  font-size: 0.24rem; font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.006rem;
  text-transform: uppercase; line-height: 1.33;
}
.vlist-content-count {
  font-family: var(--font-sans);
  font-size: 0.14rem; font-weight: 400;
  color: var(--c-text-2); line-height: 1.43;
  margin-top: 0.08rem;
}
/* 操作按钮组 */
.vlist-actions {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  gap: 0.16rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.vlist-btn-filter {
  border: 1px solid rgba(193, 199, 211, 0.3);
  padding: 0.09rem 0.25rem;
  font-family: var(--font-sans);
  font-size: 0.12rem; font-weight: 700;
  color: var(--c-text);
  letter-spacing: 0.012rem;
  text-transform: uppercase; white-space: nowrap; line-height: 1.33;
  background: none; cursor: pointer;
  -webkit-transition: background-color var(--transition); transition: background-color var(--transition);
}
.vlist-btn-filter:hover { background-color: rgba(193,199,211,0.1); }
.vlist-btn-search {
  background-color: var(--c-primary-btn);
  padding: 0.09rem 0.24rem;
  font-family: var(--font-sans);
  font-size: 0.12rem; font-weight: 700;
  color: #ffffff;
  letter-spacing: 0.012rem;
  text-transform: uppercase; white-space: nowrap; line-height: 1.33;
  border: none; cursor: pointer;
  -webkit-transition: background-color var(--transition); transition: background-color var(--transition);
}
.vlist-btn-search:hover { background-color: var(--c-primary); }

a.vlist-btn-filter {
  text-decoration: none;
  display: inline-block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.vlist-btn-filter--active {
  border-color: var(--c-primary-btn);
  background-color: rgba(0, 90, 158, 0.08);
}
.vlist-archive-filters {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.vlist-archive-search {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.vlist-actions {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.vlist-archive-search .nav__search-input {
  min-width: 1.4rem;
}

/* ── Video Grid（3列）── */
.vlist-grid {
  display: -ms-grid; display: grid;
  -ms-grid-columns: 1fr 0.4rem 1fr 0.4rem 1fr;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.4rem; /* 40px */
  padding-bottom: 0.32rem;
}
/* ── 视频卡片 ── */
.vcard {
  position: relative;
  background-color: #ffffff;
  -webkit-box-shadow: 0 0 0 1px rgba(193, 199, 211, 0.1);
  box-shadow: 0 0 0 1px rgba(193, 199, 211, 0.1);
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-transition: -webkit-box-shadow var(--transition); transition: box-shadow var(--transition);
  text-decoration: none; color: inherit;
  overflow: hidden;
}
.vcard:hover { -webkit-box-shadow: 0 4px 20px rgba(0,0,0,0.1); box-shadow: 0 4px 20px rgba(0,0,0,0.1); }
/* 左上角装饰（悬停显示）*/
.vcard__corner {
  position: absolute; top: -1px; left: -1px;
  width: 16px; height: 16px;
  border-left: 2px solid var(--c-primary);
  border-top: 2px solid var(--c-primary);
  opacity: 0;
  z-index: 4;
  -webkit-transition: opacity var(--transition); transition: opacity var(--transition);
  pointer-events: none;
}
.vcard:hover .vcard__corner { opacity: 1; }
/* 缩略图区域 */
.vcard__thumb {
  position: relative;
  height: 2.3548rem; /* 235.48px */
  background-color: #e2e8f0;
  overflow: hidden;
  -ms-flex-negative: 0; flex-shrink: 0;
  z-index: 3;
}
.vcard__thumb-img {
  position: absolute;
  width: 100%; height: 177.79%;
  top: -38.9%; left: 0;
  display: block; max-width: none;
  -o-object-fit: cover; object-fit: cover;
  -webkit-transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease;
}
.vcard:hover .vcard__thumb-img { -webkit-transform: scale(1.03); transform: scale(1.03); }
/* 悬停播放遮罩 */
.vcard__thumb-play {
  position: absolute; inset: 0;
  background-color: rgba(0, 90, 158, 0.2);
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  opacity: 0;
  -webkit-transition: opacity var(--transition); transition: opacity var(--transition);
}
.vcard:hover .vcard__thumb-play { opacity: 1; }
.vcard__thumb-play-icon { width: 40px; height: 40px; display: block; -o-object-fit: contain; object-fit: contain; }
/* 时长角标 */
.vcard__thumb-time {
  position: absolute; bottom: 8px; right: 8px;
  background-color: rgba(24, 28, 33, 0.9);
  color: #f8f9ff;
  font-family: var(--font-sans);
  font-size: 0.1rem; font-weight: 700;
  letter-spacing: -0.005rem; white-space: nowrap;
  line-height: 1.5;
  padding: 4px 8px;
  z-index: 2;
}
/* 卡片内容区 */
.vcard__body {
  padding: 0.23rem 0.24rem 0.24rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.113rem;
  -webkit-box-flex: 1; -ms-flex: 1; flex: 1;
  z-index: 2;
  position: relative;
}
.vcard__title {
  font-family: var(--font-sans);
  font-size: 0.18rem; font-weight: 700;
  color: var(--c-text);
  text-transform: uppercase;
  line-height: 1.25;
}
.vcard__desc {
  font-family: var(--font-sans);
  font-size: 0.14rem; font-weight: 400;
  color: var(--c-text-2);
  line-height: 1.625;
  padding-bottom: 0.127rem;
}
/* 卡片底部：日期 + 链接 */
.vcard__footer {
  border-top: 1px solid rgba(193, 199, 211, 0.1);
  padding-top: 0.17rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
}
.vcard__date {
  font-family: var(--font-sans);
  font-size: 0.1rem; font-weight: 400;
  color: var(--c-text-2);
  text-transform: uppercase; white-space: nowrap;
  line-height: 1.5;
}
.vcard__link {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 4px; text-decoration: none;
}
.vcard__link-text {
  font-family: var(--font-sans);
  font-size: 0.1rem; font-weight: 700;
  color: var(--c-primary);
  letter-spacing: 0.01rem;
  text-transform: uppercase; white-space: nowrap;
  line-height: 1.5;
  -webkit-transition: color var(--transition); transition: color var(--transition);
}
.vcard__link:hover .vcard__link-text { color: var(--c-primary-btn); }
.vcard__link-icon { width: 8px; height: 8px; display: block; -o-object-fit: contain; object-fit: contain; }

/* ── 分页 ── */
.vlist-pagination {
  border-top: 1px solid rgba(193, 199, 211, 0.2);
  padding-top: 0.41rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.vlist-pag-inner {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  gap: 0.08rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.vlist-pag-btn {
  width: 40px; height: 40px;
  border: 1px solid rgba(193, 199, 211, 0.3);
  background: none; cursor: pointer;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  font-family: var(--font-sans);
  font-size: 0.12rem; font-weight: 700;
  color: var(--c-text);
  text-align: center; line-height: 1.33;
  -webkit-transition: background-color var(--transition), color var(--transition);
  transition: background-color var(--transition), color var(--transition);
  -ms-flex-negative: 0; flex-shrink: 0;
}
.vlist-pag-btn:hover:not(:disabled) { background-color: rgba(0,90,158,0.05); }
.vlist-pag-btn--active {
  background-color: var(--c-primary); border-color: var(--c-primary); color: #ffffff;
}
.vlist-pag-btn--active:hover { background-color: var(--c-primary); }
.vlist-pag-btn--disabled { opacity: 0.3; cursor: default; pointer-events: none; }
.vlist-pag-btn img { display: block; width: 7px; height: 12px; -o-object-fit: contain; object-fit: contain; }
.vlist-pag-ellipsis {
  padding: 0 0.08rem;
  font-family: var(--font-sans);
  font-size: 0.16rem; font-weight: 400;
  color: var(--c-text-2); line-height: 1.5;
}

/* ── Archive: Responsive ── */
@media (max-width: 1199px) {
  .vlist-main { padding-top: 70px; }
  .vlist-banner { height: auto; min-height: 240px; padding: 60px 24px; }
  .vlist-banner__bg-img { height: 100%; top: 0; }
  .vlist-banner__container { padding: 0; max-width: 100%; }
  .vlist-banner__h1 { font-size: 3.6rem; }
  .vlist-content { padding: 48px 24px; }
  .vlist-content-title { font-size: 2rem; }
  .vlist-content-count { font-size: 1.3rem; }
  .vlist-btn-filter, .vlist-btn-search { font-size: 1rem; padding: 8px 16px; }
  .vlist-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .vcard__thumb { height: 200px; }
  .vcard__thumb-img { height: 100%; top: 0; }
  .vcard__title { font-size: 1.4rem; }
  .vcard__desc { font-size: 1.2rem; }
  .vcard__date, .vcard__link-text { font-size: 1rem; }
  .vcard__thumb-time { font-size: 0.9rem; }
  .vlist-pag-btn { width: 36px; height: 36px; font-size: 1rem; }
}

@media (max-width: 767px) {
  .vlist-main { padding-top: 60px; }
  .vlist-banner { min-height: 200px; padding: 48px 20px; }
  .vlist-banner__h1 { font-size: 2.8rem; }
  .vlist-content { padding: 36px 20px; }
  .vlist-content-header { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 16px; }
  .vlist-grid { grid-template-columns: 1fr; gap: 20px; }
  .vcard__thumb { height: 220px; }
  .vlist-pagination { padding-top: 28px; }
}

/* ============================================================
   VIDEO DETAILS PAGE（视频详情页）
   Figma node-id: 1:906
   ============================================================ */

/* ── Banner ── */
.vd-banner {
  position: relative;
  height: 5rem;           /* 420px total — includes area behind fixed nav */
  background-color: #0f172a;
  overflow: hidden;
  margin-top: 1rem;        /* 100px: clear fixed nav for text */
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
}
/* 背景图层（含去饱和效果，整体 30% opacity）*/
.vd-banner__bg-wrap {
  position: absolute; inset: 0;
  opacity: 0.3;
  pointer-events: none;
}
.vd-banner__bg-img {
  position: absolute;
  width: 100%; height: 458.1%;
  top: -179.05%; left: 0;
  display: block; max-width: none;
  -o-object-fit: cover; object-fit: cover;
}
/* 白色 mix-blend-mode:saturation 叠层 → 图片变黑白 */
.vd-banner__sat {
  position: absolute; inset: 0;
  background: #ffffff;
  mix-blend-mode: saturation;
}
/* 左→右渐变遮罩（在 bg-wrap 之外，全不透明）*/
.vd-banner__gradient {
  position: absolute; inset: 0;
  background: -webkit-gradient(linear, left top, right top,
    from(#020617),
    color-stop(50%, rgba(15, 23, 42, 0.6)),
    to(rgba(15, 23, 42, 0)));
  background: linear-gradient(to right,
    #020617 0%,
    rgba(15, 23, 42, 0.6) 50%,
    rgba(15, 23, 42, 0) 100%);
}
/* 内容容器 */
.vd-banner__container {
  position: relative; z-index: 1;
  max-width: 14rem;
  width: 100%;
  padding: 0 0.32rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.08rem;
  -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;
}
.vd-banner__hline {
  width: 0.48rem; height: 1px;
  background-color: rgba(211, 228, 255, 0.3);
}
.vd-banner__h1 {
  font-family: var(--font-sans);
  font-size: 0.48rem;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: -0.024rem;
  text-transform: uppercase;
  line-height: 1;
}
.vd-banner__h1-dim { color: rgba(255, 255, 255, 0.3); }

/* ── Main Layout ── */
.vd-layout {
  max-width: 14rem;
  width: 100%;
  margin: 0 auto;
  padding: 0.48rem 0.32rem;
}
.vd-grid {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  gap: 0.48rem;
  -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;
}
/* 左列（视频播放器 + 说明） */
.vd-player-col {
  -webkit-box-flex: 2; -ms-flex: 2; flex: 2;
  min-width: 0;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.32rem;
}
/* 右列（侧边栏）*/
.vd-sidebar-col {
  -webkit-box-flex: 1; -ms-flex: 1; flex: 1;
  min-width: 0;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.32rem;
}

/* ── Video Player ── */
.vd-player {
  position: relative;
  background: #000000;
  border: 1px solid rgba(193, 199, 211, 0.1);
  overflow: hidden;
}
.vd-player__img-wrap {
  position: relative;
  height: 4.81rem; /* 481px */
  overflow: hidden;
}
.vd-player__img {
  position: absolute;
  width: 100%; height: 178.1%;
  top: -39.05%; left: 0;
  opacity: 0.6;
  display: block; max-width: none;
  -o-object-fit: cover; object-fit: cover;
}
.vd-player__img-sat {
  position: absolute; inset: 0;
  background: #ffffff;
  mix-blend-mode: saturation;
  pointer-events: none;
}
/* 播放按钮绝对居中 */
.vd-player__overlay {
  position: absolute; inset: 0;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
}
.vd-player__btn {
  width: 0.8rem; height: 0.8rem;  /* 80px */
  background-color: rgba(0, 90, 158, 0.9);
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  -ms-flex-negative: 0; flex-shrink: 0;
  border: none; cursor: pointer;
  -webkit-transition: background-color var(--transition); transition: background-color var(--transition);
}
.vd-player__btn:hover { background-color: rgba(0, 90, 158, 1); }
.vd-player__btn:focus-visible { outline: 2px solid #ffffff; outline-offset: 2px; }
.vd-player__play-icon { display: block; -o-object-fit: contain; object-fit: contain; }

.vd-player__video-el {
  display: block;
  width: 100%;
  min-height: 4.81rem;
  background: #000000;
}
.vd-player--embed .vd-player__embed {
  display: block;
  width: 100%;
  min-height: 4.81rem;
  border: 0;
}
.vd-player__poster-stack {
  cursor: pointer;
}
.vd-player.is-playing .vd-player__poster-stack {
  display: none;
}

/* ── Video Metadata ── */
.vd-meta {
  border-left: 1px solid rgba(0, 90, 158, 0.2);
  padding-left: 0.33rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.08rem;
}
.vd-meta__breadcrumb {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
  gap: 0.12rem;
  -ms-flex-wrap: wrap; flex-wrap: wrap;
}
.vd-meta__cat {
  font-family: var(--font-sans);
  font-size: 0.12rem; font-weight: 700;
  color: var(--c-primary);
  letter-spacing: 0.024rem;
  text-transform: uppercase; white-space: nowrap;
  line-height: 1.33;
}
.vd-meta__sep {
  font-family: var(--font-sans);
  font-size: 0.12rem; color: #c1c7d3; line-height: 1.33;
}
.vd-meta__date {
  font-family: var(--font-sans);
  font-size: 0.12rem; font-weight: 500;
  color: var(--c-text-2);
  letter-spacing: 0.006rem;
  text-transform: uppercase; white-space: nowrap;
  line-height: 1.33;
}
.vd-meta__title {
  font-family: var(--font-sans);
  font-size: 0.36rem; font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.009rem;
  text-transform: uppercase;
  line-height: 1;
}
.vd-meta__desc-wrap {
  border-top: 1px solid rgba(193, 199, 211, 0.2);
  padding-top: 0.49rem;
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.153rem;
}
.vd-meta__label {
  font-family: var(--font-sans);
  font-size: 0.12rem; font-weight: 700;
  color: var(--c-primary);
  letter-spacing: 0.012rem;
  text-transform: uppercase;
  line-height: 1.33;
}
.vd-meta__text {
  font-family: var(--font-sans);
  font-size: 0.14rem; font-weight: 400;
  color: var(--c-text-2);
  line-height: 1.625;
}
.vd-meta__text + .vd-meta__text { padding-top: 0.0795rem; }

/* ── Sidebar: Related Assets ── */
.vd-sidebar-header {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;
  -webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.vd-sidebar-title {
  font-family: var(--font-sans);
  font-size: 0.12rem; font-weight: 700;
  color: var(--c-text);
  letter-spacing: 0.036rem;
  text-transform: uppercase;
  line-height: 1.33;
}
.vd-sidebar-more {
  font-family: var(--font-sans);
  font-size: 0.1rem; font-weight: 700;
  color: var(--c-primary);
  text-decoration: none;
  line-height: 1.5;
}
.vd-sidebar-more:hover { text-decoration: underline; }
/* 相关视频列表 */
.vd-related-list {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  gap: 0.32rem;
  list-style: none;
}
.vd-related-item {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  gap: 0.16rem;
  -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;
  cursor: pointer;
}
.vd-related-item:hover .vd-related-thumb__img { opacity: 0.8; }
/* 缩略图 */
.vd-related-thumb {
  position: relative;
  width: 1.28rem; height: 0.8rem;  /* 128×80px */
  -ms-flex-negative: 0; flex-shrink: 0;
  background-color: #eceef5;
  border: 1px solid rgba(193, 199, 211, 0.1);
  overflow: hidden;
}
.vd-related-thumb__img {
  position: absolute;
  width: 100%; height: 161.54%;
  top: -30.77%; left: 0;
  display: block; max-width: none;
  -o-object-fit: cover; object-fit: cover;
  -webkit-transition: opacity var(--transition); transition: opacity var(--transition);
}
.vd-related-thumb__sat {
  position: absolute; inset: 0;
  background: #ffffff;
  mix-blend-mode: saturation;
  pointer-events: none;
}
/* 时长角标 */
.vd-related-thumb__time {
  position: absolute; bottom: 4px; right: 4px;
  background: #000000;
  color: #ffffff;
  font-family: var(--font-mono);
  font-size: 8px;  /* 固定像素 */
  line-height: 12px;
  padding: 0 4px;
  white-space: nowrap;
}
/* 相关视频文字信息 */
.vd-related-item__info {
  display: -webkit-box; display: -ms-flexbox; display: flex;
  -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
  -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
  -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;
  -webkit-box-flex: 1; -ms-flex: 1; flex: 1;
  -ms-flex-item-align: stretch; align-self: stretch;
}
.vd-related-item__title {
  font-family: var(--font-sans);
  font-size: 0.12rem; font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.003rem;
  text-transform: uppercase;
  line-height: 1.25;
}
.vd-related-item__sub {
  font-family: var(--font-mono);
  font-size: 0.1rem; font-weight: 400;
  color: var(--c-text-2);
  letter-spacing: 0.01rem;
  text-transform: uppercase;
  line-height: 1.5;
  margin-top: 4px;
}

/* ── Video Details: Responsive ── */
@media (max-width: 1199px) {
  .vd-banner { height: auto; min-height: 260px; padding: 100px 24px 60px; }
  .vd-banner__bg-img { height: 100%; top: 0; }
  .vd-banner__h1 { font-size: 3.6rem; }
  .vd-layout { padding: 40px 24px; }
  .vd-grid { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 40px; }
  .vd-player-col { -webkit-box-flex: none; -ms-flex: none; flex: none; width: 100%; }
  .vd-sidebar-col { -webkit-box-flex: none; -ms-flex: none; flex: none; width: 100%; }
  .vd-player__img-wrap { height: 400px; }
  .vd-player__img { height: 100%; top: 0; }
  .vd-player__btn { width: 60px; height: 60px; }
  .vd-meta__title { font-size: 2.4rem; }
  .vd-meta { padding-left: 20px; }
  .vd-meta__cat, .vd-meta__date, .vd-meta__sep,
  .vd-meta__label { font-size: 1rem; }
  .vd-meta__text { font-size: 1.3rem; }
  .vd-meta__desc-wrap { padding-top: 32px; }
  .vd-related-thumb { width: 120px; height: 72px; }
  .vd-related-thumb__img { height: 100%; top: 0; }
  .vd-sidebar-title { font-size: 1rem; }
  .vd-related-item__title { font-size: 1.1rem; }
  .vd-related-item__sub { font-size: 0.9rem; }
}

@media (max-width: 767px) {
  .vd-banner { min-height: 200px; padding: 80px 20px 40px; }
  .vd-banner__h1 { font-size: 2.8rem; }
  .vd-layout { padding: 32px 20px; }
  .vd-player__img-wrap { height: 240px; }
  .vd-related-list { gap: 24px; }
  .vd-related-thumb { width: 100px; height: 62px; }
  .vd-meta__title { font-size: 1.8rem; }
  .vd-related-item__title { font-size: 1rem; }
}

/* ============================================================
   PAGE: CONTACT US（Figma 节点 1:337，与 about-us 同头尾）
   图片均为 img/ 本地资源，无外链图
   ============================================================ */

.contact-page {
  background-color: var(--c-bg);
}

/* —— Hero 400px + 与固定导航的偏移 —— */
.contact-page__hero {
  position: relative;
  margin-top: 1rem;
  height: 5rem;
  overflow: hidden;
  background-color: var(--c-dark);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.contact-page__hero-media {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.contact-page__hero-img-wrap {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.contact-page__hero-img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0%;
  left: 0;
  -o-object-fit: cover;
  object-fit: cover;
  max-width: none;
  display: block;
  /*opacity: 0.4;*/
}
/*.contact-page__hero-sat {*/
/*  position: absolute;*/
/*  inset: 0;*/
/*  background: #ffffff;*/
/*  mix-blend-mode: saturation;*/
/*  pointer-events: none;*/
/*}*/
/*.contact-page__hero-gradient {*/
/*  position: absolute;*/
/*  inset: 0;*/
/*  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 90, 158, 0.8)), to(rgba(0, 90, 158, 0)));*/
/*  background: linear-gradient(90deg, rgba(0, 90, 158, 0.8) 0%, rgba(0, 90, 158, 0) 100%);*/
/*  pointer-events: none;*/
/*}*/
.contact-page__hero-container {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 14rem;
  margin: 0 auto;
  padding: 0 0.32rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.contact-page__hero-border {
  border-left: 4px solid #1673c3;
  padding: 0.24rem;
  background-color: rgba(0, 90, 158,0.5);
  min-height: 1.36rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.contact-page__hero-title {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 0.6rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03rem;
  color: var(--c-white);
}
.contact-page__hero-sub {
  margin: 0.54rem 0 0;
  font-family: var(--font-sans);
  font-size: 0.24rem;
  font-weight: 300;
  line-height: 1.333;
  letter-spacing: 0.024rem;
  text-transform: uppercase;
  color: #dbeafe;
}

/* —— 主区点阵背景 —— */
.contact-page__main {
  background-color: #f8f9ff;
  background-image:
    -webkit-gradient(linear, left top, right top, color-stop(2.5%, rgba(193, 199, 211, 0.1)), color-stop(2.5%, rgba(193, 199, 211, 0))),
    -webkit-gradient(linear, left top, left bottom, color-stop(2.5%, rgba(193, 199, 211, 0.1)), color-stop(2.5%, rgba(193, 199, 211, 0)));
  background-image:
    linear-gradient(90deg, rgba(193, 199, 211, 0.1) 2.5%, rgba(193, 199, 211, 0) 2.5%),
    linear-gradient(180deg, rgba(193, 199, 211, 0.1) 2.5%, rgba(193, 199, 211, 0) 2.5%);
  background-size: 40px 40px;
  padding: 0.96rem 2.6rem 1.28rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.contact-page__grid {
  max-width: 13.36rem;
  margin: 0 auto;
  padding: 0 0.32rem;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: minmax(0, 5fr) 0.64rem minmax(0, 7fr);
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 0 0.64rem;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: start;
}
.contact-page__aside {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.48rem;
  min-width: 0;
}

/* 左：联系信息卡 */
.contact-page__info {
  position: relative;
  background-color: #f2f3fb;
  padding: 0.32rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.32rem;
}
.contact-page__info-corner {
  position: absolute;
  top: 0;
  left: 0;
  width: 12px;
  height: 12px;
  border-top: 2px solid #005a9e;
  border-left: 2px solid #005a9e;
  pointer-events: none;
}
.contact-page__info-heading {
  margin: 0;
  position: relative;
  min-height: 0.36rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 0 0.08rem;
  line-height: 1.2;
}
.contact-page__info-heading-main {
  font-family: var(--font-sans);
  font-size: 0.3rem;
  font-weight: 700;
  color: #005a9e;
  text-transform: uppercase;
  letter-spacing: -0.0075rem;
  line-height: 1.2;
}
.contact-page__info-heading-info {
  font-family: var(--font-sans);
  font-size: 0.14rem;
  font-weight: 400;
  color: var(--c-text-2);
  line-height: 1.43;
}
.contact-page__info-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.32rem;
}
.contact-page__info-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.16rem;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}
.contact-page__info-icon {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  margin-top: 0.02rem;
  -o-object-fit: contain;
  object-fit: contain;
}
.contact-page__info-label {
  margin: 0 0 0.04rem;
  font-family: var(--font-sans);
  font-size: 0.18rem;
  font-weight: 700;
  color: var(--c-text);
  line-height: 1.56;
}
.contact-page__info-text {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 400;
  color: var(--c-text-2);
  line-height: 1.625;
}
.contact-page__info-text--mail { font-weight: 500; line-height: 1.5; }
.contact-page__info-phone-group { min-width: 0; }
.contact-page__info-phone-lines {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.16rem;
}
.contact-page__info-phone-main {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 0.18rem;
  font-weight: 500;
  color: var(--c-text-2);
  line-height: 1.56;
}
.contact-page__info-phone-sub {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 0.14rem;
  font-weight: 500;
  color: #64748b;
  line-height: 1.43;
}

/* QR */
.contact-page__qr {
  background-color: #f2f3fb;
  border: 1px solid rgba(193, 199, 211, 0.3);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 0.64rem 0.97rem;
  padding: 0.33rem 0.5rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.contact-page__qr-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.12rem;
}
.contact-page__qr-frame {
  width: 1.28rem;
  height: 1.28rem;
  padding: 9px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: var(--c-white);
  border: 1px solid rgba(193, 199, 211, 0.5);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.contact-page__qr-img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  display: block;
}
.contact-page__qr-caption {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 0.12rem;
  font-weight: 700;
  color: #005a9e;
  letter-spacing: 0.012rem;
  text-transform: uppercase;
  text-align: center;
  line-height: 1.33;
}

/* 右：表单卡片 */
.contact-page__form-section {
  min-width: 0;
  padding-bottom: 0.3rem;
}
.contact-page__form-card {
  background: var(--c-white);
  border: 1px solid rgba(193, 199, 211, 0.3);
  padding: 0.49rem 0.49rem 0.65rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.contact-page__form-head {
  margin-bottom: 0.4rem;
}
.contact-page__form-title {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 0.3rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.015rem;
  text-transform: uppercase;
  line-height: 1.2;
}
.contact-page__form-accent {
  width: 0.64rem;
  height: 4px;
  background: #005a9e;
  margin-top: 0.08rem;
}
.contact-page__form-lead {
  margin: 0.16rem 0 0;
  max-width: none;
  font-family: var(--font-sans);
  font-size: 0.14rem;
  font-weight: 400;
  color: var(--c-text-2);
  letter-spacing: 0.0035rem;
  line-height: 1.43;
}
.contact-page__form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.32rem;
}
.contact-page__form-rows {
  display: -ms-grid;
  display: grid;
  gap: 0.32rem;
}
.contact-page__form-rows--2 {
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.contact-page__field {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.08rem;
  min-width: 0;
}
.contact-page__field-label {
  font-family: var(--font-sans);
  font-size: 0.12rem;
  font-weight: 700;
  color: #005a9e;
  letter-spacing: 0.012rem;
  text-transform: uppercase;
  line-height: 1.33;
}
.contact-page__req { color: #ef4444; }
.contact-page__field-line {
  border-bottom: 2px solid var(--c-border);
  padding: 0.13rem 0 0.16rem;
  -webkit-transition: border-color 0.2s;
  transition: border-color 0.2s;
}
.contact-page__field-line:focus-within { border-bottom-color: #005a9e; }
.contact-page__input,
.contact-page__textarea,
.contact-page__select {
  display: block;
  width: 100%;
  border: none;
  background: transparent;
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 400;
  color: var(--c-text);
  line-height: 1.5;
  outline: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.contact-page__input::-webkit-input-placeholder,
.contact-page__textarea::-webkit-input-placeholder { color: #6b7280; }
.contact-page__input::-moz-placeholder,
.contact-page__textarea::-moz-placeholder { color: #6b7280; }
.contact-page__input:-ms-input-placeholder,
.contact-page__textarea:-ms-input-placeholder { color: #6b7280; }
.contact-page__input::placeholder,
.contact-page__textarea::placeholder { color: #6b7280; }
.contact-page__field-line--select {
  padding: 0.12rem 0 0.14rem;
}
.contact-page__select {
  padding-right: 0.4rem;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("../img/contact-form-chevron.png");
  background-repeat: no-repeat;
  background-position: right 0.04rem center;
  background-size: 12px auto;
}
.contact-page__field-line--textarea {
  padding: 0.12rem 0 0.56rem;
}
.contact-page__textarea {
  min-height: 1.2rem;
  resize: vertical;
  line-height: 1.5;
  resize: none;
}
.contact-page__form-actions {
  padding-top: 0.24rem;
}
.contact-page__submit {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 0.12rem;
  padding: 0.16rem 0.48rem;
  background: #1673c3;
  border: none;
  cursor: pointer;
  font-family: var(--font-sans);
  font-size: 0.16rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.016rem;
  text-transform: none;
  line-height: 1.5;
  -webkit-transition: background-color 0.2s;
  transition: background-color 0.2s;
}
.contact-page__submit:hover { background-color: #1261a8; }
.contact-page__submit-icon {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -o-object-fit: contain;
  object-fit: contain;
}

/* 联系页：留言提交成功提示 */
body.contact-success-dialog-open { overflow: hidden; }
.contact-success-dialog {
  position: fixed;
  inset: 0;
  z-index: 400;
  display: none;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0.24rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.contact-success-dialog[hidden] { display: none !important; }
.contact-success-dialog:not([hidden]) {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.contact-success-dialog__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.5);
  cursor: pointer;
}
.contact-success-dialog__panel {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 5.2rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: var(--c-white);
  border: 1px solid rgba(193, 199, 211, 0.3);
  -webkit-box-shadow: 0 0.24rem 0.48rem rgba(0, 0, 0, 0.18);
  box-shadow: 0 0.24rem 0.48rem rgba(0, 0, 0, 0.18);
  padding: 0.4rem 0.44rem 0.44rem;
}
.contact-success-dialog__bracket {
  position: absolute;
  width: 0.16rem;
  height: 0.16rem;
  border-color: #005a9e;
  border-style: solid;
  pointer-events: none;
}
.contact-success-dialog__bracket--tl { left: -1px; top: -1px; border-width: 2px 0 0 2px; }
.contact-success-dialog__bracket--br { right: -1px; bottom: -1px; border-width: 0 2px 2px 0; opacity: 0.2; }
.contact-success-dialog__title {
  margin: 0 0 0.2rem;
  font-family: var(--font-sans);
  font-size: 0.26rem;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.012rem;
  text-transform: uppercase;
  line-height: 1.25;
}
.contact-success-dialog__body {
  margin: 0 0 0.32rem;
  font-family: var(--font-sans);
  font-size: 0.15rem;
  font-weight: 400;
  color: var(--c-text-2);
  line-height: 1.5;
}
.contact-success-dialog__btn {
  display: inline-block;
  padding: 0.12rem 0.4rem;
  background: #1673c3;
  border: none;
  border-radius: 0;
  cursor: pointer;
  font-family: var(--font-sans);
  font-size: 0.15rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.012rem;
  line-height: 1.5;
  -webkit-transition: background-color 0.2s;
  transition: background-color 0.2s;
}
.contact-success-dialog__btn:hover,
.contact-success-dialog__btn:focus {
  background-color: #1261a8;
  outline: none;
}
.contact-success-dialog__btn:focus-visible {
  outline: 2px solid #005a9e;
  outline-offset: 2px;
}

/* 联系页：平板 / 手机 */
@media (max-width: 1199px) {
  .contact-page__hero { margin-top: 70px; height: auto; min-height: 260px; padding: 60px 24px; }
  .contact-page__hero-img { height: 100%; top: 0; opacity: 0.35; }
  .contact-page__hero-container { padding: 0; max-width: 100%; }
  .contact-page__hero-title { font-size: clamp(3.2rem, 6vw, 6rem); }
  .contact-page__hero-sub { font-size: 1.6rem; margin-top: 20px; }
  .contact-page__main { padding: 64px 24px 80px; }
  .contact-page__grid {
    max-width: 100%;
    padding: 0;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 48px;
  }
  .contact-page__form-section { padding-bottom: 0; }
  .contact-page__form-card { padding: 32px 28px 40px; }
  .contact-page__info-heading-main { font-size: 2.6rem; }
  .contact-page__info-heading-info { font-size: 1.3rem; }
  .contact-page__info-label { font-size: 1.7rem; }
  .contact-page__info-text { font-size: 1.5rem; }
  .contact-page__info-phone-main { font-size: 1.7rem; }
  .contact-page__info-phone-sub { font-size: 1.3rem; }
  .contact-page__form-title { font-size: 2.6rem; }
  .contact-page__form-lead { font-size: 1.3rem; }
  .contact-page__field-label { font-size: 1.2rem; }
  .contact-page__input,
  .contact-page__textarea,
  .contact-page__select { font-size: 1.6rem; }
  .contact-page__submit { font-size: 1.5rem; padding: 14px 32px; }
  .contact-page__qr-frame { width: 128px; height: 128px; }
  .contact-page__qr-caption { font-size: 1.2rem; }
  .contact-success-dialog__panel { max-width: 420px; padding: 28px 24px 32px; }
  .contact-success-dialog__title { font-size: 22px; }
  .contact-success-dialog__body { font-size: 15px; }
  .contact-success-dialog__btn { font-size: 15px; padding: 12px 28px; }
}

@media (max-width: 767px) {
  .contact-page__hero { margin-top: 60px; min-height: 220px; padding: 48px 20px; }
  .contact-page__hero-title { font-size: clamp(2.8rem, 9vw, 4.8rem); }
  .contact-page__hero-sub { font-size: 1.4rem; margin-top: 16px; letter-spacing: 0.1em; }
  .contact-page__main { padding: 48px 20px 64px; }
  .contact-page__grid { gap: 40px; }
  .contact-page__info { padding: 24px 20px; }
  .contact-page__form-card { padding: 24px 20px 32px; }
  .contact-page__form-rows--2 {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .contact-page__qr {
    padding: 24px 20px;
    gap: 32px;
  }
  .contact-success-dialog { padding: 16px; }
  .contact-success-dialog__panel { max-width: none; }
}