/* 九清国内站 · 应用场景 /scenes/
   ⚠️ 铁律：本文件是这一页 CSS 的唯一副本。不要在页面正文再放 <style>。
      版本号由 joeqing-scenes.php 用 filemtime 生成，改完即时生效，不吃缓存。

   【搬家记录】2026-08-28 从页面正文的 <style> 整块搬过来。原来那套写法（内页 CSS 就近放正文里）
   和全站其它十几个页面不一致，后台一改正文就可能连样式一起改掉，所以归位。
   同时改了三处：
     ① .page-id-469 → .jqs-page（页面 ID 写死，换环境或重建页面就废了）
     ② H1 700 → 500、卡片标题 600 → 500（全站对齐 tesla 是**一律 500**，站长为此打回过两次）
     ③ 字号并到 about.css / cases.css 那一档：H1 40、区块标题 28、卡片标题 17

   ── 规格：和 about.css / cases.css 同一套（tesla.cn/about 实测）──
     H1 40/500，区块标题 28/500，正文 15–18/#5C5E62
*/

/* Astra 给 #primary 默认 margin-top/bottom:60px（动态 CSS 里的
   `.ast-plain-container.ast-no-sidebar #primary`），加上本页自己的上内边距，
   页头到 H1 会空出 170px，太散。
   ⚠️ 只写 `.jqs-page #primary` 压不过主题那条 —— 2026-08-21 实测无效。
      走 .content-area + !important，这是 home.css 里已经验证过的写法。 */
.jqs-page .site-content .content-area{margin-top:0!important;margin-bottom:0!important}

.jqs-sec{padding:clamp(56px,7vw,104px) 0;color:#393C41;font-size:16px;line-height:1.75}
.jqs-sec *{box-sizing:border-box}
.jqs-shell{width:100%;max-width:var(--jq-shell,1344px);margin-inline:auto}

/* 正文被 Astra 的 .entry-content 卡在 --jq-shell 内，浅灰块要铺满整屏 */
.jqs-sec-alt{
  background:#f4f4f4;
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  padding-left:calc(50vw - 50%);padding-right:calc(50vw - 50%);
}

.jqs-h1{
  font-size:clamp(28px,2.8vw,40px);line-height:1.2;color:#171a20;font-weight:500;
  margin:0 0 14px;letter-spacing:-.01em;text-wrap:balance;
}
.jqs-lead{margin:0;max-width:56ch;font-size:clamp(15px,1.4vw,18px);line-height:1.6;color:#5C5E62}

/* 七个场景：三列图卡，和 about/cases 的卡片同一套 */
.jqs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,32px)}
.jqs-item img{
  width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px;display:block;background:#f4f4f4;
}
.jqs-item h2{
  font-size:17px;font-weight:500;color:#171a20;margin:14px 0 6px;line-height:1.45;
}
.jqs-item p{margin:0;font-size:14px;line-height:1.75;color:#5C5E62}

.jqs-cta h2{
  font-size:clamp(22px,2.2vw,28px);line-height:1.28;color:#171a20;font-weight:500;
  margin:0 0 12px;letter-spacing:-.01em;text-wrap:balance;
}
.jqs-cta p{margin:0;font-size:clamp(15px,1.4vw,18px);line-height:1.6;color:#5C5E62}

/* 按钮：全站同一套 40px 高 / 圆角 4 / 14px·500 / 只变色不位移 */
.jqs-cta-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px!important}
.jqs-btn{
  display:inline-flex;align-items:center;justify-content:center;min-width:180px;height:40px;padding:0 24px;
  border-radius:4px;font-size:14px;font-weight:500;line-height:1;text-decoration:none!important;white-space:nowrap;
  transition:background-color .2s ease,color .2s ease;
}
.jqs-btn-primary{background:#3E6AE1;color:#fff!important}
.jqs-btn-primary:hover{background:#3457b8;color:#fff!important}
.jqs-btn-ghost{background:#fff;color:#171a20!important;box-shadow:inset 0 0 0 1px #d3d7dc}
.jqs-btn-ghost:hover{background:#f4f4f4}

/* ── 手机 ───────────────────────────────────────────────────────────
   站长的流量几乎全在手机，这段是主版本不是适配版。 */
@media(max-width:900px){
  .jqs-sec{padding:48px 0}
  .jqs-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .jqs-grid{grid-template-columns:1fr;gap:26px}
  .jqs-cta-btns{gap:8px}
  .jqs-btn{flex:1 1 0;min-width:0;padding:0 10px}
}

@media(prefers-reduced-motion:reduce){
  .jqs-btn{transition:none}
}
