/* 设计稿专用样式(只注入截图页面,不进仓库)。全部走 theme.css 的设计令牌。 */

/* logo 按主题切换(与站内 logo-dark / logo-light 约定一致) */
.mk .logo-light { display: none; }
:root[data-theme="light"] .mk .logo-dark { display: none; }
:root[data-theme="light"] .mk .logo-light { display: block; }

.mk-head { margin-bottom: clamp(36px, 4.5vw, 56px); }
.mk-h2 { font-size: clamp(28px, 3.2vw, 44px); }

/* ── 方案 A:合作伙伴双卡 ── */
.fp__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 1080px; margin: 0 auto; }
.fp-card {
  display: flex; flex-direction: column; overflow: hidden; text-decoration: none; color: inherit;
  border: 1px solid var(--border); border-radius: 18px; background: var(--surface);
  transition: border-color .2s, transform .2s;
}
.fp-card:hover { border-color: color-mix(in oklab, var(--accent) 55%, var(--border)); transform: translateY(-2px); }
.fp-card__logo {
  height: 220px; display: flex; align-items: center; justify-content: center;
  background: color-mix(in oklab, var(--text) 4%, var(--surface));
  border-bottom: 1px solid var(--border);
}
:root[data-theme="light"] .fp-card__logo { background: var(--bg-2); }
.fp-card__logo .badge { width: 270px; height: auto; border-radius: 12px; }
.fp-card__logo .wordmark { width: 250px; height: auto; }
.fp-card__body { padding: 26px 30px 28px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.fp-card__tier { margin: 0; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.fp-card__tier b { font-family: var(--font-display); font-size: 20px; font-weight: 700; color: var(--text); letter-spacing: -.01em; }
.fp-card__tier span { font-family: var(--font-display); font-size: 11.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.fp-card__copy { margin: 0; color: var(--text-2); font-size: 14.5px; line-height: 1.65; }
.fp-card__link {
  margin-top: auto; padding-top: 8px; align-self: flex-start;
  display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 14px; color: var(--text);
}
.fp-card__link u { text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.fp-card:hover .fp-card__link { color: var(--accent); }

/* ── 方案 B:合作伙伴横条(更省字) ── */
.fpb {
  display: grid; grid-template-columns: 1fr 1.35fr; align-items: center; gap: 40px;
  border: 1px solid var(--border); border-radius: 18px; background: var(--surface); padding: 36px 44px;
}
.fpb__head .eyebrow { margin-bottom: 14px; }
.fpb__head .display { font-size: clamp(26px, 2.6vw, 36px); }
.fpb__logos { display: grid; grid-template-columns: 1fr 1fr; border-left: 1px solid var(--border); }
.fpb__item { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 6px 24px; }
.fpb__item + .fpb__item { border-left: 1px solid var(--border); }
.fpb__logo { height: 104px; display: flex; align-items: center; justify-content: center; }
.fpb__logo .badge { width: 220px; height: auto; border-radius: 10px; }
.fpb__logo .wordmark { width: 200px; height: auto; }
.fpb__tier { margin: 0; text-align: center; font-size: 14px; font-weight: 600; color: var(--text); }
.fpb__tier span { display: block; margin-top: 4px; font-family: var(--font-display); font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }

/* ── 客户故事:自动横向滚动,悬停暂停 ── */
.stories__marquee {
  overflow: hidden; padding-block: 6px;
  mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
}
.stories__track { --marquee-gap: 24px; display: flex; gap: var(--marquee-gap); width: max-content; animation: marquee-scroll 70s linear infinite; }
.stories__marquee:hover .stories__track { animation-play-state: paused; }
.story {
  width: 440px; flex-shrink: 0; display: flex; flex-direction: column;
  padding: 28px 30px 24px; border: 1px solid var(--border); border-radius: 18px; background: var(--surface);
  transition: border-color .2s;
}
.story:hover { border-color: color-mix(in oklab, var(--accent) 55%, var(--border)); }
.story__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 44px; margin-bottom: 20px; }
.story__logo { height: 36px; width: auto; }
.story__ph {
  display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px;
  border: 1px dashed var(--border-2); border-radius: 10px;
  font-family: var(--font-display); font-size: 21px; font-weight: 800; letter-spacing: .01em; color: var(--text);
}
.story__ph small { font-family: var(--font-sans); font-size: 10.5px; font-weight: 500; letter-spacing: 0; color: var(--text-3); }
.story__tag { flex-shrink: 0; font-size: 12px; color: var(--text-2); border: 1px solid var(--border-2); border-radius: 999px; padding: 4px 11px; }
.story__mark { font-family: var(--font-serif); font-size: 54px; line-height: .5; height: 22px; color: var(--accent); margin: 0 0 6px; }
.story__quote { margin: 0; font-size: 15.5px; line-height: 1.8; color: var(--text); }
.story__metric { margin-top: 18px; display: flex; align-items: baseline; gap: 10px; }
.story__metric b { font-family: var(--font-display); font-size: 28px; font-weight: 700; letter-spacing: -.02em; color: var(--accent); font-variant-numeric: tabular-nums; }
.story__metric span { font-size: 13px; color: var(--text-2); }
.story__foot { margin-top: auto; padding-top: 18px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.story__quote + .story__foot, .story__metric + .story__foot { margin-top: auto; }
.story__body { margin-bottom: 22px; }
.story__foot { border-top: 1px solid var(--border); }
.story__who { display: flex; align-items: center; gap: 10px; font-size: 13.5px; }
.story__who b { color: var(--text); font-weight: 600; }
.story__who span { color: var(--text-2); }
.story__who i { width: 3px; height: 3px; border-radius: 50%; background: var(--text-3); }
.story__engs { display: flex; align-items: center; gap: 6px; }
.story__engs img { width: 22px; height: 22px; object-fit: contain; border-radius: 5px; }
:root[data-theme="dark"] .story__engs img.inv { filter: brightness(0) invert(1); }

@media (max-width: 860px) {
  .fp__grid { grid-template-columns: 1fr; gap: 16px; }
  .fp-card__logo { height: 168px; }
  .fp-card__logo .badge { width: 220px; }
  .fp-card__logo .wordmark { width: 200px; }
  .fp-card__body { padding: 22px 22px 24px; }
  .fpb { grid-template-columns: 1fr; padding: 28px 22px; gap: 24px; }
  .fpb__logos { border-left: 0; border-top: 1px solid var(--border); padding-top: 20px; }
  .fpb__item { padding: 4px 8px; }
  .fpb__logo { height: 80px; }
  .fpb__logo .badge { width: 150px; }
  .fpb__logo .wordmark { width: 136px; }
  .story { width: 300px; padding: 22px 22px 20px; }
  .story__quote { font-size: 14.5px; }
  .story__logo { height: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  .stories__marquee { overflow-x: auto; }
  .stories__track { animation: none; }
}

/* 新首页设计稿(只注入截图页面,不进仓库)。沿用 theme.css 令牌与现有组件,新块前缀 nh-。 */

/* 主题图切换:设计稿内所有成对的深/浅截图 */
.mk .logo-light, .nh-mega .logo-light { display: none; }
:root[data-theme="light"] .mk .logo-dark, :root[data-theme="light"] .nh-mega .logo-dark { display: none; }
:root[data-theme="light"] .mk .logo-light, :root[data-theme="light"] .nh-mega .logo-light { display: block; }

/* ── 导航 ── */
.nh-caret { margin-left: 4px; opacity: .7; }
.nh-mega .mega__inner { grid-template-columns: 1.3fr .7fr; }
.nh-mega__cols { grid-template-columns: 1fr 1fr; }
.nh-mega__demo { padding: 0 0 22px; overflow: hidden; }
.nh-mega__demo img { width: 100%; height: 150px; object-fit: cover; object-position: left top; border-bottom: 1px solid var(--border); margin-bottom: 18px; }
.nh-mega__demo > span { padding-inline: 22px; }

/* ── 首屏 ── */
.nh-hero { padding-bottom: 48px; }
.nh-hero__inner { position: relative; z-index: 1; text-align: center; max-width: 1000px; margin: 0 auto; }
.nh-hero__h1 { margin: 0 auto 22px; }
.nh-hero__sub { margin: 0 auto; max-width: 620px; color: var(--text-2); font-size: clamp(16px, 1.25vw, 18.5px); line-height: 1.65; }
.nh-cta-row { margin-top: 34px; display: flex; justify-content: center; align-items: center; gap: 12px; flex-wrap: wrap; }
.nh-cta-row .hero-check { margin: 0; width: min(520px, 100%); max-width: none; }
.nh-cta-row .hero-check__input { padding-block: 12px; }
.nh-demo-btn { height: 58px; border-radius: 999px; padding-inline: 26px; background: var(--surface); }
.nh-note { margin-top: 16px; }

.nh-shot-wrap { position: relative; margin: 60px auto 0; width: min(1200px, calc(100% - 2 * var(--gutter))); z-index: 1; }
.nh-shot-wrap::before {
  content: ""; position: absolute; left: 8%; right: 8%; top: -40px; height: 260px; z-index: -1;
  background: radial-gradient(ellipse at 50% 50%, color-mix(in oklab, var(--accent) 22%, transparent), transparent 70%);
  filter: blur(30px); opacity: .8;
}
.nh-shot {
  position: relative; display: block; overflow: hidden; text-decoration: none;
  border-radius: 16px; border: 1px solid var(--border-2); background: var(--surface);
  box-shadow: 0 50px 120px -50px rgba(0,0,0,.75);
}
:root[data-theme="light"] .nh-shot { box-shadow: 0 40px 100px -50px rgba(27,34,48,.35); }
.nh-shot__bar { display: flex; align-items: center; gap: 7px; height: 38px; padding: 0 16px; border-bottom: 1px solid var(--border); background: var(--bg-2); }
.nh-shot__bar i { width: 10px; height: 10px; border-radius: 50%; background: var(--border-2); }
.nh-shot__bar span { margin: 0 auto; transform: translateX(-24px); font-size: 12px; color: var(--text-3); padding: 3px 14px; border-radius: 7px; background: var(--surface); border: 1px solid var(--border); }
.nh-shot__img { display: block; width: 100%; height: 640px; object-fit: cover; object-position: left top; }
.nh-shot__open {
  position: absolute; top: 54px; right: 18px; font-size: 13px; font-weight: 600; color: var(--accent-ink);
  background: var(--accent); border-radius: 999px; padding: 7px 14px; box-shadow: 0 8px 24px -8px rgba(0,0,0,.5);
}
.nh-shot__fade { position: absolute; left: 0; right: 0; bottom: 0; height: 180px; background: linear-gradient(to bottom, transparent, var(--bg)); pointer-events: none; }
.nh-hero .engine-marquee { margin-top: 40px; }
.nh-entity { margin: 26px auto 0; max-width: 760px; text-align: center; color: var(--text-3); font-size: 12.5px; line-height: 1.7; }

/* ── 新首页各区块留白收紧一档 ── */
.nh-feat, .nh-steps, .nh-aud, .mk-cs { padding-block: clamp(64px, 7vw, 100px); }

/* ── 合作伙伴横条:收紧上下留白 ── */
.mk-fp { padding-block: 56px; }

/* ── 产品功能:2×2 截图卡 ── */
.nh-bento { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.nh-card {
  position: relative; display: flex; flex-direction: column; min-height: 470px; overflow: hidden;
  border: 1px solid var(--border); border-radius: 20px; background: var(--surface); color: inherit; text-decoration: none;
  transition: border-color .2s, transform .2s;
}
.nh-card:hover { border-color: color-mix(in oklab, var(--accent) 55%, var(--border)); transform: translateY(-2px); }
.nh-card__txt { padding: 30px 32px 0; }
.nh-card__txt h3 { margin: 0 0 8px; font-family: var(--font-display); font-size: 22px; font-weight: 600; letter-spacing: -.01em; color: var(--text); }
.nh-card__txt p { margin: 0; max-width: 420px; color: var(--text-2); font-size: 14.5px; line-height: 1.65; }
.nh-card__more { position: absolute; top: 32px; right: 30px; font-size: 13px; color: var(--text-3); }
.nh-card:hover .nh-card__more { color: var(--accent); }
.nh-card__img {
  position: relative; flex: 1; min-height: 280px; margin: 26px 0 0 32px; overflow: hidden;
  border: 1px solid var(--border-2); border-right: 0; border-bottom: 0; border-top-left-radius: 12px; background: var(--bg);
}
.nh-card__img img { position: absolute; left: 0; top: 0; width: 175%; height: auto; max-width: none; }
.nh-card__img--fit img { width: 118%; }

/* ── 三步上手 ── */
.nh-steps__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.nh-step { display: flex; flex-direction: column; overflow: hidden; padding: 26px 28px 0; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); }
.nh-step__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.nh-step__n { font-family: var(--font-display); font-size: 14px; font-weight: 700; letter-spacing: .1em; color: var(--accent); }
.nh-step__tag { font-size: 12px; color: var(--text-2); border: 1px solid var(--border-2); border-radius: 999px; padding: 3px 11px; }
.nh-step__tag--free { color: #2bb38a; border-color: color-mix(in oklab, #2bb38a 45%, transparent); }
.nh-step h3 { margin: 0 0 8px; font-family: var(--font-display); font-size: 21px; font-weight: 600; color: var(--text); }
.nh-step p { margin: 0; color: var(--text-2); font-size: 14.5px; line-height: 1.6; }
.nh-step__vis { position: relative; height: 180px; margin: 24px -28px 0; overflow: hidden; border-top: 1px solid var(--border); background: var(--bg); }
.nh-step__vis img { position: absolute; left: 0; top: 0; height: 100%; width: auto; max-width: none; }
.nh-step__vis--form { display: flex; align-items: center; padding: 0 22px; background: var(--bg-2); }
.nh-step__vis--form .hero-check { margin: 0; width: 100%; }
.nh-step__vis--form .hero-check__btn { padding: 9px 16px; font-size: 13.5px; }

/* ── 适合谁 ── */
.nh-aud__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.nh-aud__card {
  display: flex; flex-direction: column; gap: 14px; min-height: 230px; padding: 32px;
  border: 1px solid var(--border); border-radius: 20px; background: var(--surface); color: inherit; text-decoration: none;
  transition: border-color .2s;
}
.nh-aud__card:hover { border-color: color-mix(in oklab, var(--accent) 55%, var(--border)); }
.nh-aud__tag { font-family: var(--font-display); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.nh-aud__card h3 { margin: 0; font-family: var(--font-display); font-size: 26px; font-weight: 600; letter-spacing: -.015em; line-height: 1.25; color: var(--text); }
.nh-aud__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.nh-aud__chips span { font-size: 13px; color: var(--text-2); border: 1px solid var(--border-2); border-radius: 999px; padding: 5px 12px; }
.nh-aud__link { margin-top: auto; font-size: 14px; font-weight: 600; color: var(--text); }
.nh-aud__card:hover .nh-aud__link { color: var(--accent); }

/* ── 托管服务横幅 ── */
.nh-svc { padding-block: 64px; }
.nh-svc__bar {
  display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 30px 36px;
  border: 1px solid var(--border); border-radius: 20px;
  background: linear-gradient(90deg, color-mix(in oklab, var(--accent) 9%, var(--surface)), var(--surface) 70%);
}
.nh-svc__eyebrow { margin: 0 0 8px; font-family: var(--font-display); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.nh-svc__bar h3 { margin: 0 0 6px; font-family: var(--font-display); font-size: 24px; font-weight: 600; color: var(--text); }
.nh-svc__bar p { margin: 0; color: var(--text-2); font-size: 14.5px; }
.nh-svc__cta { display: flex; align-items: center; gap: 18px; flex-shrink: 0; }
.nh-textlink { font-size: 14px; font-weight: 600; color: var(--text-2); border-bottom: 1px solid currentColor; padding-bottom: 1px; }

/* ── 结尾 CTA ── */
.nh-cta .nh-cta-row { margin-top: 36px; }

@media (max-width: 860px) {
  .nh-cta-row { flex-direction: column; align-items: stretch; }
  .nh-cta-row .hero-check { width: 100%; }
  .nh-demo-btn { justify-content: center; height: 52px; }
  .nh-shot-wrap { margin-top: 40px; }
  .nh-shot__img { height: 300px; }
  .nh-shot__open { display: none; }
  .nh-bento, .nh-steps__list, .nh-aud__grid { grid-template-columns: 1fr; }
  .nh-card { min-height: 400px; }
  .nh-card__txt { padding: 24px 22px 0; }
  .nh-card__more { display: none; }
  .nh-card__img { margin-left: 22px; min-height: 230px; }
  .nh-card__img img { width: 260%; }
  .nh-card__img--fit img { width: 170%; }
  .nh-svc__bar { flex-direction: column; align-items: flex-start; padding: 26px 22px; }
}

/* 首页设计稿 v2(以产品为核心):首屏一行标题 + 两个按钮 + 整块真实看板;产品分区每屏一张大界面图。 */

/* ── 首屏 ── */
.v2-hero { padding-top: clamp(56px, 6vw, 88px); padding-bottom: 0; }
.v2-hero__inner { position: relative; z-index: 1; text-align: center; }
.v2-hero__h1 {
  margin: 0; color: var(--text); font-family: var(--font-display); font-weight: 600;
  font-size: clamp(34px, 4.3vw, 62px); line-height: 1.1; letter-spacing: -.03em;
}
.v2-hero__sub { margin: 18px auto 0; max-width: 760px; color: var(--text-2); font-size: clamp(16px, 1.3vw, 19px); line-height: 1.6; }
.v2-hero__ctas { margin-top: 30px; display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.v2-btn { height: 52px; padding-inline: 26px; border-radius: 12px; font-size: 15.5px; }
.v2-btn--ghost { background: transparent; }
.v2-hero__note { margin: 14px 0 0; color: var(--text-3); font-size: 13px; }
.v2-ui {
  position: relative; z-index: 1; overflow: hidden;
  width: min(1240px, calc(100% - 2 * var(--gutter))); margin: 46px auto 0;
  border: 1px solid color-mix(in oklab, var(--text) 16%, transparent); border-bottom: 0; border-radius: 16px 16px 0 0;
  box-shadow: 0 -30px 140px -50px color-mix(in oklab, var(--accent) 45%, transparent), 0 40px 120px -40px rgba(0,0,0,.6);
}
.v2-ui img { display: block; width: 100%; height: auto; }

/* ── 合作伙伴 + 引擎覆盖 横条 ── */
.v2-trust { padding: 34px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--bg-2); position: relative; z-index: 2; }
.v2-trust__row { display: flex; align-items: center; justify-content: center; gap: 44px; flex-wrap: wrap; }
.v2-trust__group { display: flex; align-items: center; gap: 18px; }
.v2-trust__label { color: var(--text-3); font-size: 12.5px; letter-spacing: .06em; }
.v2-trust__oa { height: 46px; width: auto; border-radius: 8px; }
.v2-trust__aw { display: inline-flex; align-items: center; gap: 10px; }
.v2-trust__aw img { height: 22px; width: auto; }
.v2-trust__aw small { padding-left: 10px; border-left: 1px solid var(--border-2); color: var(--text-2); font-size: 12px; }
.v2-trust__sep { width: 1px; height: 40px; background: var(--border-2); }
.v2-engines { display: flex; align-items: center; gap: 14px; }
.v2-engines img { width: 26px; height: 26px; object-fit: contain; border-radius: 6px; }
:root[data-theme="dark"] .v2-engines img.inv { filter: brightness(0) invert(1); }

/* ── 通用区块标题 ── */
.v2-head { max-width: 820px; margin: 0 auto clamp(36px, 4.5vw, 60px); text-align: center; }
.v2-head .eyebrow { margin-bottom: 14px; }
.v2-h2 { margin: 0; color: var(--text); font-family: var(--font-display); font-weight: 600; font-size: clamp(28px, 3vw, 42px); line-height: 1.2; letter-spacing: -.025em; }

/* ── 产品:每屏一张大界面图,左右交替 ── */
.v2-prod, .v2-free, .v2-aud { padding-block: clamp(64px, 7vw, 104px); }
.v2-row { display: grid; grid-template-columns: .75fr 1.25fr; align-items: center; gap: clamp(32px, 4.5vw, 72px); padding: 44px 0; }
.v2-row + .v2-row { border-top: 1px solid var(--border); }
.v2-row--flip { grid-template-columns: 1.25fr .75fr; }
.v2-row--flip .v2-row__txt { order: 2; }
.v2-row__k { margin: 0 0 12px; color: var(--accent); font-family: var(--font-display); font-size: 12.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.v2-row__txt h3 { margin: 0 0 14px; color: var(--text); font-family: var(--font-display); font-size: clamp(24px, 2.2vw, 32px); font-weight: 600; line-height: 1.25; letter-spacing: -.02em; }
.v2-row__txt > p { margin: 0 0 22px; max-width: 440px; color: var(--text-2); font-size: 15.5px; line-height: 1.7; }
.v2-ticks { list-style: none; margin: 0 0 26px; padding: 0; display: grid; gap: 11px; }
.v2-ticks li { position: relative; padding-left: 27px; color: var(--text); font-size: 14.5px; }
.v2-ticks li::before { content: ""; position: absolute; left: 0; top: 2px; width: 17px; height: 17px; border-radius: 50%; background: color-mix(in oklab, var(--accent) 20%, transparent); }
.v2-ticks li::after { content: ""; position: absolute; left: 5px; top: 7px; width: 6px; height: 3.5px; border-left: 1.7px solid var(--accent); border-bottom: 1.7px solid var(--accent); transform: rotate(-45deg); }
.v2-link { color: var(--text); font-size: 14.5px; font-weight: 600; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.v2-link:hover { color: var(--accent); }
.v2-row__ui, .v2-lockui {
  position: relative; overflow: hidden; border-radius: 14px; background: #F7F5F0;
  border: 1px solid color-mix(in oklab, var(--text) 13%, transparent);
  box-shadow: 0 30px 90px -40px rgba(0,0,0,.65);
}
:root[data-theme="light"] .v2-row__ui, :root[data-theme="light"] .v2-lockui, :root[data-theme="light"] .v2-ui { box-shadow: 0 30px 80px -40px rgba(27,34,48,.3); }
.v2-row__ui img, .v2-lockui img { display: block; width: 100%; height: auto; }
.v2-row__ui { padding: 12px 12px 0; }
.v2-row__ui img { border-radius: 8px 8px 0 0; }

/* ── 免费开始:免费 / 注册解锁 / 试用解锁 ── */
.v2-free__grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(32px, 4vw, 60px); align-items: center; }
.v2-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.v2-steps li { padding: 20px 22px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); }
.v2-steps h3 { margin: 12px 0 6px; color: var(--text); font-family: var(--font-display); font-size: 19px; font-weight: 600; }
.v2-steps p { margin: 0; color: var(--text-2); font-size: 14px; line-height: 1.65; }
.v2-steps li.v2-steps__cta { padding: 10px 0 0; border: 0; background: none; }
.v2-tag { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 999px; font-family: var(--font-sans); font-size: 12px; font-weight: 600; }
.v2-tag--free { color: #1d9a70; background: color-mix(in oklab, #2bb38a 16%, transparent); }
.v2-tag--reg { color: var(--text); background: color-mix(in oklab, var(--text) 10%, transparent); }
.v2-tag--trial { color: #b8791a; background: color-mix(in oklab, var(--accent) 20%, transparent); }
:root[data-theme="dark"] .v2-tag--trial { color: var(--accent); }
.v2-lock { position: absolute; display: flex; align-items: center; justify-content: center; }
.v2-lock b { background: #fff !important; box-shadow: 0 6px 20px -6px rgba(27,34,48,.35); }
.v2-lock .v2-tag--reg { color: #1B2230; }
.v2-lock .v2-tag--trial { color: #b8791a; }
.v2-lock--blur { border-radius: 10px; background: rgba(247,245,240,.55); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }
.v2-lock--kpi { left: 19.6%; top: 11%; }
.v2-lock--chart { left: 21.4%; top: 47%; width: 38%; height: 50%; }
.v2-lock--rank { left: 61%; top: 74.5%; width: 36%; height: 18.5%; }
.v2-lock--nav { left: 1.3%; top: 16.5%; width: 16.6%; height: 45%; }

/* ── 结尾 ── */
.v2-final { padding-block: clamp(64px, 7vw, 104px); }
.v2-final__box {
  display: grid; grid-template-columns: 1fr 1.05fr; gap: 40px; align-items: center; overflow: hidden;
  padding: 56px 0 56px 56px; border: 1px solid var(--border); border-radius: 24px;
  background: radial-gradient(120% 140% at 0% 0%, color-mix(in oklab, var(--accent) 13%, transparent), transparent 60%), var(--surface);
}
.v2-final__box p { margin: 14px 0 0; color: var(--text-2); font-size: 16px; }
.v2-final__ctas { justify-content: flex-start; }
.v2-final__ui { align-self: stretch; position: relative; min-height: 300px; }
.v2-final__ui img { position: absolute; left: 0; top: 0; width: 135%; max-width: none; border-radius: 12px 0 0 12px; border: 1px solid color-mix(in oklab, var(--text) 13%, transparent); box-shadow: 0 20px 60px -30px rgba(0,0,0,.6); }

@media (max-width: 860px) {
  .v2-ui { margin-top: 32px; border-radius: 12px 12px 0 0; }
  .v2-trust__row { flex-direction: column; gap: 18px; }
  .v2-trust__sep { display: none; }
  .v2-trust__group { flex-wrap: wrap; justify-content: center; }
  .v2-engines { flex-wrap: wrap; justify-content: center; }
  .v2-row, .v2-row--flip, .v2-free__grid, .v2-final__box { grid-template-columns: 1fr; }
  .v2-row { padding: 32px 0; }
  .v2-row--flip .v2-row__txt { order: 0; }
  .v2-final__box { padding: 30px 22px; }
  .v2-final__ui { display: none; }
  .v2-hero__ctas .v2-btn, .v2-steps__cta .v2-btn { width: 100%; justify-content: center; }
}

/* 中文标题按词断行,避免单字落行 */
.v2-hero__h1, .v2-h2, .v2-row__txt h3 { word-break: keep-all; text-wrap: balance; }

/* 保留原 slogan:轮换词金色斜体 + 打字光标(同现站 .display--hero em) */
.v2-hero__h1 em { color: var(--accent); font-style: italic; font-weight: 800; }
.v2-hero__h1 .typer { min-width: 2ch; }

/* 首页 v5:首屏以下按 SaaS 思路讲产品,但用 Geolix 自家的视觉(居中眉题、圆角卡、金色强调、光晕),
   不沿用 GEOly 的细线框架、灰色续句标题、左侧竖导航和圆点阵。 */

/* ── 产品分区:眉题下一排锚点标签 ── */
.p5-head { margin-bottom: clamp(24px, 3vw, 40px); }
.p5-tabs { display: inline-flex; flex-wrap: wrap; justify-content: center; gap: 4px; margin-top: 26px; padding: 5px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); }
.p5-tabs a { padding: 8px 18px; border-radius: 999px; color: var(--text-2); font-size: 14px; }
.p5-tabs a.is-on { background: var(--accent); color: #0E0E10; font-weight: 600; }
.p5-prod .v2-row { padding: 40px 0; }

/* 文字栏下面挂一张小模块图,让每块不只一张大图 */
.p5-mini { display: flex; align-items: center; gap: 16px; margin-top: 6px; }
.p5-mini > div {
  flex-shrink: 0; width: 210px; height: 128px; overflow: hidden; border-radius: 10px; background: #F7F5F0;
  border: 1px solid color-mix(in oklab, var(--text) 13%, transparent); box-shadow: 0 16px 40px -24px rgba(0,0,0,.55);
}
.p5-mini img { display: block; width: 100%; height: auto; }
.p5-mini span { color: var(--text-2); font-size: 13.5px; line-height: 1.55; }

/* ── 看板里还有:模块墙 ── */
.p5-wall { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.p5-card { margin: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); }
.p5-card--w2 { grid-column: span 2; }
.p5-card__ui { height: 270px; overflow: hidden; padding: 24px 24px 0; background: var(--bg-2); border-bottom: 1px solid var(--border); }
.p5-card__ui img { display: block; width: 100%; height: auto; border-radius: 10px 10px 0 0; border: 1px solid color-mix(in oklab, var(--text) 13%, transparent); border-bottom: 0; box-shadow: 0 16px 40px -24px rgba(0,0,0,.5); }
.p5-card__ui--fit { display: flex; align-items: center; padding: 24px; }
.p5-card__ui--fit img { border-radius: 10px; border-bottom: 1px solid color-mix(in oklab, var(--text) 13%, transparent); }
.p5-card figcaption { padding: 18px 24px 22px; color: var(--text-2); font-size: 14px; line-height: 1.6; }
.p5-card figcaption b { display: block; margin-bottom: 4px; color: var(--text); font-size: 16px; font-weight: 600; }

/* ── 海外 + 中文 AI 引擎 ── */
.p5-eng { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: clamp(32px, 4.5vw, 72px); }
.p5-eng__txt .eyebrow { margin-bottom: 14px; }
.p5-eng__txt > p { max-width: 470px; margin: 18px 0 28px; color: var(--text-2); font-size: 15.5px; line-height: 1.75; }
.p5-eng__grp { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }
.p5-eng__lab { width: 42px; color: var(--accent); font-size: 12.5px; font-weight: 700; letter-spacing: .06em; }
.p5-chip { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--border-2); background: var(--surface); color: var(--text); font-size: 13px; }
.p5-chip img { width: 16px; height: 16px; object-fit: contain; border-radius: 3px; }
:root[data-theme="dark"] .p5-chip img.inv { filter: brightness(0) invert(1); }
.p5-eng__ui, .p5-opp__ui {
  overflow: hidden; border-radius: 16px; background: #F7F5F0;
  border: 1px solid color-mix(in oklab, var(--text) 13%, transparent); box-shadow: 0 30px 90px -40px rgba(0,0,0,.65);
}
.p5-eng__ui { padding: 12px 12px 0; }
.p5-eng__ui img, .p5-opp__ui img { display: block; width: 100%; height: auto; }
.p5-eng__ui img { border-radius: 8px 8px 0 0; }
:root[data-theme="light"] .p5-eng__ui, :root[data-theme="light"] .p5-opp__ui, :root[data-theme="light"] .p5-mini > div { box-shadow: 0 24px 60px -36px rgba(27,34,48,.3); }

/* ── 增长机会 ── */
.p5-opp {
  display: grid; grid-template-columns: .8fr 1.2fr; align-items: center; gap: clamp(32px, 4vw, 56px); padding: 52px;
  border: 1px solid var(--border); border-radius: 24px;
  background: radial-gradient(110% 120% at 0% 0%, color-mix(in oklab, var(--accent) 11%, transparent), transparent 55%), var(--surface);
}
.p5-opp__txt .mk-h2 { font-size: clamp(26px, 2.5vw, 36px); line-height: 1.25; }
.p5-opp__steps { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 18px; }
.p5-opp__steps li { display: flex; gap: 14px; }
.p5-opp__steps b { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: color-mix(in oklab, var(--accent) 18%, transparent); color: var(--accent); font-size: 13px; }
.p5-opp__steps h4 { margin: 3px 0 4px; color: var(--text); font-size: 16px; font-weight: 600; }
.p5-opp__steps p { margin: 0; color: var(--text-2); font-size: 14px; line-height: 1.6; }

/* 价格:直接用产品页的价格模块,只收一下上下留白 */
.mk-pricing { padding-block: clamp(64px, 7vw, 100px); }

@media (max-width: 860px) {
  .p5-tabs { border-radius: 16px; }
  .p5-mini > div { width: 150px; height: 92px; }
  .p5-wall, .p5-eng, .p5-opp { grid-template-columns: 1fr; }
  .p5-card--w2 { grid-column: auto; }
  .p5-card__ui { height: 210px; padding: 18px 18px 0; }
  .p5-opp { padding: 28px 20px; }
}

/* ── 客户故事卡:浅色方案(不在浅色页面里放深色块) ── */
:root[data-theme="light"] .cs-card { background: #F1EDE4; color: #1B2230; border-color: var(--border); }
:root[data-theme="light"] .cs-card__shade { background: linear-gradient(90deg, rgba(250,248,242,.97) 0%, rgba(250,248,242,.82) 38%, rgba(250,248,242,0) 68%), linear-gradient(0deg, rgba(250,248,242,.75) 0%, rgba(250,248,242,0) 40%); }
:root[data-theme="light"] .cs-card__label { color: #1B2230; }
:root[data-theme="light"] .cs-card__quote { color: rgba(27,34,48,.72); }
:root[data-theme="light"] .cs-card__who { color: rgba(27,34,48,.58); }
:root[data-theme="light"] .cs-card__who b { color: #1B2230; }
:root[data-theme="light"] .cs-card__who i { background: rgba(27,34,48,.4); }
:root[data-theme="light"] .cs-card__phtag { color: rgba(27,34,48,.6); border-color: rgba(27,34,48,.3); }
:root[data-theme="light"] .cs-card__logo--ph { color: #1B2230; border-color: rgba(27,34,48,.35); }
:root[data-theme="light"] .cs-card__logo--ph small { color: rgba(27,34,48,.5); }
:root[data-theme="light"] .cs-card__stat--ph { color: rgba(27,34,48,.3); }
:root[data-theme="light"] .cs-card__avatar { border-color: rgba(27,34,48,.15); }
:root[data-theme="light"] .cs-card__cta { background: #fff; border-color: rgba(27,34,48,.15); color: #1B2230; }

/* 首页 v7(浅色,短版):首屏 → 合作伙伴与引擎横条 → 产品(带进度线的标签) → 客户故事 → 价格 → 常见问题 → 结尾 */

/* ── 合作伙伴 + 9 引擎:统一 48px 规格 ── */
.p7-trust { padding: 30px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--bg-2); }
.p7-trust__row { display: flex; align-items: stretch; justify-content: center; gap: 48px; }
.p7-trust__grp { display: flex; flex-direction: column; gap: 12px; }
.p7-trust__lab { margin: 0; color: var(--text-3); font-size: 12.5px; letter-spacing: .04em; }
.p7-trust__items { display: flex; align-items: center; gap: 12px; height: 48px; }
.p7-badge { display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 18px 0 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.p7-badge img { width: 26px; height: 26px; object-fit: contain; }
.p7-badge b { display: block; color: var(--text); font-size: 14px; font-weight: 600; line-height: 1.2; }
.p7-badge small { display: block; color: var(--text-3); font-size: 11.5px; line-height: 1.35; }
.p7-trust__sep { width: 1px; background: var(--border); }
.p7-engs { gap: 8px; }
.p7-engs span { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.p7-engs img { width: 24px; height: 24px; object-fit: contain; border-radius: 5px; }

/* ── 产品:一排标签,下面一条进度线;一次只显示一个功能 ── */
.p7-prod { padding-block: clamp(64px, 7vw, 104px); }
.p7-tabs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; margin: 0 0 28px; }
.p7-tab { display: flex; flex-direction: column; gap: 14px; cursor: pointer; }
.p7-tab span { color: var(--text-3); font-size: 15px; font-weight: 500; }
.p7-tab.is-on span { color: var(--text); font-weight: 600; }
.p7-tab i { position: relative; display: block; height: 2px; overflow: hidden; border-radius: 2px; background: var(--border); }
.p7-tab.is-on i::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: var(--p, 0%); background: var(--accent); }
.p7-panel { display: none; grid-template-columns: .8fr 1.2fr; align-items: center; gap: 48px; overflow: hidden; padding: 52px 0 52px 52px; border: 1px solid var(--border); border-radius: 24px; background: var(--surface); }
.p7-panel.is-on { display: grid; }
.p7-pill { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 9px; border: 1px solid var(--border); background: var(--bg); color: var(--text); font-size: 13px; font-weight: 500; }
.p7-pill svg { color: var(--accent); }
.p7-panel__txt h3 { margin: 22px 0 14px; color: var(--text); font-family: var(--font-display); font-size: clamp(28px, 2.6vw, 38px); font-weight: 600; line-height: 1.22; letter-spacing: -.02em; word-break: keep-all; text-wrap: balance; }
.p7-panel__txt p { margin: 0 0 26px; max-width: 420px; color: var(--text-2); font-size: 16px; line-height: 1.75; }
.p7-panel__ui { overflow: hidden; border-radius: 14px 0 0 14px; border: 1px solid color-mix(in oklab, var(--text) 12%, transparent); border-right: 0; background: #F7F5F0; box-shadow: 0 24px 60px -36px rgba(27,34,48,.3); }
.p7-panel__ui img { display: block; width: 100%; height: auto; }

/* ── 价格上方:免费 → 注册 → 试用 三步(取代原来单独一屏) ── */
.p7-free { display: flex; justify-content: center; align-items: center; gap: 12px; flex-wrap: wrap; margin: -8px auto 34px; color: var(--text-2); font-size: 14px; }
.p7-free span { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px 8px 8px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); }
.p7-free b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: color-mix(in oklab, var(--accent) 22%, transparent); color: #a86c12; font-size: 12px; }
.p7-free i { color: var(--text-3); font-style: normal; }

@media (max-width: 860px) {
  .p7-trust__row { flex-direction: column; align-items: center; gap: 20px; }
  .p7-trust__sep { display: none; }
  .p7-trust__grp { align-items: center; }
  .p7-trust__items { flex-wrap: wrap; justify-content: center; height: auto; }
  .p7-engs span { width: 40px; height: 40px; }
  .p7-tabs { display: flex; gap: 18px; overflow-x: auto; padding-bottom: 4px; }
  .p7-tab { flex: 0 0 auto; }
  .p7-panel.is-on { grid-template-columns: 1fr; gap: 24px; padding: 28px 0 0 22px; }
  .p7-panel__txt { padding-right: 22px; }
}

/* ── 结尾:安静一点,G 标志 + 一句标题 + 一句说明 + 两个常规按钮 ── */
.p7-end { position: relative; overflow: hidden; border-top: 1px solid var(--border); background: var(--bg); }
.p7-end::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size: 56px 56px; background-position: center;
  mask-image: radial-gradient(ellipse 55% 75% at 50% 50%, #000 25%, transparent 85%);
}
.p7-end__in { position: relative; padding: 116px 0 124px; text-align: center; }
.p7-end__mark { display: block; width: 52px; height: 52px; margin: 0 auto 26px; }
.p7-end__h { margin: 0; color: var(--text); font-family: var(--font-display); font-weight: 600; font-size: clamp(30px, 3.4vw, 46px); letter-spacing: -.025em; }
.p7-end__sub { margin: 16px auto 0; max-width: 640px; color: var(--text-2); font-size: 16.5px; line-height: 1.7; }
.p7-end__ctas { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.p7-end__btn { height: 44px; padding-inline: 20px; border-radius: 10px; font-size: 14.5px; }
.p7-end__btn.btn--outline { background: var(--surface); }
@media (max-width: 860px) { .p7-end__in { padding: 84px 0 92px; } }
.p7-end__h em { color: var(--accent); font-style: italic; font-weight: 800; }
.p7-end__h { word-break: keep-all; text-wrap: balance; }

/* 首页 v8(浅色):标题统一左对齐加粗;免费三步改成 Peec 式卡片 + 真实流程界面;客户评价改成 Peec 式引语卡;
   价格标题学 GEOly(黑字一句 + 灰字补充,月付/年付放右侧);常见问题左右两栏。导航菜单保持线上原样。 */

/* ── 首屏标题小一档 ── */
.v2-hero__h1 { font-size: clamp(34px, 3.9vw, 56px); }

/* ── 区块标题:左对齐,加粗,右侧放说明 / 按钮 / 切换 ── */
.p8-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px 64px; margin-bottom: clamp(32px, 4vw, 48px); }
.p8-head .eyebrow { margin: 0 0 16px; }
.p8-h2 {
  margin: 0; max-width: 780px; color: var(--text); font-family: var(--font-display); font-weight: 700;
  font-size: clamp(30px, 3vw, 44px); line-height: 1.22; letter-spacing: -.025em; word-break: keep-all; text-wrap: balance;
}
.p8-h2 > span { display: block; color: #9A9DA6; }
.p8-head__aside { flex: 0 1 400px; margin: 0; padding-left: 24px; border-left: 1px solid var(--border-2); color: var(--text-2); font-size: 15.5px; line-height: 1.75; }
.p8-head__cta { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; flex: none; }
.p8-head__cta small { color: var(--text-3); font-size: 12.5px; }
.p8-head__cta .v2-btn { height: 48px; }

/* ── 免费三步:三张卡,上面一句话,下面是流程里的真实界面 ── */
.p8-free { padding-block: clamp(64px, 7vw, 104px); }
.p8-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.p8-step { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); }
.p8-step__txt { padding: 28px 28px 24px; }
.p8-step__k { display: flex; align-items: center; gap: 8px; margin: 0 0 16px; color: var(--text-3); font-size: 12.5px; font-weight: 600; letter-spacing: .06em; }
.p8-step__k b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: color-mix(in oklab, var(--accent) 20%, transparent); color: #A86C12; font-size: 12px; letter-spacing: 0; }
.p8-step h3 { margin: 0 0 8px; color: var(--text); font-family: var(--font-display); font-size: 20px; font-weight: 700; letter-spacing: -.01em; }
.p8-step__txt > p:last-child { margin: 0; color: var(--text-2); font-size: 14.5px; line-height: 1.7; }
.p8-step__ui {
  position: relative; height: 300px; margin-top: auto; padding: 24px; overflow: hidden;
  background: radial-gradient(circle, color-mix(in oklab, var(--text) 9%, transparent) 1px, transparent 1.4px) 0 0 / 14px 14px, var(--bg-2);
  border-top: 1px solid var(--border);
}
.p8-frag {
  display: flex; flex-direction: column; height: 100%; overflow: hidden; padding: 16px 16px 10px; border: 1px solid color-mix(in oklab, var(--text) 11%, transparent); border-radius: 12px;
  background: #fff; color: #1B2230; font-size: 12.5px; box-shadow: 0 18px 44px -28px rgba(27,34,48,.4);
}
.p8-frag i { font-style: normal; }
/* ① 检测结果 */
.fr-site { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid #EEE9DF; }
.fr-site > i, .fr-rank i { display: grid; place-items: center; flex: none; width: 24px; height: 24px; border-radius: 6px; color: #fff; font-size: 11.5px; font-weight: 700; }
.fr-site > i { width: 30px; height: 30px; border-radius: 8px; font-size: 13px; }
.fr-site b { display: block; font-size: 13.5px; }
.fr-site small { color: #6B7180; font-size: 11.5px; }
.fr-site em { color: #D48A16; font-style: normal; font-weight: 700; }
.fr-lab { margin: 12px 0 6px; color: #9A9DA6; font-size: 11px; letter-spacing: .04em; }
.fr-rank { list-style: none; margin: 0; padding: 0; }
.fr-rank li { display: flex; align-items: center; gap: 10px; padding: 4px 8px; border-radius: 8px; font-size: 12.5px; }
.fr-rank li > span { width: 10px; color: #9A9DA6; font-size: 11px; }
.fr-rank em { margin-left: auto; color: #3A4150; font-style: normal; font-size: 12px; }
.fr-rank li.is-me { background: #F6EBDA; }
/* ② 注册 */
.fr-h { display: block; font-size: 15px; }
.fr-sub { display: block; margin: 4px 0 12px; color: #6B7180; font-size: 11.5px; }
.fr-btn { display: flex; align-items: center; justify-content: center; gap: 8px; height: 36px; margin-bottom: 8px; border: 1px solid #DCD5C7; border-radius: 9px; font-size: 12.5px; font-weight: 500; }
.fr-or { display: flex; align-items: center; gap: 10px; margin: 12px 0 10px; color: #9A9DA6; font-size: 11px; }
.fr-or::before, .fr-or::after { content: ""; flex: 1; height: 1px; background: #EEE9DF; }
.fr-input { display: flex; align-items: center; height: 36px; padding: 0 12px; border: 1px solid #DCD5C7; border-radius: 9px; color: #A3A6AE; font-size: 12.5px; }
/* ③ 试用 */
.fr-opt { display: flex; gap: 10px; margin-bottom: 8px; padding: 10px 12px; border: 1px solid #E5E0D5; border-radius: 10px; }
.fr-opt > i { flex: none; width: 14px; height: 14px; margin-top: 2px; border: 1.5px solid #C8C0AE; border-radius: 50%; }
.fr-opt.is-on { border-color: #E5A338; background: #FFF9EE; }
.fr-opt.is-on > i { border-color: #E5A338; box-shadow: inset 0 0 0 3px #fff, inset 0 0 0 7px #E5A338; }
.fr-opt b { display: block; font-size: 12.5px; }
.fr-opt b em { margin-left: 4px; padding: 1px 6px; border-radius: 5px; background: #FBEBCF; color: #B87A1A; font-size: 10.5px; font-style: normal; }
.fr-opt small { color: #6B7180; font-size: 11px; }
.fr-sum { display: flex; justify-content: space-between; align-items: baseline; padding: 9px 2px; border-top: 1px solid #EEE9DF; color: #6B7180; font-size: 11.5px; }
.fr-sum b { color: #1B2230; font-size: 12px; }
.fr-sum--big { margin-top: auto; }
.fr-sum--big b { font-size: 18px; }

/* ── 客户评价:Peec 式引语卡(暂不放头像) ── */
.p8-say { padding-block: clamp(64px, 7vw, 100px); }
.p8-quotes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.p8-quote { display: flex; flex-direction: column; justify-content: space-between; gap: 28px; margin: 0; padding: 30px 32px 28px; border: 1px solid var(--border); border-radius: 18px; background: var(--surface); }
.p8-quote blockquote { margin: 0; color: var(--text-2); font-size: 16.5px; line-height: 1.8; }
.p8-quote figcaption { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.p8-quote figcaption b { display: block; color: var(--text); font-size: 15px; font-weight: 600; }
.p8-quote figcaption small { display: block; margin-top: 3px; color: var(--text-3); font-size: 13px; }
.p8-quote__logo { height: 26px; width: auto; filter: grayscale(1) brightness(.25); }
.p8-wm { color: #1B2230; font-family: var(--font-display); font-size: 18px; font-weight: 800; letter-spacing: .03em; }

/* ── 价格:标题学 GEOly,切换放右侧 ── */
.mk-pricing .p8-head { margin-bottom: 40px; }
.mk-pricing .p8-head .aud-cycle { flex: none; margin-bottom: 8px; }
.mk-pricing .aud-cycle button { padding: 7px 16px; font-size: 13px; }
.mk-pricing .aud-cycle button em { margin-left: 6px; color: #1F9D55; font-style: normal; }

/* ── 常见问题:左标题右列表 ── */
.p8-faqsec { padding-block: clamp(64px, 7vw, 96px); }
.p8-faq { display: grid; grid-template-columns: .75fr 1.25fr; gap: 64px; align-items: start; }
.p8-faq .faq { margin-top: 0; }
.p8-faq__aside p { margin: 16px 0 18px; color: var(--text-2); font-size: 15.5px; line-height: 1.7; }

/* ── 导航右上:联系销售(文字)· 登录(描边)· 注册(金色主按钮),登录和注册挨着 ── */
.nav .nav__cta.nav__sales { padding: 0 8px; background: transparent; border-color: transparent; color: var(--text); }
.nav .nav__login.nav__login--pair { padding: 0 16px; border: 1px solid var(--border-2); }

@media (max-width: 860px) {
  .p8-head { flex-direction: column; align-items: flex-start; }
  .p8-head__aside { flex: none; padding-left: 16px; }
  .p8-head__cta { align-items: flex-start; }
  .p8-steps, .p8-quotes, .p8-faq { grid-template-columns: 1fr; }
  .p8-faq { gap: 28px; }
  .p8-quote { padding: 24px 22px; }
  .p8-quote blockquote { font-size: 15.5px; }
}

/* ── 首屏引擎名:左边带 logo 小方块(参考 siftly.ai),切换用渐显不打字 ── */
.hx-eng { display: inline-flex; align-items: center; gap: .2em; margin: 0 .1em; color: var(--accent); vertical-align: .08em; }  /* 抬到和中文字同一条中线(实测) */
.hx-eng__logo {
  display: inline-grid; place-items: center; width: .9em; height: .9em; border-radius: .2em; background: #fff;
  box-shadow: 0 0 0 1px rgba(27,34,48,.1), 0 8px 18px -10px rgba(27,34,48,.45); transform: translateY(-.05em) rotate(-6deg);
}
.hx-eng__logo img { width: .54em; height: .54em; object-fit: contain; }
.hx-eng__name { font-weight: 700; letter-spacing: -.02em; }


/* ── v9 产品区:左文右「画布」(浅底细网格,版式参考 Peec 报告区),截图做成带标题栏的窗口,不叠浮层 ── */
.p7-panel { padding: 0; gap: 0; grid-template-columns: .78fr 1.22fr; align-items: stretch; overflow: hidden; }
.p7-panel__txt { align-self: center; padding: 56px 44px 56px 56px; }
.p9-rule { margin: 22px 0 26px; padding-left: 20px; border-left: 1px solid var(--border-2); }
.p9-rule h3 { margin: 0 0 12px !important; }
.p9-rule p { margin: 0 !important; }
.p9-canvas {
  position: relative; display: flex; align-items: center; padding: 48px 0 48px 44px; border-left: 1px solid var(--border);
  background:
    linear-gradient(rgba(27,34,48,.045) 1px, transparent 1px) 0 0 / 44px 44px,
    linear-gradient(90deg, rgba(27,34,48,.045) 1px, transparent 1px) 0 0 / 44px 44px,
    #F4F1EA;
}
.p9-canvas::before { content: ""; position: absolute; left: 20%; right: -10%; top: 15%; bottom: 10%; background: radial-gradient(closest-side, rgba(229,163,56,.22), transparent); filter: blur(20px); }
.p9-win { position: relative; width: 100%; overflow: hidden; border: 1px solid rgba(27,34,48,.12); border-right: 0; border-radius: 12px 0 0 12px; background: #fff; box-shadow: 0 34px 70px -38px rgba(27,34,48,.5); }
.p9-win__bar { display: flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-bottom: 1px solid #EEE9DF; background: #FBFAF6; }
.p9-win__bar i { width: 9px; height: 9px; border-radius: 50%; background: #E2DCCF; }
.p9-win__bar span { margin-left: 10px; color: #A3A6AE; font-size: 11px; letter-spacing: .02em; }
.p9-win img { display: block; width: 100%; height: auto; }

/* ── v9 新区块:客户正在问 AI 的问题,三排横向滚动,点任意一个去注册(参考 Peec) ── */
.p9-ask { padding-block: clamp(64px, 7vw, 100px); overflow: hidden; }
.p9-hint { margin: 0 0 6px; color: var(--text-2); font-size: 15px; }
.p9-rows { display: grid; gap: 14px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); }
.p9-row { display: flex; gap: 14px; width: max-content; transform: translateX(var(--x)); }
.p9-q {
  display: inline-flex; align-items: center; gap: 10px; height: 54px; padding: 0 20px; border: 1px solid var(--border); border-radius: 14px;
  background: var(--surface); color: var(--text); font-size: 15.5px; white-space: nowrap; box-shadow: 0 8px 20px -14px rgba(27,34,48,.28);
}
.p9-q img { width: 20px; height: 20px; object-fit: contain; }
.p9-q em { display: none; margin-left: 4px; color: #A86C12; font-size: 13.5px; font-style: normal; font-weight: 600; }
.p9-q.is-hover { border-color: #E5A338; box-shadow: 0 0 0 3px rgba(229,163,56,.16), 0 12px 28px -14px rgba(229,163,56,.55); transform: translateY(-2px); }
.p9-q.is-hover em { display: inline; }

/* ── v9 免费开始:三张卡下面直接放官网输入框 ── */
.p9-check { width: min(640px, 100%); margin: 40px auto 0; text-align: center; }
.p9-check__field {
  display: flex; align-items: center; gap: 10px; height: 64px; padding: 0 7px 0 20px; border: 1px solid var(--border-2); border-radius: 16px;
  background: var(--surface); color: var(--text-3); box-shadow: 0 18px 40px -26px rgba(27,34,48,.35);
}
.p9-check__field input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; color: var(--text); font: inherit; font-size: 16px; }
.p9-check__field input::placeholder { color: var(--text-3); }
.p9-check__field .btn { height: 50px; padding-inline: 22px; border-radius: 11px; font-size: 15px; }
.p9-check__note { margin: 12px 0 0; color: var(--text-3); font-size: 13px; }

/* ── v9 客户评价:用各家自己的 logo(原色) ── */
.p8-quote__logo { height: 28px; width: auto; filter: none; }
.p8-quote__logo--bbx { height: 22px; }
.p8-quote__logo--bkj { height: 38px; }
.p8-wm small { display: block; color: var(--text-3); font-family: var(--font-body); font-size: 10.5px; font-weight: 500; letter-spacing: 0; text-align: right; }

@media (max-width: 860px) {
  .p7-panel.is-on { grid-template-columns: 1fr; padding: 0; }
  .p7-panel__txt { padding: 28px 22px 8px; }
  .p9-canvas { padding: 24px 0 24px 20px; border-left: 0; border-top: 1px solid var(--border); }
  .p9-q { height: 46px; font-size: 14px; }
  .p9-check__field { height: 56px; }
}

/* 价格标题下一行小字:把试用和长付折扣说清楚(信息学 GEOly,样式用自家的) */
.p9-lede { margin: 12px 0 0; color: var(--text-2); font-size: 16.5px; line-height: 1.6; }

/* v10:产品区窗口底部渐隐进画布,不要投影;结尾放官网输入框 */
.p9-canvas { align-items: flex-start; padding: 48px 0 0 44px; }
.p9-win { max-height: 480px; box-shadow: none; -webkit-mask-image: linear-gradient(180deg, #000 58%, transparent 100%); mask-image: linear-gradient(180deg, #000 58%, transparent 100%); }
.p9-check--end { margin-top: 30px; }
.p9-check--end .p9-check__note { margin-top: 16px; font-size: 14px; }
@media (max-width: 860px) { .p9-canvas { padding: 24px 0 0 20px; } .p9-win { max-height: 300px; } }

/* 客户评价:一句短话,字号放大、用正文色,卡片不再撑高 */
.p8-quote { gap: 22px; }
.p8-quote blockquote { color: var(--text); font-size: 20px; line-height: 1.6; font-weight: 500; word-break: keep-all; text-wrap: balance; }  /* 只在标点、空格处换行,不把词拆开 */
@media (max-width: 860px) { .p8-quote blockquote { font-size: 17px; } }

/* v11 检测框两种:A = 输入框和按钮分开(参考 siftly);B = 线上原来的长条搜索框(复用 theme.css 的 .hero-check) */
.p10-split { display: flex; justify-content: center; gap: 12px; width: min(620px, 100%); margin: 32px auto 0; }
.p10-split input { flex: 1; min-width: 0; height: 56px; padding: 0 18px; border: 1px solid var(--border-2); border-radius: 12px; background: var(--surface); color: var(--text); font: inherit; font-size: 16px; outline: 0; }
.p10-split input::placeholder { color: var(--text-3); }
.p10-split .btn { height: 56px; padding-inline: 24px; border-radius: 12px; font-size: 15.5px; white-space: nowrap; }
.p10-note { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin: 14px 0 0; color: var(--text-3); font-size: 13px; }
.p10-note .v2-link, .p10-demo { font-size: 13px; }
.hero-check__note .p10-demo { margin-left: 6px; }
.p10-end .hero-check { margin-top: 30px; }
.p10-end .p10-split { margin-top: 30px; }
@media (max-width: 860px) { .p10-split { flex-direction: column; } .p10-split .btn { width: 100%; justify-content: center; } }

/* v12 首屏标题两行:行距放宽一点 */
.v2-hero__h1 { line-height: 1.18; }

/* v12 客户评价:四张卡等高;两句话的引语用常规字重、正文灰,正常换行 */
.p8-quotes { grid-auto-rows: 1fr; }
.p8-quote blockquote { color: var(--text-2); font-size: 17px; line-height: 1.8; font-weight: 400; word-break: normal; line-break: strict; text-wrap: pretty; }

/* v13 结尾 + 页脚连成一块(版式参考 siftly 结尾:两行大标题 + 两个按钮;浅色底、我们自己的细网格和金色) */
.p11-end { position: relative; overflow: hidden; background: var(--bg-2); border-top: 1px solid var(--border); }
.p11-end::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size: 56px 56px; background-position: center top;
  mask-image: radial-gradient(ellipse 62% 78% at 50% 46%, #000 18%, transparent 78%);
}
.p11-end::after {
  content: ""; position: absolute; left: 50%; top: 46%; width: 820px; height: 380px; transform: translate(-50%, -50%); pointer-events: none;
  background: radial-gradient(closest-side, rgba(229, 163, 56, .17), transparent);
}
.p11-end__in { position: relative; z-index: 1; padding: 144px 0 136px; text-align: center; }
.p11-end__h { margin: 0; color: var(--text); font-family: var(--font-display); font-weight: 700; font-size: clamp(36px, 4.5vw, 64px); line-height: 1.14; letter-spacing: -.03em; word-break: keep-all; }
.p11-end__h em { color: var(--accent); font-style: normal; }
.p11-end__ctas { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 44px; }
.p11-end__ctas .btn { height: 52px; padding-inline: 28px; font-size: 15.5px; }
.p11-end__ghost { background: var(--surface); }
@media (max-width: 860px) {
  .p11-end__in { padding: 96px 0 88px; }
  .p11-end__ctas { flex-direction: column; align-items: stretch; width: min(360px, 100%); margin-inline: auto; }
  .p11-end__ctas .btn { justify-content: center; }
}

/* 页脚接在结尾下面:同一块底色、不要分隔线;四列(洞察和公司叠在一列),社交图标挪到底栏右边,版权一行用等宽字 */
.footer { border-top: 0; padding-top: 24px; }
.footer__cols--4 { grid-template-columns: repeat(4, 1fr); }
.footer__cols .footer__col-title--2 { margin-top: 30px; }
.footer__base { align-items: center; }
.footer__base p { display: flex; align-items: center; gap: 10px; margin: 0; }
.footer__mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 11.5px; letter-spacing: .14em; }
.footer__legal .footer__socials { display: flex; gap: 2px; margin: 0 0 0 12px; }
.footer__legal .footer__socials a { width: 30px; height: 30px; border: 0; background: none; color: var(--text-3); }
.footer__legal .footer__socials a:hover { background: none; color: var(--text); transform: none; }
@media (max-width: 880px) { .footer__cols--4 { grid-template-columns: repeat(2, 1fr); } }

/* v13 面板小标题折行均衡(英文版会折三行,避免最后一行只剩一个词) */
.p9-rule h3 { text-wrap: balance; }
/* v13 首屏副标题折行均衡(英文版两行长短接近) */
.v2-hero__sub { text-wrap: balance; }

/* v13.3 首屏 h1 里的品类眉题(SEO 标准第六节 A:h1 要带品类词)+ 搜索框下的可摘录断言(第一节) */
.v2-hero__kicker { display: flex; justify-content: center; margin: 0 0 20px; line-height: 1.4; }
.v2-hero__claim { max-width: 780px; margin: 22px auto 0; color: var(--text-3); font-size: 13.5px; line-height: 1.7; text-wrap: balance; }

/* v13.4 客户评价三张卡排一行(手机仍是一列,见上面 860px 断点) */
/* v14.2 客户评价一行两张(2×2) */

/* v14 BT教育 logo(官网 btclass.cn 的图标去掉 12 周年角标,改成品牌蓝) */
.p8-quote__logo--bt { height: 30px; width: auto; }

/* v14 适合谁:两张卡没有落地页先不放箭头;卡片底部垫一块真实看板界面,往下渐隐 */
.p13-aud { position: relative; overflow: hidden; min-height: 420px; cursor: default; }
.p13-aud:hover { transform: none; }
.p13-aud > :not(.p13-aud__ui) { position: relative; z-index: 1; }
.p13-aud__ui { position: absolute; left: 32px; right: -48px; bottom: -64px; height: 250px; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--surface);
  box-shadow: 0 20px 44px -28px rgba(27, 34, 48, .3); -webkit-mask-image: linear-gradient(180deg, #000 35%, transparent 92%); mask-image: linear-gradient(180deg, #000 35%, transparent 92%); }
.p13-aud__ui img { display: block; width: 100%; height: auto; }
@media (max-width: 860px) { .p13-aud { min-height: 360px; } .p13-aud__ui { left: 20px; height: 190px; } }
/* v14.1 适合谁:界面图往上提,和标签之间不留大空白 */
.p13-aud__ui { height: 300px; }
@media (max-width: 860px) { .p13-aud__ui { height: 220px; } }
.v2-hero__sub { max-width: 920px; }
/* v14.3 手机上副标题字小一号,中英都压在两行 */
@media (max-width: 860px) { .v2-hero__sub { font-size: 14px; line-height: 1.6; } }

/* v15 首屏眉题:白色气泡(参考 Peec「We are hiring」),写在 h1 里 */
.v2-hero__kicker {
  display: flex; width: fit-content; align-items: center; gap: 9px; margin: 0 auto 26px; padding: 7px 16px 7px 14px;
  border: 1px solid var(--border); border-radius: 999px; background: var(--surface);
  box-shadow: 0 1px 2px rgba(27, 34, 48, .05), 0 10px 24px -16px rgba(27, 34, 48, .4);
  color: var(--text); font: 500 15px/1.35 var(--font-sans); letter-spacing: 0; text-transform: none;
}
.v2-hero__kicker::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px rgba(229, 163, 56, .18); }
@media (max-width: 860px) { .v2-hero__kicker { margin-bottom: 20px; padding: 6px 13px 6px 12px; font-size: 13.5px; } }

/* v15 AI 引擎与合作伙伴(参考 Peec「Trusted by 3500+ brands and agencies」):
   两色一句说明 → 细竖线 → 横线上的气泡标签 → 3×3 logo 加名字;logo 不装方框 */
.p12-trust { position: relative; padding: 72px 0 64px; border-top: 1px solid var(--border); background: radial-gradient(48% 70% at 50% 0%, rgba(229, 163, 56, .09), transparent 72%), var(--bg); }
.p12-trust__cap { margin: 0; text-align: center; color: var(--text); font: 500 clamp(17px, 1.55vw, 22px)/1.45 var(--font-sans); letter-spacing: -.005em; }
.p12-trust__cap span { color: var(--text-3); }
.p12-trust__top::after { content: ""; display: block; width: 1px; height: 52px; margin: 18px auto 0; background: var(--border-2); }
.p12-trust__band { position: relative; display: flex; justify-content: center; }
.p12-trust__band::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: var(--border); }
.p12-pill { position: relative; z-index: 1; padding: 8px 18px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); box-shadow: 0 1px 2px rgba(27, 34, 48, .05), 0 10px 22px -16px rgba(27, 34, 48, .4); color: var(--text-2); font: 500 15px/1.3 var(--font-sans); }
.p12-trust__grid { list-style: none; display: grid; gap: 34px 24px; max-width: 980px; margin: 44px auto 52px; padding: 0; }
.p12-trust__grid li { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 0; color: var(--text); font: 600 19px/1.2 var(--font-display); letter-spacing: -.01em; white-space: nowrap; }
.p12-trust__grid--eng { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.p12-trust__grid--eng img { width: 28px; height: 28px; object-fit: contain; }
.p12-trust__grid--partner { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 640px; margin-bottom: 0; }
.p12-trust__grid--partner li { flex-direction: column; gap: 10px; }
.p12-trust__grid--partner small { color: var(--text-3); font: 500 13.5px/1.3 var(--font-sans); letter-spacing: 0; }
.p12-oa { display: inline-flex; align-items: center; gap: 9px; height: 30px; font: 600 24px/1 var(--font-sans); letter-spacing: -.02em; }
.p12-oa img { width: 28px; height: 28px; }
.p12-aw { height: 22px; width: auto; margin: 4px 0; }
@media (max-width: 860px) {
  .p12-trust { padding: 52px 0 44px; }
  .p12-trust__top::after { height: 36px; margin-top: 14px; }
  .p12-trust__grid { gap: 26px 10px; margin: 30px auto 36px; }
  .p12-trust__grid li { flex-direction: column; gap: 8px; font-size: 13.5px; white-space: normal; text-align: center; }
  .p12-trust__grid--eng img { width: 26px; height: 26px; }
  .p12-oa { font-size: 19px; height: 26px; } .p12-oa img { width: 22px; height: 22px; }
  .p12-aw { height: 17px; }
}

/* v15 适合谁:界面图跟着内容往下排(不再绝对定位),窄屏标签换行也不会被压住 */
.p13-aud { min-height: 0; }
.p13-aud .nh-aud__chips { margin-bottom: 12px; }
.p13-aud__ui { position: relative; left: auto; right: auto; bottom: auto; flex: none; height: 290px; margin: auto -32px -32px 0; }
@media (max-width: 860px) { .p13-aud__ui { height: 210px; } }

/* ═══ v16(2026-10-28 用户第 16 轮)═══ */

/* 首屏眉题:浅灰气泡、字小一号(不再白底投影) */
.v2-hero__kicker {
  gap: 8px; margin-bottom: 24px; padding: 5px 13px 5px 11px; border-color: color-mix(in oklab, var(--text) 8%, transparent);
  background: color-mix(in oklab, var(--text) 4.5%, var(--bg)); box-shadow: none; color: var(--text-2); font-size: 13px;
}
.v2-hero__kicker::before { width: 7px; height: 7px; box-shadow: 0 0 0 3px rgba(229, 163, 56, .16); }
@media (max-width: 860px) { .v2-hero__kicker { margin-bottom: 18px; padding: 4px 11px 4px 10px; font-size: 12px; } }

/* 首屏 / 结尾标题:手机上固定两行 —— 第一行「看清 + 引擎」不折行,第二行「会不会推荐你」;
   字号按最长的引擎名(AI Overviews)算,9 个引擎轮换时都不会掉成三行 */
.hx-l1 { white-space: nowrap; }
@media (max-width: 860px) {
  .hx-l2 { display: block; }
  .v2-hero__h1, .p11-end__h { font-size: min(34px, calc((100vw - 40px) / var(--hx-em, 10.6)));  /* 手机 h1 左右各留 20px */ }
  :root[data-lang="en"] .v2-hero__h1, :root[data-lang="en"] .p11-end__h, [data-lang-root="en"] .v2-hero__h1, [data-lang-root="en"] .p11-end__h { --hx-em: 11.2; }
}

/* ── 首屏看板:HTML 重画示例看板(交互在 home.js),底部渐隐进页面,中间浮一个监测问题输入框(参考 Peec / Geoly) ── */
.hb { overflow: visible; border: 0; border-radius: 0; box-shadow: none; }
.hb::before { content: ""; position: absolute; z-index: -1; left: 8%; right: 8%; top: -60px; height: 320px; background: radial-gradient(closest-side, rgba(229, 163, 56, .2), transparent); pointer-events: none; }
.hb-frame {
  position: relative; overflow: hidden; border: 1px solid color-mix(in oklab, var(--text) 14%, transparent); border-bottom: 0; border-radius: 16px 16px 0 0; background: #FAF8F2;
  -webkit-mask-image: linear-gradient(180deg, #000 56%, transparent 97%); mask-image: linear-gradient(180deg, #000 56%, transparent 97%);
}
.hb-board { display: grid; grid-template-columns: 228px minmax(0, 1fr); width: 1238px; height: 700px; zoom: var(--hb-s, 1); color: #1B2230; font-family: var(--font-sans); font-size: 13px; line-height: 1.4; text-align: left; }
.hb-board p { margin: 0; }
.hb-i { flex: none; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.hb-i--s { width: 12px; height: 12px; opacity: .55; }
.hb-i--r { margin-left: auto; width: 13px; height: 13px; opacity: .6; }
.hb-logo { flex: none; width: 22px; height: 22px; }
/* 侧栏 */
.hb-side { display: flex; flex-direction: column; gap: 1px; padding: 14px 12px 14px; border-right: 1px solid #E5E0D5; background: #F4F2EC; }
.hb-proj { display: flex; align-items: center; gap: 9px; height: 40px; margin: 0 0 6px; padding: 0 8px 10px; border-bottom: 1px solid #E5E0D5; }
.hb-proj b { flex: 1; font: 700 14px/1 var(--font-display); }
.hb-proj .hb-i { width: 13px; height: 13px; opacity: .5; }
.hb-sh { margin: 12px 0 5px 10px !important; color: #A3A6AE; font: 600 10.5px/1.4 var(--font-display); letter-spacing: .14em; text-transform: uppercase; }
.hb-nav { display: flex; align-items: center; gap: 10px; height: 33px; padding: 0 10px; border-radius: 9px; }
.hb-nav b { font-weight: 600; font-size: 13.5px; }
.hb-nav.is-open { background: rgba(27, 34, 48, .04); }
.hb-sub { display: block; height: 30px; padding: 0 10px 0 36px; border-radius: 8px; color: #5A6173; font-size: 13px; line-height: 30px; }
.hb-sub.is-on { background: rgba(229, 163, 56, .14); color: #C77F12; font-weight: 600; }
.hb-me { display: flex; align-items: center; gap: 9px; margin-top: auto; padding: 12px 8px 0; border-top: 1px solid #E5E0D5; font-size: 12.5px; }
.hb-me i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #FBE7C6; color: #C77F12; font: 600 11px/1 var(--font-sans); font-style: normal; }
/* 主区 */
.hb-main { min-width: 0; padding: 12px 22px 0; }
.hb-top { display: flex; align-items: center; gap: 10px; height: 28px; font-size: 14px; }
.hb-top .hb-i { color: #A3A6AE; }
.hb-filters { display: flex; gap: 8px; margin-top: 8px; padding-bottom: 13px; border-bottom: 1px solid #E8E3D8; }
.hb-filters span { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 10px; border: 1px solid #DDD6C8; border-radius: 8px; background: #fff; font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.hb-filters .hb-i:first-child { width: 14px; height: 14px; color: #5A6173; }
.hb-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-top: 13px; }
.hb-kpi { min-width: 0; padding: 12px 12px 11px; border: 1px solid #E8E2D6; border-radius: 14px; background: #fff; transition: border-color .2s, transform .2s; }
.hb-kpi:hover { border-color: color-mix(in oklab, #E5A338 45%, #E8E2D6); transform: translateY(-1px); }
.hb-kpi__t { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: 12.5px; font-weight: 600; }
.hb-kpi__t span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-decoration: underline dotted #C8C0AE; text-underline-offset: 3px; }
.hb-kpi__n { margin: 6px 0 6px !important; font: 800 27px/1.05 var(--font-display); letter-spacing: -.03em; }
.hb-kpi__n small { margin-left: 2px; color: #A3A6AE; font: 600 12px var(--font-sans); }
.hb-delta { display: inline-block; padding: 2px 8px; border-radius: 6px; font-size: 11px; font-weight: 600; white-space: nowrap; }
.hb-delta--up, .hb-delta--good { background: #E3F6EE; color: #1F9D6B; }
.hb-delta--down { background: #FDE8E8; color: #D64545; }
.hb-spark { display: block; width: 100%; height: 26px; margin: 8px 0 3px; overflow: visible; }
.hb-spark__l { fill: none; stroke: #E5A338; stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.hb-spark__a { fill: rgba(229, 163, 56, .12); }
.hb-kpi__f { overflow: hidden; color: #A3A6AE; font-size: 10px; white-space: nowrap; text-overflow: ellipsis; }
.hb-card { margin-top: 12px; padding: 15px 20px 14px; border: 1px solid #E8E2D6; border-radius: 14px; background: #fff; }
.hb-card__t { font: 700 16px/1.3 var(--font-display); text-decoration: underline dotted #C8C0AE; text-underline-offset: 4px; }
.hb-card__d { margin-top: 3px !important; color: #A3A6AE; font-size: 12px; }
.hb-card__body { display: grid; grid-template-columns: 1.22fr 1fr; gap: 30px; margin-top: 10px; }
/* 图表 */
.hb-chart { position: relative; min-width: 0; }
.hb-chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.hb-grid line { stroke: rgba(27, 34, 48, .07); }
.hb-axis text { fill: #8A8F9A; font: 10px var(--font-sans); }
.hb-line { fill: none; stroke-width: 1.4; stroke-dasharray: 4 3; opacity: .6; transition: opacity .35s ease, stroke-width .35s ease; }
.hb-line--me { stroke-width: 2.4; stroke-dasharray: none; opacity: 1; }
.hb-chart.is-focus .hb-line:not(.hb-line--me) { opacity: .13; }
.hb-chart.is-focus .hb-line.is-hl { opacity: 1; stroke-width: 2.1; stroke-dasharray: none; }
.hb-cross[hidden], .hb-tip[hidden] { display: none; }  /* SVG 元素不认 hidden 属性,要自己藏 */
.hb-cross__l { stroke: rgba(27, 34, 48, .28); stroke-dasharray: 3 3; }
.hb-cross circle { stroke: #fff; stroke-width: 1.6; }
.hb-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 3px 14px; margin-top: 2px; color: #5A6173; font-size: 11px; }
.hb-legend span { display: inline-flex; align-items: center; gap: 5px; transition: opacity .3s; }
.hb-legend i { width: 14px; height: 2px; border-radius: 2px; background: var(--c); }
.hb-tip { position: absolute; z-index: 3; top: 0; min-width: 156px; padding: 9px 11px 8px; border-radius: 10px; background: #1B2230; color: #fff; font-size: 11.5px; line-height: 1.5; box-shadow: 0 14px 30px -12px rgba(27, 34, 48, .55); pointer-events: none; }
.hb-tip b { display: block; margin-bottom: 4px; font-weight: 600; }
.hb-tip span { display: flex; align-items: center; gap: 7px; color: rgba(255, 255, 255, .78); }
.hb-tip span.is-me { color: #fff; font-weight: 600; }
.hb-tip span i { width: 8px; height: 8px; border-radius: 2px; background: var(--c); }
.hb-tip span em { margin-left: auto; padding-left: 12px; font-style: normal; }
/* 排名 */
.hb-rank { position: relative; min-width: 0; }
.hb-eyebrow { color: #A3A6AE; font: 600 10.5px/1.4 var(--font-display); letter-spacing: .14em; text-transform: uppercase; }
.hb-rank__no { margin: 3px 0 6px !important; font: 800 26px/1 var(--font-display); letter-spacing: -.03em; }
.hb-rank ol { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }
.hb-row { display: grid; grid-template-columns: 20px minmax(0, 1fr) 44px; align-items: center; gap: 8px; height: 34px; margin: 0; cursor: default; }
.hb-row__n { color: #A3A6AE; font: 700 12px var(--font-display); text-align: center; }
.hb-row.is-me .hb-row__n { color: #C77F12; }
.hb-row__bar { position: relative; display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 4px; }
.hb-row__bar::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: var(--w); border-radius: 999px; background: var(--tint); transition: background .3s ease, box-shadow .3s ease; }
.hb-row__bar > * { position: relative; }
.hb-row__bar b { font-weight: 600; font-size: 13px; }
.hb-row__v { font-weight: 600; text-align: right; }
.hb-row.is-hl .hb-row__bar::before { background: color-mix(in oklab, var(--c) 20%, #fff); box-shadow: inset 0 0 0 1.5px var(--c); }
.hb-rtip {
  position: absolute; z-index: 2; left: 34px; top: calc(50px + var(--row, 1) * 39px + 39px); margin: 0 !important; padding: 6px 10px; border-radius: 8px;
  background: #1B2230; color: #fff; font-size: 11.5px; font-weight: 500; white-space: nowrap; box-shadow: 0 12px 26px -12px rgba(27, 34, 48, .6);
  pointer-events: none; transition: top .4s cubic-bezier(.22, .8, .24, 1), opacity .25s ease;  /* 压在下一行上,不挡鼠标 */
}
.hb-rtip::before { content: ""; position: absolute; left: 18px; top: -4px; width: 8px; height: 8px; background: inherit; transform: rotate(45deg); }
.hb-rtip.is-off { opacity: 0; }
.hb-btn { display: inline-block; float: right; margin-top: 10px; padding: 4px 12px; border: 1px solid #DDD6C8; border-radius: 8px; color: #5A6173; font-size: 11.5px; }
/* 监测问题输入框:浮在看板渐隐处 */
.hb-prompt {
  position: absolute; z-index: 3; left: 50%; bottom: 20px; width: min(640px, calc(100% - 48px)); transform: translateX(-50%); padding: 16px 14px 13px 18px;
  border: 1px solid #E5E0D5; border-radius: 18px; background: #fff; color: #1B2230; text-align: left;
  box-shadow: 0 2px 4px rgba(27, 34, 48, .04), 0 28px 60px -26px rgba(27, 34, 48, .38);
}
.hb-prompt__q { display: flex; align-items: center; gap: 10px; min-height: 26px; margin: 0; font-size: 16px; line-height: 1.45; }
.hb-prompt__q .hb-i { width: 18px; height: 18px; color: #A3A6AE; }
.hb-prompt__text { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.hb-prompt__text::after { content: ""; display: inline-block; width: 1.5px; height: 1.1em; margin-left: 3px; vertical-align: -.18em; background: #E5A338; animation: hb-blink 1s steps(1) infinite; }  /* 光标跟在最后一个字后面 */
.hb-prompt__text:empty::before { content: attr(data-ph); color: #A3A6AE; }
.hb-prompt.is-added .hb-prompt__text { color: #1F9D6B; font-weight: 600; }
.hb-prompt.is-added .hb-prompt__text::after { visibility: hidden; }
@keyframes hb-blink { 50% { opacity: 0; } }
.hb-prompt__row { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.hb-chip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border: 1px solid #E5E0D5; border-radius: 9px; color: #5A6173; font-size: 12.5px; font-weight: 500; white-space: nowrap; transition: opacity .25s ease; }
.hb-chip img, .hb-chip .hb-i { width: 15px; height: 15px; object-fit: contain; }
.hb-send { display: grid; place-items: center; width: 34px; height: 34px; margin-left: auto; border-radius: 10px; background: #1B2230; color: #fff; transition: transform .2s ease, background .2s ease; }
.hb-send .hb-i { width: 16px; height: 16px; stroke-width: 1.8; }
.hb-prompt.is-sent .hb-send { transform: scale(.88); background: #E5A338; }
@media (max-width: 860px) {
  .hb::before { top: -30px; height: 200px; }
  .hb-frame { border-radius: 10px 10px 0 0; -webkit-mask-image: linear-gradient(180deg, #000 62%, transparent 100%); mask-image: linear-gradient(180deg, #000 62%, transparent 100%); }
  .hb-prompt { position: relative; left: auto; bottom: auto; width: auto; margin: -40px 10px 0; padding: 12px 10px 10px 13px; border-radius: 14px; transform: none; }
  .hb-prompt__q { gap: 8px; font-size: 14px; }
  .hb-prompt__q .hb-i { width: 16px; height: 16px; }
  /* 英文问题长:手机上折成两行、预留两行高度(打字时不把下面的内容顶来顶去) */
  :root[data-lang="en"] .hb-prompt__q, [data-lang-root="en"] .hb-prompt__q { align-items: flex-start; min-height: 2.9em; }
  :root[data-lang="en"] .hb-prompt__q .hb-i, [data-lang-root="en"] .hb-prompt__q .hb-i { margin-top: .2em; }
  :root[data-lang="en"] .hb-prompt__text, [data-lang-root="en"] .hb-prompt__text { white-space: normal; }
  .hb-prompt__row { margin-top: 10px; gap: 6px; }
  .hb-chip { height: 26px; padding: 0 9px; font-size: 11.5px; }
  .hb-send { width: 30px; height: 30px; border-radius: 9px; }
}

/* ── AI 引擎与合作伙伴(参考 Peec 桌面版「Brands / Agencies」):一句说明 → 细竖线落到横线上 →
   左右两栏各一个小标签骑在横线上,中间竖线分栏;手机上两栏上下叠,标签各骑一条横线 ── */
.p12-trust { padding: 34px 0 0; border-top: 0; background: none; }
.p12-trust__cap { margin: 0; color: var(--text); font: 500 15px/1.5 var(--font-sans); text-align: center; }
.p12-trust__cap span { color: var(--text-3); }
.p12-trust__cap::after { content: ""; display: block; width: 1px; height: 40px; margin: 14px auto 0; background: var(--border-2); }
.p12-trust__cols { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.p12-trust__col { position: relative; display: flex; align-items: center; justify-content: center; padding: 50px 24px 42px; }
.p12-trust__col + .p12-trust__col { border-left: 1px solid var(--border); }
.p12-pill { position: absolute; top: 0; left: 50%; padding: 4px 12px; border-radius: 8px; color: var(--text-2); font-size: 13px; transform: translate(-50%, -50%); }
.p12-trust__grid { margin: 0; gap: 24px 40px; max-width: none; }
.p12-trust__grid li { gap: 10px; font-size: 16px; }
.p12-trust__grid--eng { grid-template-columns: repeat(3, auto); justify-content: center; }
.p12-trust__grid--eng img { width: 22px; height: 22px; }
.p12-trust__grid--partner { grid-template-columns: repeat(2, auto); justify-content: center; gap: 24px 72px; }
.p12-trust__grid--partner small { font-size: 12.5px; }
.p12-oa { height: 28px; font-size: 22px; }
.p12-oa img { width: 25px; height: 25px; }
.p12-aw { height: 21px; }
@media (max-width: 860px) {
  .p12-trust { padding-top: 26px; }
  .p12-trust__cap { font-size: 14px; }
  .p12-trust__cap::after { height: 32px; margin-top: 12px; }
  .p12-trust__cols { grid-template-columns: 1fr; margin-inline: calc(-1 * var(--gutter)); border-bottom: 0; }
  .p12-trust__col { padding: 38px var(--gutter) 32px; }
  .p12-trust__col + .p12-trust__col { border-left: 0; border-top: 1px solid var(--border); }
  .p12-trust__grid--eng { grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; gap: 22px 8px; }
  .p12-trust__grid li { flex-direction: column; justify-content: flex-start; gap: 8px; font-size: 13px; white-space: normal; text-align: center; }  /* 名字折两行时 logo 仍顶部对齐 */
  .p12-trust__grid--partner { gap: 20px 40px; }
  .p12-oa { height: 24px; font-size: 18px; } .p12-oa img { width: 21px; height: 21px; }
  .p12-aw { height: 16px; }
}

/* ── 产品区:五张卡同一尺寸(叠在同一格里,高度取最高的那张),桌面按黄金比例 1.618:1;
   截图窗口贴左上、右侧出血、底部渐隐;滚动时整扇窗口(连标题栏和边框)一起放大,不再只放大窗口里的图 ── */
.p7-panels { display: grid; }
.p7-panel { grid-area: 1 / 1; display: grid; width: 100%; visibility: hidden; }
.p7-panel.is-on { visibility: visible; }
@media (min-width: 861px) {
  .p7-panel { grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); aspect-ratio: 1.618; max-height: calc(100vh - 176px); }  /* 列宽写死,标题长短不再把左栏撑宽 */
  .p7-panel__txt { padding: 56px 44px 56px 56px; }
  .p9-canvas { padding: 52px 0 0 48px; }
  .p9-win { max-height: none; transform-origin: 0 0; -webkit-mask-image: linear-gradient(180deg, #000 66%, transparent 100%); mask-image: linear-gradient(180deg, #000 66%, transparent 100%); }
}
@media (max-width: 860px) {
  .p7-panel, .p7-panel.is-on { grid-template-columns: 1fr; grid-template-rows: auto 1fr; padding: 0; }
  .p9-win { max-height: 320px; }
}

/* ── 真实提问:问题卡片小一号 ── */
.p9-rows { gap: 12px; }
.p9-row { --gap: 12px; gap: var(--gap); }
.p9-q { gap: 8px; height: 44px; padding: 0 16px; border-radius: 12px; font-size: 14px; }
.p9-q img { width: 18px; height: 18px; }
.p9-q em { font-size: 12.5px; }
@media (max-width: 860px) { .p9-rows { gap: 10px; } .p9-row { --gap: 10px; } .p9-q { height: 38px; padding: 0 13px; font-size: 13px; } .p9-q img { width: 16px; height: 16px; } }

/* ── 适合谁:标签气泡小一号 ── */
.nh-aud__chips { gap: 6px; }
.nh-aud__chips span { padding: 3px 10px; border-color: var(--border); font-size: 12px; }
@media (max-width: 860px) { .nh-aud__chips span { font-size: 11.5px; } }

/* ── 客户评价:正文小一号 ── */
.p8-quote blockquote { font-size: 15px; line-height: 1.75; }
@media (max-width: 860px) { .p8-quotes { grid-auto-rows: auto; } .p8-quote blockquote { font-size: 14px; } }  /* 手机一列,卡片按各自内容高 */

/* ── 常见问题:左栏说明句本身就是链接(带箭头),不再重复「联系销售」 ── */
.p8-faq__ask { display: inline-flex; align-items: center; gap: 6px; margin-top: 16px; color: var(--text-2); font-size: 15.5px; text-decoration: none; transition: color .2s ease; }
.p8-faq__ask span { transition: transform .2s ease; }
.p8-faq__ask:hover { color: var(--accent); }
.p8-faq__ask:hover span { transform: translateX(3px); }

/* ═══ v17(2026-10-28 第 17 轮)═══ */

/* 首屏监测问题输入框:阴影换成暖色(页面是暖白底,灰黑投影发脏、显得突兀) */
.hb-prompt { border-color: #EAE3D4; box-shadow: 0 1px 2px rgba(112, 84, 36, .05), 0 26px 56px -26px rgba(176, 128, 48, .42); }

/* 产品区:窗口以右上角为原点放大 —— 右边贴着卡片边不动,往左边留白和下面长,截图最右一列不会被卡片边裁掉 */
@media (min-width: 861px) { .p9-win { transform-origin: 100% 0; } }

/* AI 引擎与合作伙伴再收一收(用户:再简洁一些):桌面左栏改成两行 —— 海外 5 个一行、中文 4 个一行(Peec 也是两行),
   logo 18px、名字 14px;合作伙伴字标小一号;上下留白收紧。手机仍是 3×3 */
.p12-trust { padding-top: 28px; }
.p12-trust__cap { font-size: 14px; }
.p12-trust__cap::after { height: 28px; margin-top: 12px; }
.p12-trust__col { padding: 34px 16px 28px; }
.p12-pill { padding: 3px 10px; border-radius: 7px; font-size: 12px; }
.p12-trust__grid--eng { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px 16px; }  /* 第一行 5 个在 1440 宽屏上约 508px,左栏内宽 532px */
.p12-trust__grid--eng .p12-br { flex-basis: 100%; height: 0; margin: -9px 0; }
.p12-trust__grid li { gap: 7px; font-size: 13.5px; }
.p12-trust__grid--eng img { width: 18px; height: 18px; }
.p12-trust__grid--partner { gap: 16px 56px; }
.p12-trust__grid--partner li { gap: 6px; }
.p12-trust__grid--partner small { font-size: 11.5px; }
.p12-oa { gap: 7px; height: 22px; font-size: 18px; }
.p12-oa img { width: 20px; height: 20px; }
.p12-aw { height: 16px; margin: 3px 0; }
@media (max-width: 860px) {
  .p12-trust__grid--eng { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 8px; }
  .p12-trust__grid--eng .p12-br { display: none; }
  .p12-trust__grid li { font-size: 12.5px; }
  .p12-trust__grid--eng img { width: 22px; height: 22px; }
  .p12-oa { height: 22px; font-size: 17px; } .p12-oa img { width: 19px; height: 19px; }
  .p12-aw { height: 15px; }
}
/* 窄一些的桌面(861–1199px)左栏放不下一行 5 个:引擎改回 3×3,不让 Perplexity 单独掉一行 */
@media (min-width: 861px) and (max-width: 1199px) {
  .p12-trust__grid--eng { display: grid; grid-template-columns: repeat(3, auto); justify-content: center; gap: 16px 22px; }
  .p12-trust__grid--eng .p12-br { display: none; }
  .p12-trust__grid--eng li { justify-content: flex-start; }
}
/* 首屏看板项目名用回「NovaPay 可见性监测」后,侧栏一行放不下 14px:小一号、不折行(放不下时省略号) */
.hb-proj b { overflow: hidden; font-size: 13px; white-space: nowrap; text-overflow: ellipsis; }

/* ═══ v17b(同日第 18 轮)═══ */

/* AI 引擎与合作伙伴再低调一些(用户:太扎眼):logo 灰度、半透明,名字正文灰、常规字重,鼠标停上去才恢复原色;小标签不用白底和投影 */
.p12-pill { border-color: var(--border); background: var(--bg); box-shadow: none; color: var(--text-3); }
.p12-trust__grid li, .p12-oa { color: var(--text-2); font-weight: 500; transition: color .2s ease; }
.p12-trust__grid img, .p12-aw { filter: grayscale(1); opacity: .55; transition: filter .25s ease, opacity .25s ease; }
.p12-trust__grid li:hover, .p12-trust__grid li:hover .p12-oa { color: var(--text); }
.p12-trust__grid li:hover img, .p12-trust__grid li:hover .p12-aw { filter: none; opacity: 1; }

/* 产品区:窗口一律以右上角为原点放大(手机也一样) */
.p9-win { transform-origin: 100% 0; }

/* 产品区手机版也钉住、往下滑换卡片(用户:手机没有停在这里):标签条和面板钉在导航下面,面板高度按屏幕算,
   截图在面板里往下渐隐 */
@media (max-width: 860px) {
  .p7-track { position: relative; }
  .p7-stick { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 68px); }
  .p7-tabs { margin-bottom: 12px; }
  .p7-panel, .p7-panel.is-on { height: calc(100svh - 68px - 54px - 16px); grid-template-rows: auto minmax(0, 1fr); }
  .p7-panel__txt { padding: 22px 20px 12px; }
  .p9-rule { margin: 14px 0 0; }
  .p9-canvas { overflow: hidden; padding-top: 18px; }
  .p9-win { max-height: none; }
}

/* 适合谁:两张卡的标题桌面一行 */
@media (min-width: 861px) { .p13-aud h3 { white-space: nowrap; } }

/* 首屏 / 结尾标题里的引擎名用标题同色(深色),不用金色:页面上的金色只留给下面的主按钮「开始免费诊断」,标题不和它抢 */
.hx-eng { color: var(--text); }

/* 真实提问:悬停时卡片上浮 2px、外圈发光,第一排的上沿和最后一排的投影会超出 .p9-rows(它带左右渐隐的遮罩,
   遮罩外的部分直接被切掉)。上下各留出空间、再用负外边距抵回去,版面不变 */
.p9-rows { padding: 14px 0 26px; margin: -14px 0 -26px; }

/* 首屏 / 结尾标题不再轮换引擎名(用户:不写具体模型名,统一说 AI):手机上仍是两行(「看清 AI / 会不会推荐你」
   「Find out if AI / recommends you」),字号回到 34px,不再按最长引擎名缩 */
@media (max-width: 860px) { .v2-hero__h1, .p11-end__h { font-size: 34px; } }

/* 常见问题左栏的链接:和其它文字链接一个样式 —— 正文色、半粗、下划线、带箭头 */
.p8-faq__ask.v2-link { gap: 6px; padding-bottom: 3px; border-bottom: 1px solid currentColor; color: var(--text); font-size: 15px; font-weight: 600; }
.p8-faq__ask.v2-link:hover { color: var(--accent); }

/* ═══ v19(10-28)首屏重心放到检测按钮上 ═══ */

/* 标题(首屏和结尾同一句)颜色再收一点:深灰,不和主按钮抢;「AI」左边的 logo 小方块保留轮换,文字始终是 AI */
.v2-hero__h1, .p11-end__h { color: color-mix(in oklab, var(--text) 78%, var(--bg)); }
.hx-eng { color: inherit; }

/* 看板离检测框远一些(参考 GEOly 首屏的间距),不挤 */
.v2-hero .hb { margin-top: 96px; }
@media (max-width: 860px) { .v2-hero .hb { margin-top: 56px; } }

/* 首屏主按钮:一段光沿按钮边缘顺时针转(做法参考 Magic UI 的 Border Beam),视觉重心留在这里 */
@property --hb-beam { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.hero-check__btn::after {
  content: ""; position: absolute; inset: 0; padding: 2px; border-radius: inherit; pointer-events: none;
  background: conic-gradient(from var(--hb-beam), transparent 0deg 240deg, rgba(255, 233, 186, .55) 300deg, #fff 350deg, transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude;
  filter: drop-shadow(0 0 4px rgba(255, 214, 140, .95));
  animation: hb-beam 3s linear infinite;
}
@keyframes hb-beam { to { --hb-beam: 360deg; } }
@media (prefers-reduced-motion: reduce) { .hero-check__btn::after { animation: none; } }

/* 首屏监测问题输入框:打出来的问题用正文灰,不用纯黑 */
.hb-prompt__q { color: #5A6173; }

/* 光线再显眼一些(用户:就是这个意思,但不够显眼):光带加粗到 3px、拖尾更长更亮;按钮外面再跟一圈同步转的金色光晕
   (模糊的圆锥渐变),白色输入框底上也看得见;2.6 秒一圈 */
.hero-check__btn { isolation: isolate; box-shadow: 0 8px 22px -10px rgba(229, 163, 56, .75); }
.hero-check__btn::after {
  inset: -1px; padding: 3px;
  background: conic-gradient(from var(--hb-beam), transparent 0deg 190deg, rgba(255, 236, 196, .35) 250deg, rgba(255, 246, 225, .95) 325deg, #fff 352deg, transparent 360deg);
  filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 7px rgba(255, 190, 80, .95));
  animation-duration: 2.6s;
}
.hero-check__btn::before {
  content: ""; position: absolute; z-index: -1; inset: -7px; border-radius: inherit; pointer-events: none;
  background: conic-gradient(from var(--hb-beam), transparent 0deg 230deg, rgba(229, 163, 56, .35) 300deg, rgba(255, 196, 92, .95) 352deg, transparent 360deg);
  filter: blur(7px);
  animation: hb-beam 2.6s linear infinite;
}
@media (prefers-reduced-motion: reduce) { .hero-check__btn::before { animation: none; } }

/* 首屏眉题「AI 搜索可见度监测」不显示(用户 10-28 要删);文字留在 h1 里、视觉隐藏 ——
   SEO 标准第六节 A 要求 h1 带品类词,「看清 AI 会不会推荐你」本身没有品类词 */
.v2-hero__kicker { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* 检测框下面不再放小勾;检测框到看板的间距参考 Peec 首屏(按钮到看板约 66px) */
.v2-hero .hb { margin-top: 66px; }
@media (max-width: 860px) { .v2-hero .hb { margin-top: 44px; } }

/* 首屏看板上沿也渐隐、再往下挪(参考 GEOly 首屏):看板从背景里浮出来,上沿没有硬边,
   注意力留在检测按钮上;看板后面的金色光也压低一点,不和按钮的光抢 */
.v2-hero .hb { margin-top: 104px; }
.hb-frame {
  -webkit-mask-image: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, .35) 5%, #000 17%, #000 56%, transparent 97%);
  mask-image: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, .35) 5%, #000 17%, #000 56%, transparent 97%);
}
.hb::before { top: 40px; opacity: .6; }
@media (max-width: 860px) {
  .v2-hero .hb { margin-top: 56px; }
  .hb-frame {
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 16%, #000 62%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0, #000 16%, #000 62%, transparent 100%);
  }
}

/* 客户评价 4 个 logo 看起来一样大(用户):按面积统一(约 3,000px²)—— 宽的矮一点、方的高一点
   (宽高比:即速应用 3.3、BT教育 3.6、BKJ 2.25、BBX 2.7) */
.p8-quote__logo { height: 30px; }
.p8-quote__logo--bt { height: 29px; }
.p8-quote__logo--bkj { height: 36px; }
.p8-quote__logo--bbx { height: 31px; }

/* 首屏副标题再浅一档(用户);#6E7380 在暖白底上对比度约 4.5:1,刚好够 AA */
.v2-hero__sub { color: #6E7380; }

/* 首屏看板上沿不再渐隐(用户:效果不好),改成窗口外框:浅色标题栏 + 红黄绿三个圆点(参考 GEOly),
   渐变挪到窗口上方 —— 一圈很淡的金色光从窗口上沿往上散开;检测框到窗口 104px(手机 56px)不变 */
.hb-frame::before {
  content: ""; display: block; height: 38px; border-bottom: 1px solid #ECE7DC;
  background:
    radial-gradient(circle at 20px 50%, #FF5F57 0 6px, transparent 6.5px),
    radial-gradient(circle at 40px 50%, #FEBC2E 0 6px, transparent 6.5px),
    radial-gradient(circle at 60px 50%, #28C840 0 6px, transparent 6.5px),
    #F4F2EC;
}
.hb-frame { -webkit-mask-image: linear-gradient(180deg, #000 56%, transparent 97%); mask-image: linear-gradient(180deg, #000 56%, transparent 97%); }
.hb::before { top: -100px; left: 2%; right: 2%; height: 260px; opacity: 1; background: radial-gradient(closest-side, rgba(229, 163, 56, .22), transparent); }
@media (max-width: 860px) {
  .hb-frame::before {
    height: 22px;
    background:
      radial-gradient(circle at 12px 50%, #FF5F57 0 3.5px, transparent 4px),
      radial-gradient(circle at 24px 50%, #FEBC2E 0 3.5px, transparent 4px),
      radial-gradient(circle at 36px 50%, #28C840 0 3.5px, transparent 4px),
      #F4F2EC;
  }
  .hb-frame { -webkit-mask-image: linear-gradient(180deg, #000 62%, transparent 100%); mask-image: linear-gradient(180deg, #000 62%, transparent 100%); }
  .hb::before { top: -50px; height: 150px; }
}

/* 首屏副标题浅灰(用户);#999 在暖白底上对比度约 2.7:1,低于 AA 的 4.5:1,按设计要求取浅 */
.v2-hero__sub { color: #999; }

/* 客户评价 logo 再统一(用户:还是不一样大):按面积算 BKJ 显高、BBX 显重。改成看起来一样大 ——
   即速应用、BT教育同高 30px;BKJ 下面有一行小字,主标志偏小,给 34px;BBX 是实心黑块,显重,收到 27px */
.p8-quote__logo, .p8-quote__logo--bt { height: 30px; }
.p8-quote__logo--bkj { height: 34px; }
.p8-quote__logo--bbx { height: 27px; }

/* 手机端的演示看板是固定 1238px 画布；缩放到可用视口，避免只露出左侧桌面内容。 */
@media (max-width: 860px) {
  .hb-board { zoom: calc((100vw - 40px) / 1238px); }
}

/* 深色主题的首屏演示看板：这套看板为静态 HTML，不能继承产品截图里的浅色硬编码。
   所有容器、输入提示和图表底色在此回到官网的深色令牌。 */
:root[data-theme="dark"] .hb-frame { background: var(--bg); }
:root[data-theme="dark"] .hb-frame::before { border-color: var(--border); background:
  radial-gradient(circle at 20px 50%, #FF5F57 0 6px, transparent 6.5px),
  radial-gradient(circle at 40px 50%, #FEBC2E 0 6px, transparent 6.5px),
  radial-gradient(circle at 60px 50%, #28C840 0 6px, transparent 6.5px),
  var(--surface); }
:root[data-theme="dark"] .hb-board { color: var(--text); }
:root[data-theme="dark"] .hb-side { border-color: var(--border); background: var(--bg-2); }
:root[data-theme="dark"] .hb-proj, :root[data-theme="dark"] .hb-me, :root[data-theme="dark"] .hb-filters { border-color: var(--border); }
:root[data-theme="dark"] .hb-nav.is-open { background: color-mix(in oklab, var(--text) 7%, transparent); }
:root[data-theme="dark"] .hb-sub, :root[data-theme="dark"] .hb-filters .hb-i:first-child, :root[data-theme="dark"] .hb-legend, :root[data-theme="dark"] .hb-btn, :root[data-theme="dark"] .hb-chip { color: var(--text-2); }
:root[data-theme="dark"] .hb-filters span, :root[data-theme="dark"] .hb-kpi, :root[data-theme="dark"] .hb-card { border-color: var(--border); background: var(--surface); }
:root[data-theme="dark"] .hb-kpi__t span, :root[data-theme="dark"] .hb-card__t { text-decoration-color: var(--border-2); }
:root[data-theme="dark"] .hb-grid line { stroke: color-mix(in oklab, var(--text) 12%, transparent); }
:root[data-theme="dark"] .hb-axis text { fill: var(--text-3); }
:root[data-theme="dark"] .hb-cross__l { stroke: color-mix(in oklab, var(--text) 38%, transparent); }
:root[data-theme="dark"] .hb-cross circle { stroke: var(--surface); }
:root[data-theme="dark"] .hb-row.is-hl .hb-row__bar::before { background: color-mix(in oklab, var(--c) 30%, var(--surface)); }
:root[data-theme="dark"] .hb-prompt { border-color: var(--border-2); background: var(--surface); color: var(--text); box-shadow: 0 28px 60px -26px rgba(0, 0, 0, .72); }
:root[data-theme="dark"] .hb-prompt__q { color: var(--text-2); }
:root[data-theme="dark"] .hb-chip { border-color: var(--border-2); background: var(--bg-2); }
:root[data-theme="dark"] .hb-send { background: var(--text); color: var(--bg); }

/* 产品演示截图来自浅色产品界面。深色官网中保留原始文字和图表细节，
   只在展示层转换明度及色相，避免白色画布在夜间模式中突兀发亮。 */
:root[data-theme="dark"] .p9-canvas {
  background:
    linear-gradient(color-mix(in oklab, var(--text) 7%, transparent) 1px, transparent 1px) 0 0 / 44px 44px,
    linear-gradient(90deg, color-mix(in oklab, var(--text) 7%, transparent) 1px, transparent 1px) 0 0 / 44px 44px,
    var(--bg-2);
}
:root[data-theme="dark"] .p9-win { border-color: var(--border); background: var(--surface); }
:root[data-theme="dark"] .p9-win__bar { border-color: var(--border); background: var(--surface); }
:root[data-theme="dark"] .p9-win__bar i { background: var(--border-2); }
:root[data-theme="dark"] .p9-win__bar span { color: var(--text-3); }
:root[data-theme="dark"] .p9-win img,
:root[data-theme="dark"] .p13-aud__ui img {
  filter: invert(.88) hue-rotate(180deg) brightness(.72) contrast(1.12);
}

/* 联系团队页(「预约演示」落地页,PRD 3.11):去掉标题区(眉题「联系销售」和大标题),页面直接从两张卡开始。
   h1 留着,只给搜索引擎和读屏软件看(SEO 标准第六节 A:可收录页恰好一个 h1、带品类词),视觉上不显示 */
.contact-sales__intro { margin: 0; }
.contact-sales__intro h1 { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
main:has(.contact-sales__stack) .page-hero { padding-top: 56px; }
@media (max-width: 860px) { main:has(.contact-sales__stack) .page-hero { padding-top: 24px; } }