/* ============================================================
   观智悦心 · 页面区块样式  v2
   全局原则：不出现近黑色大面积底色，所有深色只作为文字或细线
   ============================================================ */

/* ============================================================
   导航 Header
   ============================================================ */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 150;
  height: var(--header-h);
  display: flex; align-items: center;
  transition: height var(--t-base) var(--e-out), background-color var(--t-base) var(--e-out),
    box-shadow var(--t-base) var(--e-out), backdrop-filter var(--t-base);
}
.site-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: transparent; transition: background-color var(--t-base);
}
.site-header.is-stuck {
  height: 72px;
  background: rgba(255, 255, 255, .82);
  backdrop-filter: saturate(180%) blur(18px);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  box-shadow: 0 8px 28px -22px rgba(16, 40, 24, .5);
}
.site-header.is-stuck::after { background: var(--c-line); }

.header-inner { display: flex; align-items: center; gap: var(--s-8); width: 100%; }

/* Logo */
.brand { display: flex; align-items: center; flex: none; }
.brand__logo { height: 44px; width: auto; display: block; }
.site-header.is-stuck .brand__logo { height: 40px; }

/* 主导航 */
.nav { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.nav__item { position: relative; }
.nav__link {
  display: flex; align-items: center; gap: 5px;
  padding: 10px 16px; border-radius: var(--r-sm);
  font-size: var(--fs-sm); color: var(--c-ink-2); font-weight: 500;
  transition: color var(--t-fast), background-color var(--t-fast);
  position: relative; white-space: nowrap;
}
.nav__link::after {
  content: ""; position: absolute; left: 16px; right: 16px; bottom: 5px; height: 1.5px;
  background: var(--c-brand-500); border-radius: 2px;
  transform: scaleX(0); transform-origin: center;
  transition: transform var(--t-base) var(--e-out);
}
.nav__item:hover > .nav__link, .nav__item:focus-within > .nav__link { color: var(--c-brand-700); }
.nav__item:hover > .nav__link::after, .nav__item:focus-within > .nav__link::after { transform: scaleX(1); }
.nav__caret { width: 9px; height: 9px; opacity: .5; transition: transform var(--t-base) var(--e-out); }
.nav__item:hover .nav__caret, .nav__item:focus-within .nav__caret { transform: rotate(180deg); }
.nav__item.is-active > .nav__link { color: var(--c-brand-700); font-weight: 600; }
.nav__item.is-active > .nav__link::after { transform: scaleX(1); }

/* 下拉面板 */
.nav__panel {
  position: absolute; top: calc(100% + 12px); left: 50%;
  transform: translate(-50%, 8px);
  min-width: 280px; padding: 10px;
  background: rgba(255, 255, 255, .97); backdrop-filter: blur(18px) saturate(180%);
  border: 1px solid var(--c-line); border-radius: var(--r-lg);
  box-shadow: var(--sh-lg);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity var(--t-base) var(--e-out), transform var(--t-base) var(--e-out), visibility var(--t-base);
}
.nav__item:hover .nav__panel, .nav__item:focus-within .nav__panel {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, 0);
}
.nav__panel::before { content: ""; position: absolute; top: -12px; left: 0; right: 0; height: 12px; }
/* ── 顶栏「产品中心」下拉 · MECT 四向（与产品区 tab 同一设计语言） ── */
.nav__panel--mect { min-width: 500px; padding: 0; overflow: hidden; }
.npm-hd {
  display: flex; align-items: baseline; gap: 10px;
  padding: 13px 18px 11px;
  border-bottom: 1px solid var(--c-line);
  background: linear-gradient(180deg, #F6FBF4, #FFFFFF);
}
.npm-hd__cn { font-size: var(--fs-sm); font-weight: 700; color: var(--c-ink); letter-spacing: .06em; }
.npm-hd__en { font-family: var(--font-latin); font-size: var(--fs-micro); letter-spacing: .16em; text-transform: uppercase; color: var(--c-brand-500); }
.npm-hd__d { margin-left: auto; font-size: var(--fs-xs); color: var(--c-mute); }
.npm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 10px; }
/* 单列变体：五观 / 五心 两行堆叠（顶栏下拉按五观五心分组） */
.npm-grid--col { grid-template-columns: 1fr; }
.npm-grid--col .npm-it__b { font-family: inherit; font-size: 14px; letter-spacing: .02em; }
.npm-it {
  display: flex; gap: 12px; align-items: flex-start; min-width: 0;
  padding: 12px 13px; border-radius: var(--r-md);
  transition: background-color var(--t-fast), transform var(--t-fast);
}
.npm-it:hover { background: var(--c-brand-050); transform: translateX(2px); }
.npm-it__b {
  width: 38px; height: 38px; flex: none; border-radius: 11px;
  display: grid; place-items: center;
  font-family: var(--font-latin); font-size: 15px; font-weight: 700;
  color: var(--c-brand-700);
  background: linear-gradient(150deg, #F0FAEC, #E2F3DE);
  border: 1px solid rgba(48, 174, 36, .16);
  transition: background-color var(--t-fast), color var(--t-fast), border-color var(--t-fast);
}
.npm-it:hover .npm-it__b { background: var(--c-brand-500); border-color: var(--c-brand-500); color: #fff; }
.npm-it__tx { min-width: 0; }
.npm-it__t { display: flex; align-items: baseline; gap: 7px; font-size: var(--fs-sm); font-weight: 700; color: var(--c-ink); }
.npm-it__t i { font-family: var(--font-latin); font-style: normal; font-size: 10px; letter-spacing: .13em; text-transform: uppercase; color: var(--c-brand-500); font-weight: 600; }
.npm-it__d { display: block; margin-top: 4px; font-size: var(--fs-xs); color: var(--c-mute); line-height: 1.55; }
.npm-ft {
  display: flex; align-items: center; justify-content: space-between;
  padding: 11px 18px;
  border-top: 1px solid var(--c-line);
  font-size: var(--fs-xs); font-weight: 600; color: var(--c-brand-700);
  background: #FBFDF9;
  transition: background-color var(--t-fast);
}
.npm-ft svg { width: 12px; height: 12px; }
.npm-ft:hover { background: var(--c-brand-050); }
.nav__link-i {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 11px 13px; border-radius: var(--r-md);
  transition: background-color var(--t-fast), transform var(--t-fast);
}
.nav__link-i:hover { background: var(--c-brand-050); transform: translateX(3px); }
/* 面板末尾「全部产品」：与上面四个分组用一道发丝线分开 */
.nav__link-i--all { margin-top: 6px; box-shadow: inset 0 1px 0 var(--c-line); }
.nav__link-i--all .nav__link-i__ico { background: var(--c-line-2); color: var(--c-slate); }
.nav__link-i--all:hover .nav__link-i__ico { background: var(--c-ink); color: #fff; }
.nav__link-i__ico {
  width: 34px; height: 34px; flex: none; border-radius: var(--r-sm);
  background: var(--c-brand-050); color: var(--c-brand-600);
  display: grid; place-items: center;
  transition: background-color var(--t-fast), color var(--t-fast);
}
.nav__link-i:hover .nav__link-i__ico { background: var(--c-brand-500); color: #fff; }
.nav__link-i__ico svg { width: 16px; height: 16px; }
.nav__link-i__t { display: block; font-size: var(--fs-sm); font-weight: 600; color: var(--c-ink); }
.nav__link-i__d { display: block; font-size: var(--fs-xs); color: var(--c-mute); margin-top: 3px; line-height: 1.55; }

.header-cta { display: flex; align-items: center; gap: var(--s-3); flex: none; margin-left: var(--s-4); }
/* 主导航主按钮：比常规按钮收一点，避免头部过重 */
.header-cta__main { padding-inline: var(--s-5); }

/* 汉堡 */
.burger {
  display: none; width: 44px; height: 44px; border-radius: var(--r-sm);
  margin-left: auto; place-items: center;
}
.burger span { display: block; width: 20px; height: 1.8px; background: var(--c-ink); border-radius: 2px; transition: transform var(--t-base) var(--e-out), opacity var(--t-fast); }
.burger span + span { margin-top: 5px; }
.burger.is-open span:nth-child(1) { transform: translateY(6.8px) rotate(45deg); }
.burger.is-open span:nth-child(2) { opacity: 0; }
.burger.is-open span:nth-child(3) { transform: translateY(-6.8px) rotate(-45deg); }

/* 移动端抽屉 */
.drawer {
  position: fixed; inset: 0; z-index: 190;
  background: rgba(16, 32, 24, .42); backdrop-filter: blur(4px);
  opacity: 0; visibility: hidden; transition: opacity var(--t-base), visibility var(--t-base);
}
.drawer.is-open { opacity: 1; visibility: visible; }
.drawer__panel {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(420px, 88vw);
  background: var(--c-paper); box-shadow: -20px 0 60px -30px rgba(16, 40, 24, .5);
  transform: translateX(100%); transition: transform var(--t-slow) var(--e-out);
  display: flex; flex-direction: column;
  overflow-y: auto; overscroll-behavior: contain;
}
.drawer.is-open .drawer__panel { transform: none; }
.drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 20px var(--s-6); border-bottom: 1px solid var(--c-line); }
.drawer__close { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--c-mist); transition: background var(--t-fast), transform var(--t-fast); }
.drawer__close:hover { background: var(--c-line); transform: rotate(90deg); }
.drawer__close svg { width: 15px; height: 15px; }
.drawer__body { padding: var(--s-5) var(--s-6) var(--s-9); flex: 1; }
.drawer__group { border-bottom: 1px solid var(--c-line-2); }
.drawer__row { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 16px 2px; font-size: 1.02rem; font-weight: 600; color: var(--c-ink); text-align: left; }
.drawer__row svg { width: 14px; height: 14px; color: var(--c-mute); transition: transform var(--t-base) var(--e-out); }
.drawer__group.is-open .drawer__row svg { transform: rotate(180deg); color: var(--c-brand-600); }
.drawer__sub { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--t-slow) var(--e-out); }
.drawer__group.is-open .drawer__sub { grid-template-rows: 1fr; }
.drawer__sub-inner { overflow: hidden; }
.drawer__sub a { display: block; padding: 10px 0 10px 14px; font-size: var(--fs-sm); color: var(--c-slate); border-left: 2px solid var(--c-line); transition: color var(--t-fast), border-color var(--t-fast), padding-left var(--t-fast); }
.drawer__sub a:hover { color: var(--c-brand-700); border-color: var(--c-brand-400); padding-left: 18px; }
.drawer__foot { padding: var(--s-6); border-top: 1px solid var(--c-line); background: var(--c-mist); }

/* ============================================================
   一 · Hero 首屏
   ============================================================ */

.hero {
  position: relative; min-height: 100vh; min-height: 100svh;
  display: flex; align-items: center;
  padding-top: calc(var(--header-h) + 40px);
  padding-bottom: 72px;
  overflow: hidden;
  background:
    radial-gradient(54% 46% at 86% 4%, rgba(48, 174, 36, .15), transparent 64%),
    radial-gradient(46% 40% at 2% 96%, rgba(0, 102, 180, .11), transparent 66%),
    radial-gradient(40% 34% at 62% 100%, rgba(186, 192, 96, .13), transparent 68%),
    linear-gradient(180deg, #FCFEFC 0%, #F4FAF6 54%, #FFFFFF 100%);
}
.hero__bg { position: absolute; inset: 0; z-index: 0; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .14; }
.hero__bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, rgba(252, 254, 252, .96) 12%, rgba(248, 252, 249, .86) 46%, rgba(244, 250, 246, .6) 76%, rgba(255, 255, 255, .78) 100%);
}
.hero__canvas { position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: .5; }
/* 斜向光带（极淡，只做节奏） */
.hero__sweep {
  position: absolute; z-index: 1; top: -30%; left: -20%;
  width: 42%; height: 160%; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .8), transparent);
  transform: rotate(8deg);
  animation: heroSweep 12s var(--e-inout) infinite;
}
@keyframes heroSweep { 0% { transform: translateX(-30%) rotate(8deg); opacity: 0; } 30% { opacity: .8; } 100% { transform: translateX(300%) rotate(8deg); opacity: 0; } }

.hero__inner {
  position: relative; z-index: 3; width: 100%;
  display: grid; grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
  gap: clamp(36px, 5vw, 84px); align-items: center;
}
.hero__copy { max-width: 700px; }
.hero__title { margin-top: var(--s-6); letter-spacing: -.012em; }
/* 「身心健康」四个字走 Logo 绿：起点取 Logo 原绿，末端略微压深以保证大字可读 */
.hero__title .accent {
  background: linear-gradient(96deg, var(--c-brand-500) 4%, var(--c-brand-600) 92%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  white-space: nowrap;
}
.hero__lead { margin-top: var(--s-6); max-width: 660px; }
/* 首屏正文里的四个环节：加重、上 Logo 蓝，与上方小标同色，扫读时能一眼抓到 */
.hero__hl { color: var(--c-tech-600); font-weight: 600; }
.hero__actions { margin-top: var(--s-9); display: flex; flex-wrap: wrap; gap: var(--s-4); }

.hero__meta {
  margin-top: var(--s-11); padding-top: var(--s-6);
  border-top: 1px solid var(--c-line);
  display: flex; flex-wrap: wrap; gap: clamp(24px, 4.4vw, 64px);
}
.hero__meta-item { display: flex; flex-direction: column; gap: 4px; }
.hero__meta-num { font-family: var(--font-latin); font-size: clamp(1.9rem, 2.6vw, 2.5rem); color: var(--c-brand-600); line-height: 1; letter-spacing: .01em; }
.hero__meta-num i { font-style: normal; font-size: .5em; margin-left: 3px; color: var(--c-mute); }
.hero__meta-txt { font-size: var(--fs-xs); color: var(--c-mute); letter-spacing: .02em; }

/* ---------- 右侧视觉：五观五心矩阵环 ---------- */
.hero__visual { position: relative; }
.hero__matrix {
  position: relative; width: 100%; margin-inline: auto;
  /* 大屏放大，同时用视口高度兜住，保证图例不被压出首屏 */
  max-width: min(clamp(600px, 46vw, 820px), calc(100svh - 250px));
  aspect-ratio: 1 / 1;
}

/* 两条轨道：外环五观（绿）、内环五心（蓝），缓慢反向旋转 */
.hm__ring {
  position: absolute; left: 50%; top: 50%; border-radius: 50%;
  transform: translate(-50%, -50%); pointer-events: none;
}
.hm__ring--o {
  width: 80%; height: 80%;
  border: 1px dashed rgba(48, 174, 36, .38);
  animation: hmSpin 72s linear infinite;
}
.hm__ring--o::after {
  content: ""; position: absolute; inset: 7.5%;
  border-radius: 50%; border: 1px solid rgba(48, 174, 36, .1);
}
.hm__ring--i {
  width: 50%; height: 50%;
  border: 1px solid rgba(0, 102, 180, .22);
  animation: hmSpin 48s linear infinite reverse;
}
@keyframes hmSpin { to { transform: translate(-50%, -50%) rotate(360deg); } }

/* 中心光晕 */
.hm__glow {
  position: absolute; left: 50%; top: 50%; width: 64%; height: 64%;
  transform: translate(-50%, -50%); border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255, 255, 255, .96) 0%, rgba(48, 174, 36, .1) 44%, transparent 72%);
  filter: blur(8px);
  animation: hmGlow 9s var(--e-inout) infinite;
}
@keyframes hmGlow { 0%, 100% { opacity: .75; } 50% { opacity: 1; } }

/* 中心读数 */
.hm__core {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 29%; aspect-ratio: 1; border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
  text-align: center;
  background: radial-gradient(circle at 50% 26%, #FFFFFF 0%, #F5FAF6 56%, #E8F3EB 100%);
  border: 1px solid rgba(255, 255, 255, .95);
  box-shadow: 0 26px 52px -30px rgba(16, 40, 24, .4), inset 0 0 0 1px rgba(48, 174, 36, .1);
}
.hm__core-k {
  font-family: var(--font-latin); font-size: clamp(.46rem, .6vw, .6rem);
  letter-spacing: .2em; text-transform: uppercase; color: var(--c-brand-600);
}
.hm__core-n {
  font-family: var(--font-latin); font-size: clamp(1.55rem, 2.5vw, 2.2rem);
  line-height: 1.05; color: var(--c-ink); letter-spacing: .01em;
}
/* 中心位放产品名（悦康）时改用中文字形与更克制的字号 */
.hm__core-n--cn {
  font-family: inherit; font-weight: 700;
  font-size: clamp(1.15rem, 1.85vw, 1.6rem); letter-spacing: .06em;
}
.hm__core-t { font-size: clamp(.6rem, .76vw, .74rem); color: var(--c-mute); letter-spacing: .08em; }

/* 产品节点：位置由 JS 按极坐标写进 left/top（百分比），随容器等比缩放 */
.hm__list { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; }
.hm__node {
  position: absolute; transform: translate(-50%, -50%);
  width: clamp(50px, 4.95vw, 70px);
  display: flex; flex-direction: column; align-items: center; gap: 7px;
}
.hm__node-p {
  width: 100%; aspect-ratio: 1; border-radius: 50%; overflow: hidden;
  display: grid; place-items: center;
  background: #FFFFFF; border: 1px solid rgba(255, 255, 255, .95);
  outline: 3px solid rgba(255, 255, 255, .55); outline-offset: 0;
  box-shadow: 0 12px 24px -16px rgba(16, 40, 24, .5), inset 0 0 0 1px rgba(48, 174, 36, .1);
  animation: hmNodeFloat 9s var(--e-inout) infinite;
  animation-delay: calc(var(--i) * -.7s);
}
.hm__node--guan .hm__node-p { box-shadow: 0 12px 24px -16px rgba(16, 40, 24, .5), inset 0 0 0 1.5px rgba(48, 174, 36, .3); }
.hm__node-p img { width: 92%; height: 92%; object-fit: contain; }
@keyframes hmNodeFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
.hm__node-t {
  font-size: clamp(.6rem, .72vw, .74rem); letter-spacing: .06em;
  color: var(--c-ink-2); white-space: nowrap;
}
.hm__node--xin .hm__node-t { color: var(--c-slate); }

/* 图例：说明两条环各代表什么，替代原先压在环上的浮卡 */
.hm__legend {
  margin-top: clamp(14px, 1.6vw, 22px);
  display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 22px;
}
.hm__legend-i { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-sm); color: var(--c-mute); }
.hm__legend-i b { font-weight: 600; color: var(--c-ink-2); letter-spacing: .08em; }
.hm__dot { width: 6px; height: 6px; border-radius: 50%; flex: none; }
.hm__dot--o { background: var(--c-brand-500); box-shadow: 0 0 0 3px rgba(48, 174, 36, .14); }
.hm__dot--i { background: var(--c-tech-500); box-shadow: 0 0 0 3px rgba(0, 102, 180, .12); }


/* 滚动提示 */
.hero__scroll {
  position: absolute; left: 50%; bottom: 30px; z-index: 5;
  transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  font-size: var(--fs-micro); letter-spacing: .2em; text-transform: uppercase; color: var(--c-mute);
}
.hero__scroll-line { width: 1px; height: 44px; background: linear-gradient(180deg, var(--c-brand-300), transparent); position: relative; overflow: hidden; }
.hero__scroll-line::after { content: ""; position: absolute; top: -44px; left: 0; width: 1px; height: 44px; background: var(--c-brand-500); animation: scrollLine 2.2s var(--e-inout) infinite; }
@keyframes scrollLine { 0% { transform: translateY(0); } 100% { transform: translateY(88px); } }

/* ============================================================
   二 · 关于我们（公司简介）
   ============================================================ */
.about { background: #FFFFFF; overflow: hidden; }
.about__grid {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(40px, 5vw, 88px); align-items: center;
}
.about__title { margin-top: var(--s-4); }
.about__title em {
  font-style: normal;
  background: linear-gradient(96deg, var(--c-brand-500), var(--c-brand-600) 60%, var(--c-tech-600));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.about__lead { margin-top: var(--s-5); max-width: 62ch; }

.about__facts { margin-top: var(--s-9); border-top: 1px solid var(--c-line); }
.about__fact {
  display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: var(--s-5);
  align-items: baseline; padding: 18px 0;
  border-bottom: 1px solid var(--c-line-2);
  transition: transform var(--t-base) var(--e-out);
}
.about__fact:hover { transform: translateX(4px); }
.about__fact-n { font-family: var(--font-latin); font-size: 1.55rem; color: var(--c-brand-500); line-height: 1.1; }
.about__fact-n i { font-style: normal; font-size: .5em; color: var(--c-mute); margin-left: 2px; }
.about__fact-t { display: block; font-size: var(--fs-h4); font-weight: 600; color: var(--c-ink); }
.about__fact-d { display: block; margin-top: 3px; font-size: var(--fs-xs); color: var(--c-mute); line-height: 1.65; }

.about__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4); }
.ab-card {
  position: relative; padding: 26px 24px 24px; border-radius: var(--r-lg);
  background: linear-gradient(180deg, #FFFFFF 0%, #F9FCF8 100%);
  border: 1px solid var(--c-line);
  overflow: hidden; isolation: isolate;
  transition: transform .45s var(--e-out), box-shadow .45s var(--e-out), border-color .45s var(--e-out);
}
.ab-card::after {
  content: ""; position: absolute; right: -34px; top: -34px; z-index: -1;
  width: 130px; height: 130px; border-radius: 50%;
  background: radial-gradient(circle, rgba(48, 174, 36, .18), transparent 70%);
  opacity: 0; transition: opacity .5s var(--e-out), transform .5s var(--e-out);
  transform: scale(.8);
}
.ab-card:hover { transform: translateY(-5px); box-shadow: var(--sh-lg); border-color: var(--c-brand-200); }
.ab-card:hover::after { opacity: 1; transform: scale(1); }
.ab-card__i {
  position: absolute; right: 18px; top: 14px;
  font-family: var(--font-latin); font-size: 2.6rem; line-height: 1; color: var(--c-brand-100);
  transition: color var(--t-base);
}
.ab-card:hover .ab-card__i { color: var(--c-brand-200); }
.ab-card__k { display: block; font-size: var(--fs-micro); letter-spacing: .14em; text-transform: uppercase; color: var(--c-brand-600); }
.ab-card__t { display: block; margin-top: 10px; font-size: 1.1rem; font-weight: 700; color: var(--c-ink); letter-spacing: .02em; }
.ab-card__d { display: block; margin-top: 8px; font-size: var(--fs-xs); color: var(--c-slate); line-height: 1.7; }

/* 使命 / 愿景 */
.about__mv {
  position: relative; z-index: 2; margin-top: clamp(40px, 5vw, 72px);
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  border-radius: var(--r-xl); overflow: hidden;
  border: 1px solid var(--c-line);
  background:
    radial-gradient(60% 120% at 0% 0%, rgba(48, 174, 36, .10), transparent 62%),
    radial-gradient(60% 120% at 100% 100%, rgba(0, 102, 180, .09), transparent 62%),
    linear-gradient(120deg, #FBFEF9, #F6FBFD);
}
.about__mv-item { padding: clamp(28px, 3.4vw, 48px); position: relative; }
.about__mv-item + .about__mv-item { border-left: 1px solid var(--c-line); }
/* 使命：左侧一道极淡的品牌绿光，与愿景的蓝光区分 */
.about__mv-item--mission::after {
  content: ""; position: absolute; left: 0; top: 18%; bottom: 18%; width: 2px;
  border-radius: 2px; background: linear-gradient(180deg, transparent, var(--c-brand-300), transparent);
}
.about__mv-tag { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-micro); letter-spacing: .18em; text-transform: uppercase; color: var(--c-brand-600); }
.about__mv-tag::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c-brand-500); }
.about__mv-item--vision .about__mv-tag { color: var(--c-tech-600); }
.about__mv-item--vision .about__mv-tag::before { background: var(--c-tech-600); }
.about__mv-t { margin-top: var(--s-4); font-size: clamp(1.2rem, 1.7vw, 1.55rem); font-weight: 700; line-height: 1.42; color: var(--c-ink); }
.about__mv-d { margin-top: var(--s-3); font-size: var(--fs-sm); color: var(--c-slate); line-height: 1.8; }

/* ============================================================
   三 · 产品矩阵（监测 / 体验 / 辅导 / 训练）
   ============================================================ */
/* 四方向切换：监测 / 体验 / 辅导 / 训练 */
.pm-tabs {
  margin-top: var(--s-8); padding: 6px;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px;
  background: var(--c-sage); border: 1px solid var(--c-line); border-radius: var(--r-xl);
}
.pm-tab {
  position: relative; text-align: left; padding: 17px 20px 22px; border-radius: var(--r-lg);
  transition: background var(--t-base) var(--e-out), box-shadow var(--t-base) var(--e-out);
}
.pm-tab::before {
  content: ""; position: absolute; left: 20px; right: 20px; bottom: 8px; height: 2px;
  background: linear-gradient(90deg, var(--c-tech-600), var(--c-tech-400));
  transform: scaleX(0); transform-origin: left; border-radius: 2px;
  transition: transform var(--t-base) var(--e-out);
}
.pm-tab__top { display: flex; align-items: baseline; gap: 8px; }
.pm-tab__l { font-family: var(--font-latin); font-size: .76rem; letter-spacing: .14em; color: var(--c-brand-400); }
.pm-tab__cn { font-size: 1.12rem; font-weight: 700; color: var(--c-ink); letter-spacing: .04em; }
.pm-tab__en { display: block; margin-top: 2px; font-family: var(--font-latin); font-size: var(--fs-micro); letter-spacing: .16em; text-transform: uppercase; color: var(--c-mute); }
.pm-tab__d { display: block; margin-top: 9px; font-size: var(--fs-xs); color: var(--c-slate); line-height: 1.55; }
/* 方向图标：右上角，激活时点亮，与导航下拉形成同一语言 */
.pm-tab__ico {
  position: absolute; right: 18px; top: 18px; width: 19px; height: 19px;
  color: var(--c-brand-300); opacity: .55;
  transition: color var(--t-base) var(--e-out), opacity var(--t-base) var(--e-out);
}
.pm-tab:hover .pm-tab__ico { opacity: .85; }
.pm-tab.is-active .pm-tab__ico { color: var(--c-brand-500); opacity: 1; }
.pm-tab:hover { background: rgba(255, 255, 255, .6); }
.pm-tab.is-active { background: #FFFFFF; box-shadow: 0 12px 28px -18px rgba(16, 40, 24, .4); }
.pm-tab.is-active::before { transform: scaleX(1); }
.pm-tab.is-active .pm-tab__cn { color: var(--c-brand-700); }
.pm-tab.is-active .pm-tab__l { color: var(--c-brand-500); }
.pm-tab.is-active .pm-tab__d { color: var(--c-slate); }

.pm-grid { margin-top: var(--s-7); display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-5); }
.pm-grid.is-fading { opacity: 0; transform: translateY(8px); }
.pm-grid { transition: opacity .3s var(--e-out), transform .3s var(--e-out); }

.pm-card {
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--c-paper); border: 1px solid var(--c-line); border-radius: var(--r-lg);
  transition: transform var(--t-base) var(--e-out), box-shadow var(--t-base) var(--e-out), border-color var(--t-base);
}
.pm-card > a { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
.pm-card:hover { transform: translateY(-5px); box-shadow: var(--sh-lg); border-color: var(--c-brand-200); }
.pm-card__media { position: relative; aspect-ratio: 4 / 3; background: linear-gradient(158deg, #FAFDF9 0%, #EDF6EE 100%); }
.pm-card__media img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain; padding: 16px;
  transition: transform .7s var(--e-out);
}
.pm-card:hover .pm-card__media img { transform: scale(1.05); }
.pm-card__body { padding: 18px 22px 22px; border-top: 1px solid var(--c-line-2); display: flex; flex-direction: column; flex: 1; }
.pm-card__series {
  display: inline-flex; align-self: flex-start;
  padding: 3px 10px; border-radius: var(--r-pill);
  background: rgba(48, 174, 36, .08);
  font-size: var(--fs-micro); letter-spacing: .08em; color: var(--c-brand-700);
}
.pm-card__name { margin-top: 10px; font-size: 1.16rem; font-weight: 700; color: var(--c-ink); letter-spacing: .03em; }
.pm-card__pos { margin-top: 6px; font-size: var(--fs-sm); color: var(--c-mute); line-height: 1.6; flex: 1; }
.pm-card__more { margin-top: 16px; display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-xs); font-weight: 600; color: var(--c-brand-700); }
.pm-card__more svg { width: 13px; height: 13px; transition: transform var(--t-fast); }
.pm-card:hover .pm-card__more svg { transform: translateX(3px); }

/* 沐心：两种形态轮播（多层种植机 / 桌面种植箱） */
.pm-card__media--roll img { opacity: 0; animation: pmRoll 8s var(--e-inout) infinite; }
@keyframes pmRoll {
  0% { opacity: 1; } 45% { opacity: 1; } 50% { opacity: 0; } 95% { opacity: 0; } 100% { opacity: 1; }
}
.pm-dots { position: absolute; left: 0; right: 0; bottom: 9px; display: flex; justify-content: center; gap: 5px; }
.pm-dots i { width: 4px; height: 4px; border-radius: 50%; background: rgba(20, 40, 28, .16); }
.pm-dots i:nth-child(1) { animation: pmDotA 8s steps(1, end) infinite; }
.pm-dots i:nth-child(2) { animation: pmDotB 8s steps(1, end) infinite; }
@keyframes pmDotA { 0% { background: var(--c-brand-500); } 50% { background: rgba(20, 40, 28, .16); } }
@keyframes pmDotB { 0% { background: rgba(20, 40, 28, .16); } 50% { background: var(--c-brand-500); } }

.pm-card--empty .pm-card__media {
  display: grid; place-items: center;
  background: repeating-linear-gradient(45deg, #F9FBF8, #F9FBF8 9px, #F1F6F1 9px, #F1F6F1 18px);
}
.pm-empty { text-align: center; color: var(--c-mute); }
.pm-empty svg { width: 26px; height: 26px; color: var(--c-brand-200); }
.pm-empty p { margin-top: 7px; font-size: var(--fs-xs); }

/* 产品中心 · 视觉打磨（结构不变，仅轻量提质） */
.pm-tab { cursor: pointer; }
.pm-tabs { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .65); }
.pm-tab.is-active { box-shadow: 0 14px 30px -18px rgba(16, 40, 24, .45); }
.pm-card { box-shadow: 0 1px 2px rgba(16, 40, 24, .05); }
.pm-card__media { background: linear-gradient(155deg, #F4FAF1 0%, #E7F3E8 55%, #DCEFE0 100%); }
.pm-card--empty .pm-card__media { border: 1px dashed rgba(48, 174, 36, .28); }
.pm-card--empty .pm-empty p { color: var(--c-brand-600); }

.pm-foot {
  margin-top: var(--s-8); padding: var(--s-6) var(--s-8);
  display: flex; align-items: center; justify-content: space-between; gap: var(--s-6); flex-wrap: wrap;
  background: rgba(255, 255, 255, .8); border: 1px solid var(--c-line); border-radius: var(--r-lg);
}
.pm-foot p { font-size: var(--fs-sm); color: var(--c-slate); max-width: 62ch; line-height: 1.75; }

/* ============================================================
   四 · 技术框架（只保留四块标题 + 动效）
   ============================================================ */
.tech {
  position: relative; overflow: hidden;
  background:
    radial-gradient(50% 42% at 8% 4%, rgba(0, 102, 180, .13), transparent 64%),
    radial-gradient(46% 40% at 94% 92%, rgba(75, 157, 217, .16), transparent 66%),
    linear-gradient(180deg, #FFFFFF 0%, #F4F9FE 56%, #FAFDff 100%);
}
.tech__bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.tech__bg::before {
  content: ""; position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(0, 102, 180, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 102, 180, .05) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(70% 62% at 50% 42%, #000 14%, transparent 76%);
  -webkit-mask-image: radial-gradient(70% 62% at 50% 42%, #000 14%, transparent 76%);
}
.tech__blob { position: absolute; border-radius: 50%; filter: blur(72px); opacity: .6; will-change: transform; }
.tech__blob--a { width: 460px; height: 460px; left: -140px; top: -100px; background: radial-gradient(circle, rgba(0, 102, 180, .20), transparent 70%); animation: techBlob 18s var(--e-inout) infinite; }
.tech__blob--b { width: 500px; height: 500px; right: -160px; bottom: -140px; background: radial-gradient(circle, rgba(0, 102, 180, .18), transparent 70%); animation: techBlob 22s var(--e-inout) infinite reverse; }
@keyframes techBlob { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(48px, 36px) scale(1.14); } }

.tech__inner { position: relative; z-index: 2; }
.tech__head { text-align: center; max-width: 900px; margin: 0 auto; }
.tech__head .t-h2 { margin-top: var(--s-4); }
.tech__head .t-lead { margin-top: var(--s-4); }

.tf-grid {
  margin-top: clamp(44px, 5vw, 76px);
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--s-5);
}
.tf-card {
  position: relative; isolation: isolate;
  padding: 38px 28px 34px; min-height: 236px;
  border-radius: var(--r-xl);
  background: linear-gradient(180deg, #FFFFFF 0%, #FBFDFF 100%);
  border: 1px solid var(--c-line);
  display: flex; flex-direction: column; align-items: center; text-align: center;
  overflow: hidden;
  transition: transform .45s var(--e-out), box-shadow .45s var(--e-out), border-color .45s var(--e-out);
}
.tf-card::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, var(--c-tech-600), var(--c-tech-400));
  transform: scaleX(0); transform-origin: left center;
  transition: transform .6s var(--e-out);
}
.tf-card::after {
  content: ""; position: absolute; right: -60px; top: -60px; z-index: -1;
  width: 190px; height: 190px; border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 102, 180, .13), transparent 70%);
  opacity: 0; transform: scale(.85);
  transition: opacity .55s var(--e-out), transform .55s var(--e-out);
}
.tf-card:hover { transform: translateY(-8px); box-shadow: 0 30px 56px -30px rgba(0, 102, 180, .34); border-color: var(--c-tech-300); }
.tf-card:hover::before { transform: scaleX(1); }
.tf-card:hover::after { opacity: 1; transform: scale(1); }

.tf-card__n {
  font-family: var(--font-latin); font-size: 2.6rem; line-height: 1; letter-spacing: .04em;
  color: var(--c-tech-100);
  -webkit-text-stroke: 1.2px var(--c-tech-300);
  transition: -webkit-text-stroke-color .45s var(--e-out), transform .45s var(--e-out);
}
.tf-card:hover .tf-card__n { -webkit-text-stroke-color: var(--c-tech-600); transform: translateY(-2px); }
.tf-card__t { margin-top: var(--s-9); font-size: clamp(1.1rem, 1.35vw, 1.3rem); font-weight: 700; color: var(--c-ink); letter-spacing: .02em; line-height: 1.4; }
/* 单行标题也预留两行高度，四卡的英文注脚才能落在同一基线 */
.tf-card__t { min-height: 2.8em; }
.tf-card__en {
  margin-top: 12px; font-size: var(--fs-xs); font-weight: 600;
  letter-spacing: .04em; color: var(--c-tech-600);
}
/* 模型名：放大并居中（移除英文注脚下做整体收敛） */
.tf-card__model {
  margin-top: var(--s-7);
  font-size: clamp(1.2rem, 1.7vw, 1.5rem);
  font-weight: 700; color: var(--c-ink); letter-spacing: .02em; line-height: 1.4;
  text-align: center;
}
.tf-card__dot {
  position: absolute; left: 28px; top: 30px;
  width: 7px; height: 7px; border-radius: 50%; background: var(--c-line);
  transition: background-color .45s var(--e-out), box-shadow .45s var(--e-out);
}
.tf-card:hover .tf-card__dot { background: var(--c-tech-600); box-shadow: 0 0 0 5px rgba(0, 102, 180, .16); }

/* ============================================================
   五 · AI + 园艺
   ============================================================ */
.garden {
  position: relative; overflow: hidden;
  background:
    radial-gradient(46% 42% at 6% 0%, rgba(186, 192, 96, .20), transparent 62%),
    radial-gradient(42% 38% at 96% 88%, rgba(48, 174, 36, .14), transparent 66%),
    linear-gradient(180deg, #FBFDF6 0%, #F4FAEC 46%, #FBFDF9 100%);
}
.garden__grid {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr);
  gap: clamp(36px, 5vw, 84px); align-items: center;
}
.garden__media {
  position: relative; border-radius: var(--r-3xl); overflow: hidden;
  aspect-ratio: 5 / 4;
  box-shadow: 0 44px 80px -46px rgba(16, 40, 24, .38);
  border: 1px solid rgba(255, 255, 255, .8);
  background: var(--c-sage);
}
.garden__media img {
  width: 100%; height: 100%; object-fit: cover;
  transform: scale(1.08); will-change: transform;
}
.garden__media::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(8, 34, 18, 0) 40%, rgba(8, 34, 18, .34) 62%, rgba(8, 34, 18, .72) 100%);
}
.garden__badge {
  position: absolute; left: 20px; top: 20px; z-index: 3;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 15px; border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .92); backdrop-filter: blur(10px);
  font-size: var(--fs-xs); font-weight: 600; color: var(--c-lime-700);
  box-shadow: var(--sh-md);
}
.garden__badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--c-lime-500); animation: limePulse 2.6s var(--e-out) infinite; }
@keyframes limePulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(186, 192, 96, .5); } 60% { box-shadow: 0 0 0 8px rgba(186, 192, 96, 0); } }
.garden__caption {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
  padding: 28px; display: flex; align-items: flex-end; justify-content: space-between; gap: var(--s-4);
  color: #fff; text-shadow: 0 1px 12px rgba(6, 26, 14, .55);
}
.garden__caption > span { display: block; min-width: 0; }
.garden__caption-t { display: block; font-size: 1.05rem; font-weight: 700; line-height: 1.45; }
.garden__caption-d { display: block; font-size: var(--fs-xs); color: rgba(255, 255, 255, .84); margin-top: 5px; line-height: 1.5; }
.garden__caption .btn { text-shadow: none; }

.garden__list { margin-top: var(--s-7); }
.garden__item {
  display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: var(--s-5);
  padding: 22px 0; border-bottom: 1px dashed var(--c-line);
  transition: transform var(--t-base) var(--e-out);
}
.garden__item:first-child { border-top: 1px dashed var(--c-line); }
.garden__item:hover { transform: translateX(4px); }
.garden__n {
  width: 38px; height: 38px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--c-lime-100); color: var(--c-lime-700);
  font-family: var(--font-latin); font-size: .82rem; letter-spacing: .04em;
  transition: background-color .4s var(--e-out), color .4s var(--e-out);
}
.garden__item:hover .garden__n { background: var(--c-lime-500); color: #fff; }
.garden__t { display: block; font-size: var(--fs-h4); font-weight: 700; color: var(--c-ink); }
.garden__d { display: block; margin-top: 5px; font-size: var(--fs-sm); color: var(--c-slate); line-height: 1.75; }
.garden__actions { margin-top: var(--s-8); display: flex; flex-wrap: wrap; gap: var(--s-3); }
/* 沉浸式体验：内容字号适度收敛 */
.garden .t-h2 { font-size: clamp(1.5rem, 2.4vw, 2.1rem); line-height: 1.34; }
.garden .t-lead { font-size: clamp(1rem, 1vw, 1.1rem); line-height: 1.78; }
.garden__t { font-size: 1rem; }
.garden__caption-t { font-size: .98rem; }

.garden__mq { margin-top: clamp(44px, 5vw, 72px); padding: 20px 0; border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
/* 让园艺段收得紧一点，避免与下一段之间留出过大的空白 */
.garden { padding-bottom: clamp(56px, 6vw, 96px); }
.garden__mq .mq__track { gap: 0; }
.garden__mq-i { display: inline-flex; align-items: center; gap: 26px; padding-right: 26px; font-family: var(--font-latin); font-size: clamp(1rem, 1.5vw, 1.28rem); letter-spacing: .06em; color: var(--c-brand-700); white-space: nowrap; }
.garden__mq-i::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c-lime-500); flex: none; }

/* ============================================================
   六 · 应用场景拼版
   ============================================================ */
/* 顶部接着园艺段的浅色，避免两段浅底之间出现"空洞" */
#scenes { background: linear-gradient(180deg, var(--c-haze) 0%, #FFFFFF 22%, #FFFFFF 100%); padding-bottom: clamp(56px, 5.6vw, 96px); }
/* 收紧「应用场景 ↔ 合作伙伴」之间的段间距，使其比默认更紧凑、与上方节奏协调 */
#partners { padding-top: clamp(56px, 5.6vw, 96px); }
/* 解决方案：六个场景等宽排列（3 × 2） */
/* 应用场景标题：两行同一层级，构成一组标题 */
.sec-head__title--sub {
  margin-top: 6px;
  font-weight: 700;
}

.sol { margin-top: clamp(26px, 3.2vw, 42px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.5vw, 18px); }

.sol-card {
  position: relative; overflow: hidden; display: block; width: 100%; text-align: left;
  border-radius: var(--r-xl); background: var(--c-sage);
  box-shadow: var(--sh-sm); aspect-ratio: 16 / 12;
  transition: box-shadow var(--t-base) var(--e-out), transform var(--t-base) var(--e-out);
}
.sol-card--main { aspect-ratio: 16 / 8.4; }
.sol-card:hover { box-shadow: var(--sh-xl); transform: translateY(-4px); }
.sol-card img { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 1.2s var(--e-out); }
.sol-card:hover img { transform: scale(1.05); }
/* 遮罩：品牌深绿，保证白字在明亮实景照片上依然可读 */
.sol-card__scrim {
  position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(10, 40, 20, .90) 0%, rgba(10, 40, 20, .52) 36%, rgba(10, 40, 20, .12) 66%, rgba(10, 40, 20, 0) 92%);
  transition: background var(--t-base);
}
.sol-card:hover .sol-card__scrim {
  background: linear-gradient(0deg, rgba(10, 40, 20, .93) 0%, rgba(10, 40, 20, .62) 40%, rgba(10, 40, 20, .18) 70%, rgba(10, 40, 20, 0) 94%);
}
.sol-card__body {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: clamp(18px, 2.2vw, 30px); padding-bottom: clamp(20px, 2.4vw, 34px);
  color: #fff; text-shadow: 0 1px 12px rgba(6, 24, 12, .5);
}
.sol-card__en {
  display: block; font-family: var(--font-latin); font-size: var(--fs-micro);
  letter-spacing: .18em; text-transform: uppercase; color: var(--c-lime-300);
}
.sol-card__t {
  display: block; margin-top: 6px;
  font-size: clamp(1.1rem, 1.42vw, 1.36rem); font-weight: 700; letter-spacing: .02em;
}
.sol-card--main .sol-card__t { font-size: clamp(1.5rem, 2.2vw, 2.05rem); }
.sol-card__d {
  display: block; margin-top: 8px; max-width: 32ch;
  font-size: var(--fs-xs); color: rgba(255, 255, 255, .82); line-height: 1.6;
}
.sol-card__go {
  position: absolute; right: clamp(16px, 1.8vw, 24px); top: clamp(16px, 1.8vw, 24px);
  width: 38px; height: 38px; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .42);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  color: #fff; opacity: 0; transform: translateY(-4px);
  transition: opacity var(--t-base) var(--e-out), transform var(--t-base) var(--e-out), background var(--t-fast);
}
.sol-card:hover .sol-card__go { opacity: 1; transform: none; background: var(--c-brand-500); border-color: var(--c-brand-500); }
.sol-card__go svg { width: 14px; height: 14px; }

/* ============================================================
   七 · 内容中心
   ============================================================ */
.content-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: var(--s-6); align-items: start; }
.content-feature { position: relative; border-radius: var(--r-xl); overflow: hidden; box-shadow: var(--sh-lg); display: block; width: 100%; text-align: left; }
.content-feature__media { aspect-ratio: 16 / 9.6; position: relative; overflow: hidden; }
.content-feature__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--e-out); }
.content-feature:hover .content-feature__media img { transform: scale(1.05); }
.content-feature__scrim { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20, 61, 30, .88) 0%, rgba(20, 61, 30, .36) 46%, transparent 82%); }
.content-feature__body { position: absolute; left: 0; right: 0; bottom: 0; padding: clamp(24px, 3vw, 40px); color: #fff; }
.content-feature__t { font-size: clamp(1.2rem, 1.9vw, 1.7rem); font-weight: 700; line-height: 1.42; margin-top: var(--s-3); display: block; }
.content-feature__meta { margin-top: var(--s-4); display: flex; gap: var(--s-4); font-size: var(--fs-xs); color: rgba(255, 255, 255, .72); }
.content-side { display: grid; gap: var(--s-5); }
.content-item { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: var(--s-5); align-items: center; text-align: left; width: 100%; }
.content-item__media { position: relative; aspect-ratio: 4 / 3; border-radius: var(--r-md); overflow: hidden; }
.content-item__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--e-out); }
.content-item:hover .content-item__media img { transform: scale(1.06); }
.content-item__t { display: block; font-size: 1.04rem; font-weight: 600; color: var(--c-ink); line-height: 1.5; }
.content-item:hover .content-item__t { color: var(--c-brand-700); }
.content-item__m { display: block; margin-top: 8px; font-size: var(--fs-xs); color: var(--c-mute); }

.video-badge {
  position: absolute; left: 10px; bottom: 10px; z-index: 2;
  width: 34px; height: 34px; border-radius: 50%;
  background: rgba(255, 255, 255, .94); color: var(--c-brand-700);
  display: grid; place-items: center; box-shadow: var(--sh-md);
  transition: transform var(--t-base) var(--e-out), background var(--t-fast);
}
.content-item:hover .video-badge, .content-feature:hover .video-badge { transform: scale(1.1); background: var(--c-brand-500); color: #fff; }
.video-badge svg { width: 12px; height: 12px; margin-left: 2px; }

.content-video {
  position: relative; margin-top: var(--s-6); border-radius: var(--r-xl); overflow: hidden;
  aspect-ratio: 21 / 8; display: block; width: 100%; text-align: left; box-shadow: var(--sh-md);
}
.content-video img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--e-out); }
.content-video:hover img { transform: scale(1.04); }
.content-video__scrim { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 40, 20, .82) 0%, rgba(10, 40, 20, .40) 52%, rgba(10, 40, 20, .05) 100%); }
.content-video__body { position: absolute; inset: 0; display: flex; align-items: center; gap: var(--s-6); padding: clamp(24px, 4vw, 48px); color: #fff; }
.content-video__play {
  width: 70px; height: 70px; flex: none; border-radius: 50%;
  background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .44);
  backdrop-filter: blur(10px); display: grid; place-items: center;
  transition: all var(--t-base) var(--e-out);
}
.content-video:hover .content-video__play { background: var(--c-brand-500); border-color: var(--c-brand-500); transform: scale(1.08); }
.content-video__play svg { width: 20px; height: 20px; margin-left: 3px; }

.content-filter { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-bottom: var(--s-8); }
.cf-btn { padding: 8px 18px; border-radius: var(--r-pill); font-size: var(--fs-sm); color: var(--c-slate); border: 1px solid var(--c-line); background: #fff; transition: all var(--t-base) var(--e-out); }
.cf-btn:hover { border-color: var(--c-brand-300); color: var(--c-brand-700); }
.cf-btn.is-active { background: var(--c-brand-050); border-color: var(--c-brand-200); color: var(--c-brand-700); font-weight: 600; }

.empty-state {
  grid-column: 1 / -1; text-align: center; padding: var(--s-12) var(--s-6);
  border: 1px dashed var(--c-line); border-radius: var(--r-lg); background: var(--c-mist);
}
.empty-state__ico { width: 44px; height: 44px; margin: 0 auto var(--s-4); color: var(--c-mute); opacity: .5; }
.empty-state__t { font-size: var(--fs-h4); color: var(--c-ink); }
.empty-state__d { margin-top: 8px; font-size: var(--fs-sm); color: var(--c-mute); }
.empty-state .btn { margin-top: var(--s-5); }

.skeleton { background: linear-gradient(100deg, var(--c-line-2) 30%, #F7FAF9 50%, var(--c-line-2) 70%); background-size: 220% 100%; animation: shimmer 1.4s linear infinite; border-radius: var(--r-md); }
@keyframes shimmer { 0% { background-position: 180% 0; } 100% { background-position: -20% 0; } }
.skel-card { height: 260px; }

/* ============================================================
   八 · 合作伙伴
   ============================================================ */
/* 合作伙伴标题：居中并放大，比通用眉题更醒目 */
#partners .eyebrow--xl { font-size: clamp(1.6rem, 3vw, 2.3rem); }
.partner-grid { margin-top: clamp(36px, 5vw, 60px); display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-5); }
.partner-card {
  display: flex; flex-direction: column; align-items: center; gap: var(--s-3);
  padding: var(--s-7) var(--s-5); text-align: center;
  background: var(--c-paper); border: 1px solid var(--c-line); border-radius: var(--r-lg);
  transition: transform var(--t-base) var(--e-out), box-shadow var(--t-base) var(--e-out), border-color var(--t-base);
}
.partner-card:hover { transform: translateY(-4px); box-shadow: var(--sh-lg); border-color: var(--c-brand-200); }
.partner-card__logo {
  width: 62px; height: 62px; border-radius: var(--r-md); flex: none;
  display: grid; place-items: center;
  background: var(--c-brand-050); color: var(--c-brand-600);
  transition: background-color var(--t-base) var(--e-out), color var(--t-base) var(--e-out);
}
.partner-card:hover .partner-card__logo { background: var(--c-brand-500); color: #fff; }
.partner-card__logo svg { width: 28px; height: 28px; }
.partner-card__name { font-size: var(--fs-sm); font-weight: 600; color: var(--c-ink); }

/* 合作条：浅色渐变取代原深绿块 */
.partner-cta {
  margin-top: clamp(40px, 5vw, 64px); padding: clamp(30px, 4vw, 52px) clamp(28px, 5vw, 60px);
  display: flex; align-items: center; justify-content: space-between; gap: var(--s-6); flex-wrap: wrap;
  border-radius: var(--r-xl); border: 1px solid var(--c-brand-100);
  background:
    radial-gradient(60% 140% at 0% 0%, rgba(48, 174, 36, .12), transparent 62%),
    radial-gradient(60% 140% at 100% 100%, rgba(0, 102, 180, .10), transparent 62%),
    linear-gradient(120deg, #FBFEF8 0%, #F5FBFD 100%);
  box-shadow: 0 24px 48px -38px rgba(16, 40, 24, .4);
}
.partner-cta p { font-size: var(--fs-lead); color: var(--c-ink-2); max-width: 62ch; line-height: 1.78; }

/* ============================================================
   九 · 商务转化（改为浅色）
   ============================================================ */
.cta {
  position: relative; overflow: hidden;
  background:
    radial-gradient(50% 60% at 84% 12%, rgba(48, 174, 36, .16), transparent 62%),
    radial-gradient(46% 54% at 6% 96%, rgba(0, 102, 180, .13), transparent 64%),
    linear-gradient(180deg, #FBFEF9 0%, #F3FAF0 52%, #F1F8FD 100%);
  color: var(--c-ink-2);
}
.cta__bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.cta__lines { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .8; }
.cta__inner { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .92fr); gap: clamp(36px, 5vw, 84px); align-items: center; }
.cta__title { color: var(--c-ink); }
.cta__lead { margin-top: var(--s-5); color: var(--c-slate); max-width: 500px; }
.cta__actions { margin-top: var(--s-8); display: flex; flex-wrap: wrap; gap: var(--s-4); }
.cta__contact { margin-top: var(--s-9); padding-top: var(--s-6); border-top: 1px solid var(--c-line); display: flex; flex-wrap: wrap; gap: var(--s-8); }
.cta__contact-item { display: flex; align-items: center; gap: 10px; font-size: var(--fs-sm); color: var(--c-slate); }
.cta__contact-item svg { width: 16px; height: 16px; color: var(--c-brand-500); flex: none; }
.cta__contact-item--mute { color: var(--c-mute); }

.cta__form {
  background: rgba(255, 255, 255, .9); border: 1px solid var(--c-line);
  border-radius: var(--r-xl); padding: clamp(26px, 3vw, 40px);
  backdrop-filter: blur(14px);
  box-shadow: 0 30px 60px -34px rgba(16, 40, 24, .3);
}
.cta__form .input, .cta__form .textarea, .cta__form .select { background: #FFFFFF; }
.cta__form .field__label { color: var(--c-slate); }
.cta__form-title { color: var(--c-ink); font-size: 1.15rem; font-weight: 700; }
.cta__form-grid { margin-top: var(--s-5); display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s-4); }
.cta__form-grid .field--full { grid-column: 1 / -1; }
.cta__form .btn { width: 100%; margin-top: var(--s-5); }
.cta__form-note { margin-top: var(--s-4); font-size: var(--fs-micro); color: var(--c-mute); text-align: center; }

.form-success { display: none; text-align: center; padding: var(--s-9) var(--s-4); }
.form-success.is-show { display: block; }
.form-success__ico { width: 58px; height: 58px; margin: 0 auto var(--s-5); border-radius: 50%; background: var(--c-brand-050); color: var(--c-brand-500); display: grid; place-items: center; }
.form-success__ico svg { width: 26px; height: 26px; }
.form-success__t { color: var(--c-ink); font-size: 1.15rem; font-weight: 700; }
.form-success__d { margin-top: 10px; font-size: var(--fs-sm); color: var(--c-slate); }
.form-success .btn { margin-top: var(--s-6); }

/* ============================================================
   页脚（改为浅色）
   ============================================================ */
.site-footer {
  position: relative; overflow: hidden;
  background: linear-gradient(180deg, #F3FAF3 0%, #EAF4EE 100%);
  color: var(--c-slate);
  border-top: 1px solid var(--c-line);
  padding-top: clamp(56px, 7vw, 96px);
}
.site-footer::before {
  content: ""; position: absolute; right: -10%; top: -30%; width: 520px; height: 520px;
  border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(48, 174, 36, .12), transparent 68%);
}
.site-footer > .wrap { position: relative; z-index: 2; }
.footer-top {
  display: grid; grid-template-columns: minmax(0, .86fr) minmax(0, 2fr);
  gap: clamp(40px, 6vw, 100px); padding-bottom: clamp(40px, 5vw, 68px);
}
.footer-slogan { margin-top: var(--s-5); font-size: var(--fs-body); color: var(--c-ink-2); line-height: 1.85; max-width: 300px; }
.footer-contact { margin-top: var(--s-6); display: grid; gap: 8px; }
.footer-contact a { font-size: var(--fs-sm); color: var(--c-ink-2); transition: color var(--t-fast); }
.footer-contact a:hover { color: var(--c-brand-600); }
.footer-contact p { font-size: var(--fs-xs); color: var(--c-mute); line-height: 1.7; }
.footer-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 4vw, 56px); }
.footer-col__t { font-size: var(--fs-sm); font-weight: 700; color: var(--c-ink); margin-bottom: var(--s-5); }
.footer-col a { display: block; font-size: var(--fs-sm); padding: 6px 0; color: var(--c-slate); transition: color var(--t-fast), transform var(--t-fast); }
.footer-col a:hover { color: var(--c-brand-600); transform: translateX(3px); }
.footer-bottom {
  border-top: 1px solid rgba(20, 61, 30, .1);
  padding: clamp(24px, 3vw, 34px) 0;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-4);
  font-size: var(--fs-xs); color: var(--c-mute);
}
.footer-bottom__links { display: flex; flex-wrap: wrap; gap: var(--s-5); }
.footer-bottom a:hover { color: var(--c-brand-600); }
.footer-logo { display: inline-block; }
.footer-logo img { height: 50px; width: auto; display: block; }
.footer-qr-row {
  border-top: 1px solid rgba(20, 61, 30, .1);
  padding: clamp(28px, 4vw, 46px) 0;
  display: flex; align-items: center; justify-content: space-between;
  gap: clamp(28px, 5vw, 64px); flex-wrap: wrap;
}
.footer-qr-row__lead { flex: 0 0 auto; min-width: 180px; }
.footer-qr-row__t { font-size: var(--fs-lead); font-weight: 700; color: var(--c-ink); }
.footer-qr-row__d { margin-top: 6px; font-size: var(--fs-xs); color: var(--c-mute); letter-spacing: .04em; }
.footer-qr { display: flex; gap: clamp(24px, 3.4vw, 48px); }
.footer-qr__item { text-align: center; }
.footer-qr__box {
  width: 110px; height: 110px; padding: 7px; border-radius: var(--r-md);
  background: #fff; border: 1px solid var(--c-line);
  display: grid; place-items: center; overflow: hidden;
  box-shadow: 0 8px 22px -12px rgba(16, 40, 24, .28);
  transition: transform var(--t-fast) var(--e-out);
}
.footer-qr__box:hover { transform: translateY(-3px); }
.footer-qr__box img { width: 100%; height: 100%; object-fit: contain; display: block; }
.footer-qr__lbl { font-size: var(--fs-xs); margin-top: 10px; color: var(--c-slate); }

/* ============================================================
   视频弹窗
   ============================================================ */
.video-stage { position: relative; aspect-ratio: 16 / 9; background: #EEF6F0; }
.video-stage__ph { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; color: var(--c-mute); gap: var(--s-3); }
.video-stage__ph svg { width: 40px; height: 40px; opacity: .4; }
.video-stage__ph p { font-size: var(--fs-sm); }
.video-modal__foot { padding: var(--s-6) clamp(24px, 3vw, 36px); }
.video-modal__t { font-size: 1.15rem; font-weight: 700; color: var(--c-ink); }
.video-modal__d { margin-top: 8px; font-size: var(--fs-sm); color: var(--c-mute); line-height: 1.75; }
.video-modal__meta { margin-top: var(--s-4); display: flex; gap: var(--s-4); font-size: var(--fs-xs); color: var(--c-mute); }

/* ============================================================
   响应式
   ============================================================ */
@media (max-width: 1360px) {
  .nav__link { padding: 10px 12px; font-size: var(--fs-xs); }
  .tf-grid { gap: var(--s-4); }
}

@media (max-width: 1200px) {
  .footer-top { grid-template-columns: 1fr; gap: var(--s-8); }
  .tf-card { padding: 32px 22px 28px; }
}

@media (max-width: 1024px) {
  :root { --header-h: 72px; }
  .nav, .header-cta .btn { display: none; }
  .burger { display: grid; }
  .header-cta { margin-left: auto; }

  .hero { min-height: auto; padding-top: calc(var(--header-h) + 64px); padding-bottom: 96px; }
  .hero__inner { grid-template-columns: 1fr; gap: var(--s-10); }
  .hero__copy { max-width: none; }
  .hero__visual { max-width: 680px; width: 100%; }
  .hero__scroll { display: none; }

  .about__grid { grid-template-columns: 1fr; gap: var(--s-9); }
  .about__facts { margin-top: var(--s-7); }

  .pm-grid { grid-template-columns: repeat(2, 1fr); }
  .pm-tabs { grid-template-columns: repeat(2, 1fr); }

  .tf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tf-card { min-height: 200px; }

  .garden__grid { grid-template-columns: 1fr; gap: var(--s-9); }
  .garden__media { max-width: 680px; }

  .content-layout { grid-template-columns: 1fr; }
  .cta__inner { grid-template-columns: 1fr; }
  .sol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  :root { --header-h: 66px; }
  .t-hide-mobile { display: none; }
  .brand__logo { height: 36px; }
  [data-reveal="left"], [data-reveal="right"] { transform: translateY(26px); }

  .hero__meta { gap: var(--s-6); }
  .hero__meta-item { flex: 1 1 40%; }
  .hero__actions .btn { flex: 1 1 auto; }

  .about__cards { grid-template-columns: 1fr; }
  .about__mv { grid-template-columns: 1fr; }
  .about__mv-item + .about__mv-item { border-left: 0; border-top: 1px solid var(--c-line); }
  .about__fact { grid-template-columns: 96px minmax(0, 1fr); }

  /* 窄屏：方向切换两列、产品单列，标签描述收起 */
  .pm-grid { grid-template-columns: 1fr; }
  .pm-tabs { padding: 4px; }
  .pm-tab { padding: 13px 15px; }
  .pm-tab__d { display: none; }
  .pm-tab__cn { font-size: .98rem; }
  .pm-tab__ico { width: 15px; height: 15px; right: 12px; top: 13px; }
  .pm-foot { flex-direction: column; align-items: flex-start; }

  .tf-grid { grid-template-columns: 1fr; }
  .tf-card { min-height: 168px; }
  .tf-card__t { padding-top: var(--s-7); }

  .garden__caption { padding: 20px; flex-direction: column; align-items: flex-start; gap: 10px; }

  .sol { grid-template-columns: 1fr; }
  .sol-card { aspect-ratio: 16 / 9.8; }

  .content-item { grid-template-columns: 104px minmax(0, 1fr); gap: var(--s-4); }
  .content-video { aspect-ratio: 16 / 10; }
  .content-video__body { flex-direction: column; align-items: flex-start; justify-content: center; gap: var(--s-4); }
  .content-video__play { width: 56px; height: 56px; }

  .partner-grid { grid-template-columns: repeat(2, 1fr); gap: var(--s-4); }
  .partner-cta { flex-direction: column; align-items: flex-start; gap: var(--s-5); }

  .cta__form-grid { grid-template-columns: 1fr; }
  .footer-links { grid-template-columns: repeat(2, 1fr); gap: var(--s-6); }
  .footer-qr-row { flex-direction: column; align-items: flex-start; gap: var(--s-5); }
  .footer-qr { gap: var(--s-6); }
  .footer-brand { grid-column: 1 / -1; }
  .sec-head { flex-direction: column; align-items: flex-start; gap: var(--s-6); }
  .to-top { right: 16px; bottom: 16px; }
}

@media (max-width: 560px) {
  /* 窄屏两个主按钮改为整行，避免并排时右侧被挤出安全边距 */
  .hero__actions { gap: var(--s-3); }
  .hero__actions .btn { width: 100%; flex: 1 1 100%; min-width: 0; justify-content: center; }
}

@media (max-width: 480px) {
  .footer-links { grid-template-columns: 1fr; }
  .footer-qr { flex-wrap: wrap; gap: var(--s-5); }
  .footer-qr__box { width: 96px; height: 96px; }
  .content-item { grid-template-columns: 1fr; }
  .content-item__media { aspect-ratio: 16 / 9; }
  .partner-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .partner-card { padding: 20px 10px; gap: 10px; }
  .partner-card__logo { width: 52px; height: 52px; }
  .partner-card__logo svg { width: 24px; height: 24px; }
  .about__fact { grid-template-columns: 1fr; gap: 4px; }
}

/* ============================================================
   宽屏（≥1500）：版心撑到 1800 后，产品网格补到 4 列，
   避免卡片被拉得过宽、图片比例失衡
   ============================================================ */
@media (min-width: 1500px) {
  .pm-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ============================================================
   首屏：标题第一行取 Logo 蓝，主按钮取 Logo 黄
   ============================================================ */
.hero__title .hero__blue { color: #0068B4; }

/* 主按钮已全站取 Logo 黄，此处只放大首屏的投影 */
.hero__actions .btn--primary { box-shadow: 0 14px 34px -16px rgba(140, 148, 52, .90); }
.hero__actions .btn--primary:hover { box-shadow: 0 20px 40px -16px rgba(140, 148, 52, 1); }

/* ============================================================
   矩阵中心：以人为本（人物图标）
   ============================================================ */
.hm__core--person {
  gap: 0;
  background: radial-gradient(circle at 50% 30%, #FFFFFF 0%, #F3FAF5 58%, #E6F2EA 100%);
}
.hm__person {
  width: clamp(38px, 5vw, 58px);
  height: auto;
  color: var(--c-brand-600);
  opacity: .92;
}

/* ============================================================
   页脚改版（2026-11）：一栏横向
   品牌 slogan ＋ 地址/电话/邮箱 ＋ 三个二维码
   ============================================================ */
.site-footer { padding-top: clamp(40px, 4.6vw, 66px); }

.footer-bar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(32px, 5vw, 88px);
  padding-bottom: clamp(26px, 3vw, 42px);
  border-bottom: 1px solid rgba(20, 61, 30, .1);
}
.footer-bar__brand { flex: none; }
.footer-slogan {
  margin-top: 12px;
  font-size: 13.5px; line-height: 1.7;
  color: var(--c-ink-2);
  max-width: 200px;
}

.footer-bar__info {
  display: flex; flex-direction: column;
  gap: 10px;
  margin: 0; padding: 0; list-style: none;
  min-width: 0;
}
.footer-bar__info li {
  display: flex; align-items: baseline; gap: 14px;
  font-size: 13.5px; line-height: 1.6;
  color: var(--c-slate);
}
.footer-bar__info i {
  font-style: normal; flex: none;
  width: 30px;
  font-size: 11.5px; letter-spacing: .12em;
  color: var(--c-mute);
}
.footer-bar__info a { color: var(--c-slate); transition: color var(--t-fast) var(--e-out); }
.footer-bar__info a:hover { color: var(--c-brand-700); }

.footer-bar__qr {
  display: flex; flex-direction: column; align-items: flex-end;
  gap: 10px;
  flex: none;
}
.footer-bar__qr-t {
  font-size: 11.5px; letter-spacing: .16em;
  color: var(--c-mute);
}
.footer-bar .footer-qr { gap: clamp(14px, 1.6vw, 22px); }
.footer-bar .footer-qr__box { width: 92px; height: 92px; padding: 6px; }
.footer-bar .footer-qr__lbl { font-size: 11.5px; margin-top: 8px; }

@media (max-width: 1024px) {
  .footer-bar {
    grid-template-columns: 1fr auto;
    gap: 28px;
  }
  .footer-bar__info { grid-column: 1 / -1; order: 3; }
}
@media (max-width: 720px) {
  .footer-bar { grid-template-columns: 1fr; gap: 24px; }
  .footer-bar__qr { align-items: flex-start; }
  .footer-bar .footer-qr__box { width: 82px; height: 82px; }
}

/* 页脚底部右侧链接给「回到顶部」按钮让位 */
.footer-bottom { padding-right: 64px; }
@media (max-width: 720px) { .footer-bottom { padding-right: 0; padding-bottom: 56px; } }

/* ============================================================
   页脚 v2：左品牌 / 中联系（带图标）/ 右二维码，顶部对齐
   ============================================================ */
.site-footer { padding-top: clamp(44px, 5vw, 72px); }

.footer-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) auto;
  align-items: start;
  gap: clamp(36px, 5vw, 84px);
  padding-bottom: clamp(30px, 3.4vw, 46px);
  border-bottom: 1px solid rgba(20, 61, 30, .1);
}
.footer-bar__brand { max-width: 260px; }
.footer-slogan {
  margin-top: 14px;
  font-size: 14px; line-height: 1.7;
  color: var(--c-ink-2);
}
.footer-bar__legal {
  margin-top: 8px;
  font-size: 12px; line-height: 1.6;
  color: var(--c-mute);
}

.footer-bar__info {
  display: flex; flex-direction: column;
  gap: 14px;
  margin: 0; padding: 0; list-style: none;
  min-width: 0;
}
.footer-bar__info li {
  display: flex; align-items: flex-start; gap: 12px;
  font-size: 13.5px; line-height: 1.6;
  color: var(--c-slate);
}
.footer-bar__ico {
  flex: none;
  width: 28px; height: 28px; margin-top: -2px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(48, 174, 36, .1);
  color: var(--c-brand-700);
}
.footer-bar__ico svg { width: 15px; height: 15px; }
.footer-bar__txt { display: inline-flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.footer-bar__txt em {
  font-style: normal;
  font-size: 11.5px; letter-spacing: .12em;
  color: var(--c-mute);
}
.footer-bar__info a { color: var(--c-slate); transition: color var(--t-fast) var(--e-out); }
.footer-bar__info a:hover { color: var(--c-brand-700); }

.footer-bar__qr {
  display: flex; flex-direction: column; gap: 12px;
  align-items: flex-start;
}
.footer-bar__qr-t {
  font-size: 11.5px; letter-spacing: .16em;
  color: var(--c-mute);
}
.footer-bar .footer-qr { gap: clamp(12px, 1.4vw, 18px); }
.footer-bar .footer-qr__box { width: 88px; height: 88px; padding: 5px; border-radius: 8px; }
.footer-bar .footer-qr__lbl { font-size: 11px; margin-top: 7px; }

@media (max-width: 1080px) {
  .footer-bar { grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer-bar__qr { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 20px; }
}
@media (max-width: 720px) {
  .footer-bar { grid-template-columns: 1fr; }
  .footer-bar__qr { flex-direction: column; align-items: flex-start; }
  .footer-bar .footer-qr__box { width: 78px; height: 78px; }
}

/* 首页矩阵人物图标放大一点 */
.hm__person { width: clamp(48px, 6.4vw, 74px); color: var(--c-brand-500); }

/* ============================================================
   矩阵中心：实心人形剪影（品牌绿渐变）
   ============================================================ */
.hm__core--person {
  /* 中心图标改用带白底的实拍 3D 图，圆底设为纯白以便图片白底无缝融入 */
  background: #FFFFFF;
  box-shadow: 0 24px 54px -32px rgba(16, 40, 24, .45), inset 0 0 0 1px rgba(48, 174, 36, .1);
}
.hm__person {
  width: clamp(46px, 6.2vw, 82px);
  height: auto;
  color: inherit;
}

/* ============================================================
   页脚 v3：地址电话邮箱回到左侧
   ============================================================ */
.footer-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "brand qr" "info qr";
  align-items: start;
  column-gap: clamp(32px, 4.4vw, 80px);
  row-gap: clamp(20px, 2.2vw, 30px);
}
.footer-bar__brand {
  grid-area: brand;
  max-width: none;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: clamp(16px, 1.6vw, 26px);
  row-gap: 5px;
}
.footer-bar__brand .footer-logo { grid-column: 1; grid-row: 1 / span 2; }
.footer-bar__brand .footer-logo img { width: clamp(132px, 11vw, 158px); height: auto; }
.footer-bar__brand .footer-slogan { grid-column: 2; grid-row: 1; margin: 0; font-size: 13.5px; line-height: 1.5; }
.footer-bar__brand .footer-bar__legal { grid-column: 2; grid-row: 2; margin: 0; font-size: 11.5px; line-height: 1.5; color: var(--c-mute); }

.footer-bar__info {
  grid-area: info;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px clamp(18px, 2.4vw, 40px);
  padding-top: 2px;
}
.footer-bar__info li { align-items: center; gap: 9px; font-size: 13px; }
.footer-bar__ico { width: 24px; height: 24px; margin-top: 0; }
.footer-bar__ico svg { width: 13px; height: 13px; }
.footer-bar__txt { gap: 7px; }
.footer-bar__txt em { font-size: 11px; }

.footer-bar__qr { grid-area: qr; align-self: center; }
.footer-bar .footer-qr__box { width: 84px; height: 84px; }

@media (max-width: 1080px) {
  .footer-bar {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "brand" "info" "qr";
    row-gap: 22px;
  }
  .footer-bar__qr { align-self: start; flex-direction: row; align-items: center; gap: 18px; }
}
@media (max-width: 720px) {
  .footer-bar__info { flex-direction: column; align-items: flex-start; gap: 10px; }
  .footer-bar__qr { flex-direction: column; align-items: flex-start; }
  .footer-bar .footer-qr__box { width: 76px; height: 76px; }
}

/* 页脚：品牌块与联系行收紧，右侧二维码与品牌顶对齐 */
.footer-bar { row-gap: clamp(14px, 1.4vw, 20px); }
.footer-bar__qr { align-self: start; }

/* 人形图标再大一点，底部加托底短线 */
.hm__person { width: clamp(62px, 8.4vw, 108px); }

/* 中心圆外再加一圈极淡的呼吸环，人物更有分量 */
.hm__core--person { position: absolute; }
.hm__core--person::after {
  content: "";
  position: absolute;
  inset: -9%;
  border-radius: 50%;
  border: 1px solid rgba(48, 174, 36, .14);
  pointer-events: none;
}

/* 中心圆略放大，人物更醒目 */
.hm__core { width: 31.5%; }
.hm__person { width: clamp(70px, 9.4vw, 122px); }

/* 中心徽章：柔和光晕，人物成为视觉焦点 */
.hm__core--person {
  box-shadow:
    0 0 0 10px rgba(255, 255, 255, .55),
    0 18px 60px -26px rgba(20, 90, 40, .34),
    inset 0 1px 0 rgba(255, 255, 255, .95);
}
.hm__core--person::before {
  content: "";
  position: absolute; inset: -22%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(76, 180, 60, .1) 0%, rgba(76, 180, 60, 0) 68%);
  pointer-events: none;
}

/* ============================================================
   页脚 v4（2026-11-02 定稿）
   ------------------------------------------------------------
   三栏：品牌 / 联系方式（地址·电话·邮箱 竖排）/ 二维码
   二维码从 84px 提到 108px，右侧给足宽度，扫码不再费眼
   ============================================================ */
.footer-bar {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .9fr) auto;
  grid-template-areas: "brand info qr";
  align-items: start;
  column-gap: clamp(32px, 5vw, 96px);
  row-gap: 0;
  padding-bottom: clamp(30px, 3.4vw, 46px);
  border-bottom: 1px solid rgba(20, 61, 30, .1);
}

.footer-bar__brand {
  grid-area: brand;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: clamp(14px, 1.4vw, 22px);
  row-gap: 4px;
  max-width: none;
}
.footer-bar__brand .footer-logo { grid-column: 1; grid-row: 1 / span 2; }
.footer-bar__brand .footer-logo img { width: clamp(128px, 10vw, 152px); height: auto; }
.footer-bar__brand .footer-slogan {
  grid-column: 2; grid-row: 1; margin: 0;
  font-size: 13.5px; line-height: 1.5; color: var(--c-ink-2);
  max-width: none;
}
.footer-bar__brand .footer-bar__legal {
  grid-column: 2; grid-row: 2; margin: 0;
  font-size: 11.5px; line-height: 1.5; color: var(--c-mute);
}

/* 联系方式：一条一行，标签在上、内容在下 */
.footer-bar__info {
  grid-area: info;
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 12px;
  padding-top: 0;
}
.footer-bar__info li {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--c-slate);
  min-width: 0;
}
.footer-bar__ico { width: 26px; height: 26px; margin-top: 0; }
.footer-bar__ico svg { width: 14px; height: 14px; }
.footer-bar__txt {
  display: flex; flex-direction: column; gap: 2px;
  min-width: 0; word-break: break-all;
}
.footer-bar__txt em {
  font-style: normal;
  font-size: 10.5px; letter-spacing: .18em;
  color: var(--c-mute);
}
.footer-bar__txt a { color: var(--c-slate); }

/* 二维码：加大到 108px，标题左对齐，与联系方式同基线 */
.footer-bar__qr {
  grid-area: qr;
  align-self: start;
  align-items: flex-start;
  gap: 10px;
}
.footer-bar .footer-qr { gap: clamp(16px, 1.6vw, 24px); }
.footer-bar .footer-qr__box {
  width: 108px; height: 108px;
  padding: 7px; border-radius: 10px;
}
.footer-bar .footer-qr__lbl { font-size: 11.5px; margin-top: 8px; color: var(--c-slate); }

@media (max-width: 1080px) {
  .footer-bar {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas: "brand brand" "info qr";
    column-gap: 32px;
    row-gap: 26px;
  }
  .footer-bar__qr { align-self: start; }
}
@media (max-width: 720px) {
  .footer-bar {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "brand" "info" "qr";
    row-gap: 24px;
  }
  .footer-bar .footer-qr { gap: 18px; }
  .footer-bar .footer-qr__box { width: 92px; height: 92px; }
}

/* ============================================================
   首屏矩阵 v2（2026-11-03）
   ------------------------------------------------------------
   原版中心圆占 31.5%，人物图几乎撑满中心，周围十个产品被压成小点。
   现在：中心 22%，产品节点放大到容器宽度的 12%，
   两条轨道同步外扩（外环 42.5% / 内环 26.5%）；
   尺寸全部按容器百分比走，任何视口下比例一致。
   ============================================================ */
.hero__matrix {
  max-width: min(clamp(620px, 47vw, 860px), calc(100svh - 226px));
}
.hm__ring--o { width: 85%; height: 85%; }
.hm__ring--i { width: 53%; height: 53%; }
.hm__glow { width: 44%; height: 44%; opacity: .9; }

.hm__core { width: 22%; }
.hm__person { width: 70%; height: auto; opacity: 1; object-fit: contain; }
.hm__core--person {
  border: 1px solid rgba(255, 255, 255, 1);
  box-shadow:
    0 0 0 8px rgba(255, 255, 255, .5),
    0 14px 40px -24px rgba(20, 90, 40, .42),
    inset 0 0 0 1px rgba(48, 174, 36, .14);
}
/* 呼吸环收在圆外一点点，别再把中心撑成一片模糊的白 */
.hm__core--person::after { inset: -10%; border-color: rgba(48, 174, 36, .18); }
.hm__core--person::before {
  inset: -18%;
  background: radial-gradient(circle, rgba(76, 180, 60, .09) 0%, rgba(76, 180, 60, 0) 70%);
}

/* 节点：盒子只等于图片圆，名字挂在下方，圆心精确落在轨道上 */
.hm__node { width: 12%; gap: 0; }
.hm__node-t {
  position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  margin-top: 9px;
  font-size: clamp(.66rem, .78vw, .8rem); letter-spacing: .05em;
}
@media (max-width: 768px) {
  .hm__node-t { font-size: 11px; margin-top: 7px; }
}

/* ============================================================
   产品区小标题居中（与「关键技术」同一套版式）
   ============================================================ */
.sec-head--center { flex-direction: column; align-items: center; text-align: center; }
.sec-head--center .sec-head__text { max-width: 860px; }
@media (max-width: 768px) {
  .sec-head--center { align-items: center; text-align: center; }
  .sec-head--center .sec-head__text { margin-inline: auto; }
}

/* ============================================================
   页脚 v5（2026-11-03 定稿）
   ------------------------------------------------------------
   去掉图形 logo；左栏只留文字（主张 / 公司名 / 地址 / 电话 / 邮箱），
   右栏三张二维码放大到 136px 并排，扫码不再费眼。
   ============================================================ */
.ft {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: clamp(36px, 6vw, 104px);
  padding-bottom: clamp(28px, 3.2vw, 46px);
  border-bottom: 1px solid rgba(20, 61, 30, .1);
}
.ft__main { min-width: 0; max-width: 460px; display: flex; flex-direction: column; }

.ft__slogan {
  font-size: clamp(1.2rem, 1.6vw, 1.5rem);
  font-weight: 600; line-height: 1.4;
  letter-spacing: .01em; color: var(--c-ink);
}
.ft__slogan::after {
  content: ""; display: block;
  width: 34px; height: 2px; margin-top: 14px;
  background: linear-gradient(90deg, var(--c-brand-500), rgba(48, 174, 36, .12));
  border-radius: 2px;
}
.ft__name {
  margin-top: 14px;
  font-size: 12.5px; letter-spacing: .08em; line-height: 1.6;
  color: var(--c-mute);
}

.ft__list {
  margin: clamp(18px, 2vw, 26px) 0 0;
  padding: clamp(16px, 1.8vw, 22px) 0 0;
  border-top: 1px solid var(--c-line);
  list-style: none;
  display: flex; flex-direction: column; gap: 12px;
}
.ft__row {
  display: grid; grid-template-columns: 20px minmax(0, 1fr);
  align-items: baseline; gap: 12px;
  font-size: 13.5px; line-height: 1.65; color: var(--c-slate);
}
.ft__ico { color: var(--c-brand-600); display: flex; align-items: center; transform: translateY(3px); }
.ft__ico svg { width: 14px; height: 14px; }
.ft__txt { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; min-width: 0; }
.ft__txt em {
  font-style: normal; flex: none; min-width: 26px;
  font-size: 10.5px; letter-spacing: .18em; color: var(--c-mute);
}
.ft__txt a { color: var(--c-slate); border-bottom: 1px solid rgba(48, 174, 36, .22); transition: color var(--t-fast) var(--e-out), border-color var(--t-fast) var(--e-out); }
.ft__txt a:hover { color: var(--c-brand-700); border-color: var(--c-brand-500); }

.ft__qr { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.ft__qr-t { font-size: 11.5px; letter-spacing: .18em; color: var(--c-mute); }
.ft__qr .footer-qr { gap: clamp(16px, 1.8vw, 26px); }
.ft__qr .footer-qr__box {
  width: clamp(104px, 9.4vw, 136px);
  height: clamp(104px, 9.4vw, 136px);
  padding: 8px; border-radius: 12px;
  border-color: rgba(20, 61, 30, .1);
  box-shadow: 0 10px 26px -16px rgba(16, 40, 24, .34);
}
.ft__qr .footer-qr__lbl { font-size: 11.5px; margin-top: 9px; color: var(--c-slate); }

@media (max-width: 880px) {
  .ft {
    grid-template-columns: minmax(0, 1fr);
    gap: 30px;
  }
  .ft__main { max-width: none; }
}
@media (max-width: 720px) {
  .ft__qr .footer-qr { gap: 14px; }
  .ft__qr .footer-qr__box { width: 96px; height: 96px; padding: 6px; }
  .ft__qr .footer-qr__lbl { font-size: 11px; }
}
@media (max-width: 420px) {
  .ft__qr .footer-qr { flex-wrap: wrap; gap: 12px; }
  .ft__qr .footer-qr__box { width: 88px; height: 88px; }
}

/* ============================================================
   2026-11-03 · 首页首屏标题改色
   ------------------------------------------------------------
   「助力更多人」取 Logo 绿（#30AE24）；
   「身心健康」压深一档，避免两行绿糊成一块。
   ============================================================ */
.hero__title .hero__blue,
.hero__title .accent {
  color: #32AF28;
  background: none;
  -webkit-text-fill-color: #32AF28;
}

/* ============================================================
   2026-11-03 · 区块标题改为「放大版眉题」
   ------------------------------------------------------------
   各区块只留一个词组（产品矩阵 / 关键技术 / 应用场景 / 合作伙伴），
   去掉下面那些解释性主标题。眉题放大到接近小标题的字号，
   保留两侧短横线，让它自己撑得住一屏的视觉重量。
   ============================================================ */
.eyebrow--xl {
  font-size: clamp(1.34rem, 2.15vw, 1.86rem);
  letter-spacing: .16em;
  font-weight: 600;
  gap: clamp(12px, 1.5vw, 20px);
}
.eyebrow--xl::before,
.eyebrow--xl::after { width: clamp(26px, 3.2vw, 48px); height: 1px; }
@media (max-width: 640px) {
  .eyebrow--xl { font-size: 1.22rem; letter-spacing: .14em; }
  .eyebrow--xl::before,
  .eyebrow--xl::after { width: 22px; }
}

/* ============================================================
   资讯中心：标题区与筛选条之间收紧，按钮直接顶上来
   ============================================================ */
#content { padding-top: clamp(18px, 2.4vw, 32px); }
#content .content-filter { margin-bottom: clamp(22px, 2.6vw, 34px); }




/* 沐心三形态轮播（扩展原有的两形态轮播） */
.pm-card__media--roll3 img { animation-name: pmRoll3 !important; }
@keyframes pmRoll3 {
  0% { opacity: 1; } 33% { opacity: 1; } 33.6% { opacity: 0; } 100% { opacity: 0; }
}
.pm-card__media--roll3 .pm-dots i { animation: pmDot3 8s steps(1, end) infinite !important; animation-delay: 0s; }
.pm-card__media--roll3 .pm-dots i:nth-child(2) { animation-delay: 2.667s; }
.pm-card__media--roll3 .pm-dots i:nth-child(3) { animation-delay: 5.333s; }
@keyframes pmDot3 { 0% { background: var(--c-brand-500); } 33.6% { background: rgba(20, 40, 28, .16); } }



/* ============================================================
   2026-11-05 · 关键技术：加线性图标（每卡一枚）
   ============================================================ */
.tf-card__ico {
  width: 76px; height: 76px; border-radius: 23px;
  display: grid; place-items: center;
  background: linear-gradient(158deg, rgba(0, 102, 180, .11), rgba(0, 102, 180, .035));
  border: 1px solid rgba(0, 102, 180, .18);
  color: var(--c-tech-600);
  margin-bottom: 16px;
  transition: transform .45s var(--e-out), background .45s var(--e-out), border-color .45s var(--e-out);
}
.tf-card__ico svg { width: 40px; height: 40px; display: block; }
.tf-card:hover .tf-card__ico {
  transform: translateY(-3px);
  background: linear-gradient(158deg, rgba(0, 102, 180, .16), rgba(0, 102, 180, .05));
  border-color: rgba(0, 102, 180, .34);
}
/* 有图标之后，编号退到卡片右上角做小序号，避免和图标抢视线 */
.tf-card__n {
  position: absolute; right: 22px; top: 20px;
  font-size: 1.05rem; -webkit-text-stroke-width: .8px;
}
.tf-card:hover .tf-card__n { transform: none; }

/* 图标 + 标题在卡片里成组居中，避免上下各空一块 */
.tf-card { justify-content: center; padding-top: 30px; padding-bottom: 30px; }
.tf-card__model { margin-top: 18px; min-height: 0; }

/* 兜底：图标 + 标题整组垂直居中（移动端同样生效） */
.tf-card { justify-content: center !important; }

/* 用 grid 居中更稳：图标与标题作为一个整体，四卡等高 */
.tf-card {
  display: grid !important;
  align-content: center !important;
  justify-items: center;
  row-gap: 18px;
  padding: 30px 24px !important;
}
.tf-card__ico { margin-bottom: 0; }
.tf-card__model { margin-top: 0 !important; }

/* ============================================================
   2026-11-05 · 关键技术改为「配图 + 标题」卡片
   ============================================================ */
.tf-card {
  display: block !important;
  padding: 0 0 26px !important;
  overflow: hidden;
}
.tf-card__fig { margin: 0 0 16px; overflow: hidden; }
.tf-card__fig img {
  display: block; width: 100%; height: auto;
  aspect-ratio: 4 / 3; object-fit: cover;
  transition: transform .7s var(--e-out);
}
.tf-card:hover .tf-card__fig img { transform: scale(1.04); }
.tf-card__n {
  top: 14px; right: 14px;
  padding: 3px 9px; border-radius: 999px;
  background: rgba(255, 255, 255, .88);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  font-size: .86rem; -webkit-text-stroke-width: .6px;
}
.tf-card__model {
  margin: 0 !important;
  padding: 0 18px;
  text-align: center;
}

/* 凌观是横构图双主体，四边留白已裁净，卡片里不需要额外 16px 内边距 */
.pm-card__media[data-p="lingguan"] img { padding: 4px 6px 10px; }