/* 定价页、联系页与全站页脚（华哥 10-23 Creem 口径）。只用 brand-mint 设计变量。 */
.site-main { padding-top: var(--space-12); }
.site-hero { max-width: 820px; margin-bottom: var(--space-10); }
.site-hero h1 { font-size: clamp(30px, 4.2vw, 50px); }
.site-lang { display: inline-flex; gap: var(--space-2); padding-left: var(--space-2); border-left: 1px solid var(--line); }
.site-lang a { color: var(--muted); }
.site-lang a[aria-current="true"] { color: var(--ink); font-weight: 750; }
.product-nav a[aria-current="page"] { font-weight: 750; }

.price-section { margin: 0 0 var(--space-12); }
.price-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap; margin-bottom: var(--space-5); }
.price-section h2 { margin: 0; font-size: 24px; letter-spacing: -.02em; }
.price-section-head p { margin: 0; color: var(--muted); font-size: 14px; }
.price-grid { display: grid; gap: var(--space-4); }
.price-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.price-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 820px; }
.price-card { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-6); border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.price-card.is-featured { border-color: var(--n-600); box-shadow: inset 0 0 0 1px var(--n-600); }
.price-card h3 { margin: 0; font-size: 20px; letter-spacing: -.02em; }
.price-credits { font-size: 15px; color: var(--muted); }
.price-credits strong { color: var(--ink); font-size: 22px; font-weight: 780; letter-spacing: -.02em; }
.price-amount { font-size: 34px; font-weight: 790; letter-spacing: -.035em; line-height: 1.1; margin-top: var(--space-2); }
.price-period { margin-left: var(--space-1); color: var(--muted); font-size: 14px; font-weight: 600; letter-spacing: 0; }
.price-sub { margin: 0 0 var(--space-3); color: var(--muted); font-size: 13px; min-height: 1.5em; }
.price-perks { display: grid; gap: var(--space-2); margin: var(--space-2) 0 var(--space-5); padding: 0; list-style: none; font-size: 14px; }
.price-perks li::before { content: "✓"; margin-right: var(--space-2); font-weight: 800; }
.price-card .pricing-action { margin-top: auto; }
.price-notes { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin: var(--space-5) 0 0; padding: 0; list-style: none; color: var(--muted); font-size: 13px; }
.price-notes li::before { content: "•"; margin-right: var(--space-2); }
.price-plan-note { max-width: 820px; margin: var(--space-4) 0 0; color: var(--muted); font-size: 13px; }
.price-status { min-height: 1.5em; margin: 0 0 var(--space-6); color: var(--ink); font-size: 14px; font-weight: 650; }
.price-pay { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-6); color: var(--muted); font-size: 14px; }
.price-pay span { margin-right: var(--space-1); }
.price-pay-option { padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink); font: inherit; font-weight: 650; cursor: pointer; }
.price-pay-option[aria-pressed="true"] { border-color: var(--n-600); box-shadow: inset 0 0 0 1px var(--n-600); }
.price-qr { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; background: rgba(0, 0, 0, .45); }
.price-qr-box { display: grid; justify-items: center; gap: var(--space-3); width: min(320px, 90vw); padding: var(--space-6); border-radius: 14px; background: var(--surface); text-align: center; }
.price-qr-box h2 { margin: 0; font-size: 18px; }
.price-qr-code { width: 220px; height: 220px; background: #fff; }
.price-qr-code svg { width: 100%; height: 100%; }
.price-qr-note { margin: 0; color: var(--muted); font-size: 13px; }
.price-know { max-width: 820px; padding-top: var(--space-6); border-top: 1px solid var(--line); }
.price-know h2 { margin-bottom: var(--space-4); font-size: 20px; }
.price-know ul { display: grid; gap: var(--space-2); margin: 0 0 var(--space-4); padding-left: var(--space-5); color: var(--muted); font-size: 14px; }
.price-links { color: var(--muted); font-size: 14px; }
.price-links a { text-decoration: underline; }

.contact-card { display: grid; grid-template-columns: max-content 1fr; gap: var(--space-4) var(--space-8); max-width: 820px; margin: var(--space-8) 0; padding: var(--space-7); border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.contact-card dt { color: var(--muted); font-size: 13px; font-weight: 700; }
.contact-card dd { margin: 0; font-size: 15px; }
.contact-card a { text-decoration: underline; }
.contact-tips { max-width: 820px; color: var(--muted); font-size: 14px; }

.site-footer { display: grid; gap: var(--space-2); }
.site-footer-company { margin: 0; color: var(--muted); font-size: 13px; }
.site-footer-company strong { color: var(--ink); font-weight: 700; }
.site-footer-company a { text-decoration: underline; }
.site-footer-beian { margin: 0; text-align: center; color: var(--muted); font-size: 12px; }
.site-footer-beian a { color: inherit; text-decoration: none; }
.site-footer-beian a:hover { text-decoration: underline; }
.site-footer-beian-icon { width: 14px; height: 14px; vertical-align: -2px; }

/* Only .cn reserves this strip; ordinary pages keep their filing in the footer. */
html.site-cn { --site-beian-height: 22px; }
.site-board-beian { position: fixed; inset: auto 0 0; z-index: var(--layer-stack-90); box-sizing: border-box; height: var(--site-beian-height); display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0; padding: 0 8px; background: var(--surface); color: var(--muted); font: 12px/22px system-ui, sans-serif; }
.site-board-beian a { display: inline-flex; align-items: center; height: 100%; white-space: nowrap; }
.site-board-beian a:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; }

@media (max-width: 960px) { .price-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .price-grid-4, .price-grid-2 { grid-template-columns: 1fr; }
  .contact-card { grid-template-columns: 1fr; gap: var(--space-1); padding: var(--space-5); }
  .contact-card dd { margin-bottom: var(--space-3); }
  .site-lang { border-left: 0; padding-left: 0; }
}

/* 画板首页页脚（深色 / 浅色主题都跟随页脚自身颜色） */
#globalFooter .index-footer { max-width: 64rem; margin: 0 auto; justify-items: center; text-align: center; }
#globalFooter .index-footer .site-footer-company, #globalFooter .index-footer .site-footer-company strong { color: inherit; }
#globalFooter .index-footer .legal-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem 1rem; }
#globalFooter .index-footer .legal-links a, #globalFooter .index-footer .legal-links button { min-height: 32px; display: inline-flex; align-items: center; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; }

/* 画板首页介绍区（未登录也能看到产品介绍、实录与全部价格） */
#seoArticleSection .home-cta { display: flex; flex-wrap: wrap; gap: var(--space-3); margin: var(--space-5) 0 0; }
#seoArticleSection .home-cta a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 var(--space-4); border-radius: 8px; border: 1px solid var(--ws-line, var(--line)); font-size: 14px; font-weight: 700; color: inherit; text-decoration: none; }
#seoArticleSection .home-cta .home-cta-primary { background: var(--btn-primary-bg); color: var(--btn-primary-fg); border-color: var(--btn-primary-border, var(--btn-primary-bg)); }
#seoArticleSection .home-features { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); }
#seoArticleSection .home-features > div { padding: var(--space-5); border: 1px solid var(--ws-line, var(--line)); border-radius: 12px; }
#seoArticleSection .home-features h2 { font-size: 18px; margin: 0 0 var(--space-2); }
#seoArticleSection .home-features p { margin: 0; font-size: 14px; }
#seoArticleSection .home-pricing { padding: var(--space-6); border: 1px solid var(--ws-line, var(--line)); border-radius: 12px; }
#seoArticleSection .home-pricing h2 { margin: 0 0 var(--space-3); }
#seoArticleSection .home-pricing p { margin: 0 0 var(--space-2); }
#seoArticleSection .home-pricing a { text-decoration: underline; font-weight: 700; }
#seoArticleSection .home-pricing-note { font-size: 13px; }
#redesignHero .home-cta { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-4); }
#redesignHero .home-cta a { font-size: 14px; font-weight: 700; text-decoration: underline; color: inherit; }
#redesignHero .home-cta .home-cta-primary { display: none; }
#redesignHero .workspace-eyebrow { margin-bottom: var(--space-3); font-size: 12px; letter-spacing: .06em; }
@media (max-width: 900px) { #seoArticleSection .home-features { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { #seoArticleSection .home-features { grid-template-columns: 1fr; } }

/* iOS Safari zooms focused fields below 16px, clipping the board and tool drawers.
   Keep pinch zoom available; only editable controls need the mobile text floor. */
@media (max-width: 767px), (pointer: coarse) {
  html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="hidden"]):not([type="file"]),
  html body textarea,
  html body select { font-size: max(16px, 1em); }
}


/* ===== q-cx-design-site-pages：统一营销/条款 chrome（只追加，不覆盖上文） ===== */
:root{
  --p-bg:#FFFFFF;--p-card:#FFFFFF;--p-ink:#1F1E1D;--p-muted:#6B6B70;--p-faint:#9C9CA3;
  --p-line:#E5E5E7;--p-soft:#ECECEE;--p-solid:#1F1E1D;
  --p-serif:"Songti SC","Noto Serif SC",Georgia,serif;
  --p-shadow:0 1px 2px rgb(0 0 0 / .06);
}
body.product-page.site-chrome-on{
  background:var(--p-bg);color:var(--p-ink);
  font:15px/1.5 system-ui,-apple-system,"PingFang SC","Segoe UI",sans-serif;
}
body.product-page.site-chrome-on .product-nav.site-chrome-nav{
  position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:16px;
  height:56px;min-height:56px;max-height:56px;padding:0 20px;
  background:var(--p-card);border-bottom:1px solid var(--p-line);box-shadow:var(--p-shadow);
}
body.product-page.site-chrome-on .product-nav.site-chrome-nav .product-brand{
  display:inline-flex;align-items:center;gap:0;margin:0;padding:0;text-decoration:none;color:var(--p-ink);
  font:600 15px/1 system-ui,-apple-system,"PingFang SC",sans-serif;letter-spacing:-.01em;
}
body.product-page.site-chrome-on .product-nav.site-chrome-nav .product-brand img{
  width:auto;height:32px;max-width:min(180px,42vw);display:block;
}
body.product-page.site-chrome-on .product-nav.site-chrome-nav > nav.site-chrome-links{
  display:flex;align-items:center;gap:18px;flex:1;min-width:0;
}
body.product-page.site-chrome-on .product-nav.site-chrome-nav > nav.site-chrome-links a{
  color:var(--p-muted);text-decoration:none;font-size:14px;white-space:nowrap;
}
body.product-page.site-chrome-on .product-nav.site-chrome-nav > nav.site-chrome-links a[aria-current="page"],
body.product-page.site-chrome-on .product-nav.site-chrome-nav > nav.site-chrome-links a:hover{color:var(--p-ink);}
body.product-page.site-chrome-on .site-chrome-actions{
  display:flex;align-items:center;gap:10px;margin-left:auto;
}
body.product-page.site-chrome-on .site-chrome-actions a{
  display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:0 14px;
  border-radius:999px;font:500 13px/1 system-ui,-apple-system,"PingFang SC",sans-serif;text-decoration:none;
  color:var(--p-ink);border:1px solid transparent;
}
body.product-page.site-chrome-on .site-chrome-actions a.site-chrome-login{color:var(--p-muted);}
body.product-page.site-chrome-on .site-chrome-actions a.site-chrome-board{
  background:var(--p-solid);color:#fff;border-color:var(--p-solid);
}
body.product-page.site-chrome-on .site-chrome-menu{
  display:none;width:40px;height:40px;border-radius:12px;border:1px solid var(--p-line);
  background:var(--p-card);color:var(--p-ink);cursor:pointer;font-size:18px;line-height:1;
}
body.product-page.site-chrome-on .site-chrome-drawer{
  display:none;position:fixed;inset:56px 0 0 0;z-index:39;background:rgb(31 30 29 / .28);
}
body.product-page.site-chrome-on .site-chrome-drawer.is-open{display:block;}
body.product-page.site-chrome-on .site-chrome-drawer-panel{
  width:min(320px,88vw);height:100%;margin-left:auto;padding:20px;background:var(--p-card);
  border-left:1px solid var(--p-line);box-shadow:var(--p-shadow);display:flex;flex-direction:column;gap:12px;
}
body.product-page.site-chrome-on .site-chrome-drawer-panel a{
  color:var(--p-ink);text-decoration:none;font-size:15px;padding:10px 4px;border-bottom:1px solid var(--p-line);
}

body.product-page.site-chrome-on .product-main{
  width:min(680px,100%);margin:0 auto;padding:40px 20px 64px;
}
body.product-page.site-chrome-on .product-main h1,
body.product-page.site-chrome-on .legal-copy > h1{
  font:400 36px/1.25 var(--p-serif);letter-spacing:-.02em;color:var(--p-ink);margin:0 0 16px;
}
body.product-page.site-chrome-on .product-main h2,
body.product-page.site-chrome-on .legal-copy h2{
  font:400 20px/1.35 var(--p-serif);margin:28px 0 10px;color:var(--p-ink);
}
body.product-page.site-chrome-on .product-main p,
body.product-page.site-chrome-on .legal-copy p,
body.product-page.site-chrome-on .product-copy p{
  font-size:16px;line-height:1.75;color:var(--p-ink);
}
body.product-page.site-chrome-on .legal-meta{
  margin:0 0 12px;font-size:13px;color:var(--p-muted);
}
body.product-page.site-chrome-on .product-page-shell,
body.product-page.site-chrome-on .legal-layout{
  width:min(960px,100%);margin:0 auto;padding:0 20px 64px;
  display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:32px;align-items:start;
}
body.product-page.site-chrome-on .legal-layout > .product-main,
body.product-page.site-chrome-on .legal-layout > main{
  width:auto;max-width:680px;margin:0;padding:40px 0 64px;
}
body.product-page.site-chrome-on .site-toc{
  position:sticky;top:72px;padding:16px;border-radius:16px;background:var(--p-card);
  border:1px solid var(--p-line);box-shadow:var(--p-shadow);font-size:13px;
}
body.product-page.site-chrome-on .site-toc strong{display:block;margin-bottom:8px;font-size:12px;color:var(--p-faint);letter-spacing:.04em;text-transform:uppercase;}
body.product-page.site-chrome-on .site-toc a{display:block;padding:4px 0;color:var(--p-muted);text-decoration:none;line-height:1.4;}
body.product-page.site-chrome-on .site-toc a:hover{color:var(--p-ink);}

body.product-page.site-chrome-on .product-footer.site-footer.site-chrome-footer{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 14px;
  padding:28px 20px 36px;border-top:1px solid var(--p-line);background:var(--p-bg);
  color:var(--p-muted);font-size:13px;text-align:center;
}
body.product-page.site-chrome-on .product-footer.site-footer.site-chrome-footer .site-footer-company,
body.product-page.site-chrome-on .product-footer.site-footer.site-chrome-footer .legal-links{
  width:100%;margin:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 14px;align-items:center;
}
body.product-page.site-chrome-on .product-footer.site-footer.site-chrome-footer a,
body.product-page.site-chrome-on .product-footer.site-footer.site-chrome-footer button{
  color:var(--p-muted);background:none;border:0;padding:0;font:inherit;cursor:pointer;text-decoration:none;
}
body.product-page.site-chrome-on .product-footer.site-footer.site-chrome-footer a:hover,
body.product-page.site-chrome-on .product-footer.site-footer.site-chrome-footer button:hover{color:var(--p-ink);text-decoration:underline;}
body.product-page.site-chrome-on .site-chrome-lang{display:inline-flex;gap:8px;margin-left:4px;}
body.product-page.site-chrome-on .site-chrome-lang a[aria-current="true"]{color:var(--p-ink);font-weight:600;}

@media (max-width:760px){
  body.product-page.site-chrome-on .product-nav.site-chrome-nav > nav.site-chrome-links,
  body.product-page.site-chrome-on .site-chrome-actions{display:none;}
  body.product-page.site-chrome-on .site-chrome-menu{display:inline-flex;align-items:center;justify-content:center;margin-left:auto;}
  body.product-page.site-chrome-on .product-main h1,
  body.product-page.site-chrome-on .legal-copy > h1{font-size:28px;}
  body.product-page.site-chrome-on .product-page-shell,
  body.product-page.site-chrome-on .legal-layout{grid-template-columns:1fr;padding:0 16px 48px;}
  body.product-page.site-chrome-on .site-toc{display:none;}
  body.product-page.site-chrome-on .product-main{padding:28px 16px 48px;}
}

/* 设计稿（docs/design/site-pages.html）：营销 / 条款 / 定价页统一浅色底、衬线标题、黑色胶囊主按钮（docs/UI-GAP-20261027.md P1）。
   底色按 #343 全站中性白，取上文 --p-* 令牌，不再写死暖米白。 */
:root { --page-bg: var(--p-bg); --site-serif: var(--p-serif); }
html body.product-page.product-page { --page-bg: var(--p-bg) !important; background: var(--p-bg) !important; color: var(--p-ink); }
body.product-page .product-nav { background: color-mix(in srgb, var(--p-bg) 94%, transparent); border-bottom-color: var(--p-line); }
body.product-page :is(h1, .site-hero h1, .legal-copy h1, .legal-copy h2) { font-family: var(--site-serif); font-weight: 400; letter-spacing: 0; }
