/* 定价页 /pricing（2026-10-30；线上路径 /css/pricing.css；只用在 /pricing）
   照抄线上前端写死的那版（Tailwind），数值逐项对过：字号、颜色、圆角、阴影、间距、断点 768 / 1024；内容宽 1112（线上 1160 容器减两侧 24）
   结构见 pages/pricing/en/pricing-body.html：<div class="tb-pricing"> 包住全部内容，所以 landing.css 的 ".tb-landingpage > section" 规则碰不到这里；
   其余会继承的规则（标题字体、链接下划线、strong 颜色）在这里用 .tb-pricing 前缀压住
   两张卡的行用 subgrid 对齐（左右同一行的格子一样高），和线上一致；不支持 subgrid 的浏览器各卡自然排列 */
.tb-pricing, .tb-landingpage:has(> .tb-pricing) > .lp-faq { --pr-ink:#0f172a; --pr-text:#64748b; --pr-brand:#5e4cff; --pr-line:#e2e8f0; --pr-muted:#94a3b8;
  --pr-display:"Plus Jakarta Sans", Inter, Roboto, "Helvetica Neue", Arial, sans-serif; --pr-sans:Inter, Roboto, "Helvetica Neue", Arial, sans-serif, system-ui;
  font:16px/1.5 var(--pr-sans); color:var(--pr-text); -webkit-font-smoothing:antialiased; }
.tb-pricing *, .tb-pricing *::before, .tb-pricing *::after { box-sizing:border-box; }
.tb-pricing h1, .tb-pricing h2, .tb-pricing h3, .tb-pricing p { margin:0; letter-spacing:normal; }
.tb-pricing a:hover { text-decoration:none; }
.tb-pricing .pr-teams p:not(.pr-teams-action) > a, .tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list a { color:var(--pr-brand); font-weight:600; text-decoration:underline; text-underline-offset:3px; }   /* 正文里的文字链接（团队区、FAQ 答案） */
.tb-pricing section { padding:0; background:none; }

/* 首屏 + 价格卡共用浅底 */
.tb-pricing .pr-hero, .tb-pricing .pr-plans { background:#fbfbff; }
.tb-pricing .pr-hero { padding:48px 16px 40px; text-align:center; }
.tb-pricing .pr-hero h1 { max-width:860px; margin:0 auto; font:800 30px/1.2 var(--pr-display); letter-spacing:-.85px; color:var(--pr-ink); }
.tb-pricing .pr-hero h1 span { display:block; }
.tb-pricing .pr-hero h1 .pr-accent { color:var(--pr-brand); }
.tb-pricing .pr-lead { max-width:780px; margin:20px auto 0; font-size:16px; line-height:1.625; color:var(--pr-text); }

/* 月付 / 年付切换 */
.tb-pricing .pr-toggle { display:inline-flex; align-items:center; margin-top:36px; padding:4px; border-radius:999px; background:#e6e3ff; }
.tb-pricing .pr-toggle button { border:0; background:transparent; cursor:pointer; border-radius:999px; padding:10px 24px; font:500 14px/1.5 var(--pr-sans); color:var(--pr-ink); transition:color .2s, background-color .2s; }
.tb-pricing .pr-toggle button:hover { color:var(--pr-brand); }
.tb-pricing .pr-toggle button[aria-pressed="true"] { background:#fff; font-weight:700; color:var(--pr-brand); box-shadow:0 2px 10px rgba(94,76,255,.18); }
.tb-pricing .pr-toggle button:focus-visible { outline:2px solid var(--pr-brand); outline-offset:2px; }
.tb-pricing .pr-save { margin-left:8px; padding:2px 8px; border-radius:999px; background:#e8f6ec; font-size:12px; font-weight:600; color:#26b037; }

/* 价格卡 */
.tb-pricing .pr-plans { padding:0 16px 56px; }
.tb-pricing .pr-grid { display:grid; grid-template-columns:1fr; gap:32px; max-width:1112px; margin:0 auto; }
.tb-pricing .pr-card { position:relative; display:grid; grid-template-columns:1fr; padding:24px; border-radius:16px; background:#fff; border:1px solid var(--pr-line); box-shadow:0 12px 24px rgba(15,23,42,.04); }
.tb-pricing .pr-card--pro { border-color:var(--pr-brand); box-shadow:0 24px 48px rgba(94,76,255,.12); }
.tb-pricing .pr-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.tb-pricing .pr-card-head h2 { font:700 20px/1.4 var(--pr-display); color:var(--pr-ink); }
.tb-pricing .pr-badge { flex:none; padding:4px 12px; border-radius:999px; background:#ebedff; font-size:12px; line-height:16px; font-weight:600; color:var(--pr-text); }
.tb-pricing .pr-desc { margin-top:8px; font-size:14px; line-height:1.625; color:var(--pr-text); }
.tb-pricing .pr-price { display:flex; align-items:baseline; gap:8px; margin-top:20px; }
.tb-pricing .pr-amount { font:800 36px/1.1 var(--pr-display); letter-spacing:-.5px; color:var(--pr-ink); }
.tb-pricing .pr-card--pro .pr-amount { color:var(--pr-brand); }
.tb-pricing .pr-unit { font-size:14px; color:var(--pr-text); }
.tb-pricing .pr-billed { min-height:20px; margin-top:6px; font-size:14px; line-height:20px; color:var(--pr-text); }
.tb-pricing .pr-action { margin:20px 0 4px; }
.tb-pricing .pr-btn { display:flex; align-items:center; justify-content:center; width:100%; height:48px; padding:0 16px; border-radius:8px; font:600 16px/1 var(--pr-sans); text-decoration:none; transition:filter .15s, background-color .15s; }
.tb-pricing .pr-btn--outline { border:1px solid #aea5ff; background:#fff; color:var(--pr-brand); }
.tb-pricing .pr-btn--outline:hover { background:#f7f6ff; }
.tb-pricing .pr-btn--gradient { border:0; background:linear-gradient(90deg,#8e4cff,#1a00ff); color:#fff; box-shadow:0 10px 20px rgba(94,76,255,.28); }
.tb-pricing .pr-btn--gradient:hover { filter:brightness(1.06); }
.tb-pricing .pr-btn:focus-visible { outline:3px solid #c7c2ff; outline-offset:2px; }

/* 功能行：标签 + ✓ / — + 带虚线下划线的说明（悬停或键盘聚焦弹出解释） */
.tb-pricing .pr-row { position:relative; padding:14px 0 16px; border-top:1px solid var(--pr-line); }
.tb-pricing .pr-row-label { font-size:11px; line-height:16px; font-weight:600; text-transform:uppercase; letter-spacing:.11em; color:var(--pr-ink); }
.tb-pricing .pr-row-value { display:flex; align-items:flex-start; gap:10px; margin-top:6px; font-size:15px; line-height:1.375; }
.tb-pricing .pr-mark { flex:none; margin-top:1px; font-weight:600; color:var(--pr-brand); }
.tb-pricing .pr-row--no .pr-mark { color:var(--pr-muted); }
.tb-pricing .pr-tip-btn { padding:0; border:0; background:none; cursor:pointer; text-align:left; font:inherit; color:var(--pr-ink); text-decoration:underline dashed #cbd5e1; text-underline-offset:4px; }
.tb-pricing .pr-row--no .pr-tip-btn { color:var(--pr-muted); }
.tb-pricing .pr-tip-btn:focus-visible { outline:2px solid var(--pr-brand); outline-offset:2px; border-radius:4px; }
.tb-pricing .pr-tip-box { visibility:hidden; opacity:0; pointer-events:none; position:absolute; left:16px; top:calc(100% + 6px); z-index:30; width:min(320px, calc(100vw - 3rem));
  padding:16px; border:1px solid var(--pr-line); border-radius:12px; background:#fff; font-size:14px; line-height:1.625; color:var(--pr-text); box-shadow:0 10px 30px rgba(15,23,42,.14); transition:opacity .15s; }
.tb-pricing .pr-tip-box strong { display:block; margin-bottom:4px; font-weight:600; color:var(--pr-ink); }
.tb-pricing .pr-tip:hover .pr-tip-box, .tb-pricing .pr-tip:focus-within .pr-tip-box { visibility:visible; opacity:1; }

/* 团队 */
.tb-pricing .pr-teams { padding:56px 16px; background:#f4f4ff; text-align:center; }
.tb-pricing .pr-teams h2 { font:800 24px/1.3 var(--pr-display); letter-spacing:-.5px; color:var(--pr-ink); }
.tb-pricing .pr-teams p { max-width:720px; margin:16px auto 0; font-size:16px; line-height:1.625; color:var(--pr-text); }
.tb-pricing .pr-teams .pr-teams-action { margin-top:32px; }
.tb-pricing .pr-cta { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 40px; border-radius:8px; background:linear-gradient(90deg,#8e4cff,#1a00ff);
  font:800 16px/1.5 var(--pr-display); color:#fff; text-decoration:none; box-shadow:0 10px 20px rgba(94,76,255,.3); transition:transform .15s; }
.tb-pricing .pr-cta:hover { transform:scale(1.02); color:#fff; }
.tb-pricing .pr-cta svg { width:20px; height:20px; }

/* FAQ（2026-10-30 改）：不在 richtext 里，由模板按 faq 字段渲染在正文后面——<section class="lp-faq"><h2>FAQ</h2><div class="lp-faq-list" data-widget="faq">…</div></section>，
   是 main 的直接子元素、不在 .tb-pricing 里，所以用 ".tb-landingpage:has(> .tb-pricing) > .lp-faq" 只在定价页生效；
   左标题右列表；展开由 faq.js 把 h3 换成按钮（.lp-faq-q）、答案包进 .lp-faq-a。这里覆盖 landing.css / faq.css 的卡片 + 编号圆点版式，做成线上的 + 号样式 */
.tb-landingpage:has(> .tb-pricing) > .lp-faq { display:grid; gap:40px; align-items:start; padding:64px max(16px, calc((100% - 1112px) / 2)); background:#fff;
  font:16px/1.5 var(--pr-sans); color:var(--pr-text); -webkit-font-smoothing:antialiased; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq::before { content:none; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq * { box-sizing:border-box; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq > .lp-eyebrow { display:none; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq > h2 { margin:0; text-align:left; font:800 36px/1.1 var(--pr-display); letter-spacing:-.85px; color:var(--pr-ink); }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list { max-width:none; margin:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none; counter-reset:none; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list > h3 { margin:0; padding:0 !important; border-bottom:1px solid var(--pr-line); font:inherit; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list > h3:first-child { border-top:1px solid var(--pr-line); }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list > h3::before { content:none !important; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list > p { margin:0; padding:0 0 20px; border-bottom:1px solid var(--pr-line); font-size:15px; line-height:1.625; color:var(--pr-text); }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list .lp-faq-q { all:unset; box-sizing:border-box; display:flex; align-items:center; justify-content:space-between; gap:24px; width:100%; padding:20px 0; cursor:pointer;
  font:600 16px/1.375 var(--pr-sans); color:var(--pr-ink); transition:color .15s; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list .lp-faq-q:hover { color:var(--pr-brand); }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list .lp-faq-q:focus-visible { outline:2px solid var(--pr-brand); outline-offset:4px; border-radius:6px; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list .lp-faq-q::after { content:""; flex:none; width:20px; height:20px; margin:0; border-radius:0; transform:none;
  background:linear-gradient(var(--pr-brand), var(--pr-brand)) center / 12px 1.8px no-repeat, linear-gradient(var(--pr-brand), var(--pr-brand)) center / 1.8px 12px no-repeat; transition:background-size .2s; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list h3.is-open .lp-faq-q::after { background-size:12px 1.8px, 1.8px 0; transform:none; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list .lp-faq-a { display:grid; grid-template-rows:0fr; transition:grid-template-rows .2s; border-bottom:1px solid var(--pr-line); }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list.is-accordion > h3 { border-bottom:0; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list .lp-faq-a > p { overflow:hidden; min-height:0; margin:0; padding:0 !important; opacity:1; font-size:15px; line-height:1.625; color:var(--pr-text); transition:padding .2s; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list .lp-faq-a.is-open { grid-template-rows:1fr; }
.tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list .lp-faq-a.is-open > p { padding-bottom:20px !important; }

@media (min-width:768px) {
  .tb-pricing .pr-hero { padding:64px 24px 48px; }
  .tb-pricing .pr-hero h1 { font-size:44px; }
  .tb-pricing .pr-lead { font-size:18px; line-height:28px; }
  .tb-pricing .pr-toggle button { padding:10px 32px; font-size:16px; }
  .tb-pricing .pr-plans { padding:0 24px 56px; }
  .tb-pricing .pr-grid { grid-template-columns:1fr 1fr; column-gap:28px; row-gap:0; }
  .tb-pricing .pr-card { grid-row:span 12; grid-template-rows:subgrid; padding:28px; }
  .tb-pricing .pr-card-head h2 { font-size:24px; }
  .tb-pricing .pr-amount { font-size:44px; }
  .tb-pricing .pr-teams { padding:64px 24px; }
  .tb-pricing .pr-teams h2 { font-size:32px; }
  .tb-landingpage:has(> .tb-pricing) > .lp-faq { padding:80px max(24px, calc((100% - 1112px) / 2)); }
  .tb-landingpage:has(> .tb-pricing) > .lp-faq > h2 { font-size:48px; }
  .tb-landingpage:has(> .tb-pricing) > .lp-faq .lp-faq-list .lp-faq-q { font-size:17px; }
}
@media (min-width:1024px) { .tb-landingpage:has(> .tb-pricing) > .lp-faq { grid-template-columns:380px 1fr; gap:96px; } }
@media (prefers-reduced-motion:reduce) { .tb-pricing * { transition:none !important; } }
