/* ============================================================================
   益阳天舜广告传媒有限公司 · 常见问题页专属样式（faq.css）
   ---------------------------------------------------------------------------
   作用范围：仅页面 id=tsFaqPage 容器内，全部选择器带 .ts-fq- 前缀或 #tsFaqPage
             作用域，零全局裸选择器，故全站加载也不会影响其它页面。
   加载方式：functions.php 1d 段无条件入队（句柄 tianshun-faq，空依赖）。
             ⚠ 空依赖是必须的：本服务器 GP 对 generate-child-css 的注册时机晚于
             wp_print_styles，声明该依赖会导致 handle 被 all_deps 静默跳过。
   纪律：零 !important / 零内联 style / 零 emoji / 纯原生 CSS。
   版本：2026-09-13 重设计二版
   上传：与 style.css / contact.css / functions.php 同级，放子主题根目录
        wp-content/themes/generatepress-child/faq.css
   ============================================================================
   本版针对首版重设计暴露的问题所做的修正：
     ① 对齐：全页统一为左对齐主轴（首版是「首屏左对齐 + 区块标题居中 +
        面板头左对齐」三套对齐混用）
     ② 间距：建立「外大内小」的层级 —— 区块 64~104 > 面板间 20~32 >
        面板内边距 20~28 > 条目间 8~12 > 条目内边距 16
        （首版面板间距 10~14 < 面板内边距 18~32，属层级倒挂，面板糊成一片）
     ③ 背景：问答区改纯色浅底 #F4F7FB（首版是渐变，底部渐白后白面板失去边界）；
        白面板靠底色差立边界，不再靠描边
     ④ 色量：橙只留三处（主按钮 / 展开态侧标与题号 / 链接悬停），
        EN 标签由橙改中性灰，眉标改墨蓝
     ⑤ 网格：条目 align-items:stretch，同一行卡片等高，消除参差
     ⑥ 排版：h1 加 balance 防末字落单，正文 pretty，行高统一 1.9
   ============================================================================ */

    #tsFaqPage{
      /* —— 色彩：墨蓝三档 + 三级中性灰 + 橙（仅交互态）—— */
      --fq-primary:#0B1F3A;
      --fq-primary-soft:#122A4A;
      --fq-primary-ink:#071527;
      --fq-accent:#F26B21;
      --fq-accent-dark:#E0631A;
      --fq-accent-text:#C2410C;   /* 白底橙字 5.18:1，达 AA */
      --fq-text:#4B5563;          /* 正文 7.5:1 */
      --fq-muted:#6B7280;         /* 说明 4.85:1，达 AA */
      --fq-faint:#98A2B3;         /* 仅装饰，不承载信息 */
      --fq-line:rgba(16,24,40,.1);
      --fq-line-soft:rgba(16,24,40,.06);
      --fq-surface:#FFFFFF;
      --fq-tint:#F6F8FC;          /* 条目底 */
      --fq-tint-2:#F4F7FB;        /* 区块底 */
      --fq-wash:rgba(242,107,33,.07);

      /* —— 形状 —— */
      --fq-r-sm:10px;
      --fq-r-md:14px;
      --fq-r-lg:22px;
      --fq-container:1280px;
      --fq-gutter:24px;

      /* —— 间距阶梯（外大内小）—— */
      --fq-s1:4px;  --fq-s2:8px;  --fq-s3:12px; --fq-s4:16px;
      --fq-s5:24px; --fq-s6:32px; --fq-s7:48px; --fq-s8:64px;
      --fq-section-y:clamp(64px,7vw,104px);
      --fq-panel-gap:clamp(20px,2.2vw,32px);
      --fq-panel-pad:clamp(20px,2vw,28px);
      --fq-item-gap:clamp(8px,.9vw,12px);

      /* —— 字号阶梯 —— */
      --fq-fs-h1:clamp(30px,3.4vw,44px);
      --fq-fs-h2:clamp(23px,2.3vw,31px);
      --fq-fs-h3:clamp(17.5px,1.5vw,20px);
      --fq-fs-q:clamp(15.5px,1.1vw,16.5px);
      --fq-fs-body:clamp(14.6px,1vw,15.4px);
      --fq-fs-sm:13.5px;
      --fq-fs-xs:12.5px;

      --fq-ease:cubic-bezier(.22,.61,.36,1);

      display:block;
      color:var(--fq-text);
      background:#FFFFFF;
      font-size:16px;
      line-height:1.75;
      -webkit-font-smoothing:antialiased;
      text-rendering:optimizeLegibility;
    }
    #tsFaqPage *,#tsFaqPage *::before,#tsFaqPage *::after{box-sizing:border-box}
    #tsFaqPage p,#tsFaqPage h1,#tsFaqPage h2,#tsFaqPage h3,#tsFaqPage ul,#tsFaqPage ol{margin:0;padding:0}
    #tsFaqPage a{text-decoration:none;color:inherit}
    #tsFaqPage ul,#tsFaqPage ol{list-style:none}
    #tsFaqPage summary{list-style:none;cursor:pointer}
    #tsFaqPage summary::-webkit-details-marker{display:none}
    #tsFaqPage p{text-wrap:pretty}

    /* ======================= 1. 首屏 ======================= */
    #tsFaqPage .ts-fq-hero{
      position:relative;overflow:hidden;color:#fff;
      background:
        radial-gradient(700px 400px at 88% 0%, rgba(242,107,33,.16), transparent 66%),
        linear-gradient(148deg,var(--fq-primary) 0%,var(--fq-primary-soft) 60%,var(--fq-primary-ink) 100%);
    }
    #tsFaqPage .ts-fq-hero::after{
      content:"";position:absolute;inset:0;pointer-events:none;
      background-image:
        linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
      background-size:72px 72px;
      mask-image:radial-gradient(72% 80% at 38% 26%, #000, transparent 84%);
      -webkit-mask-image:radial-gradient(72% 80% at 38% 26%, #000, transparent 84%);
    }
    #tsFaqPage .ts-fq-hero__inner{
      position:relative;z-index:1;
      max-width:var(--fq-container);margin:0 auto;
      padding:clamp(52px,6vw,92px) var(--fq-gutter) clamp(44px,5.2vw,76px);
      display:grid;
      grid-template-columns:minmax(0,1.24fr) minmax(0,.76fr);
      gap:clamp(28px,3.2vw,56px);
      align-items:start;
    }
    #tsFaqPage .ts-fq-eyebrow{
      display:inline-flex;align-items:center;gap:var(--fq-s2);
      margin:0 0 var(--fq-s4);
      font-size:var(--fq-fs-xs);font-weight:700;letter-spacing:.16em;
      color:var(--fq-accent);
    }
    #tsFaqPage .ts-fq-eyebrow::before{
      content:"";width:22px;height:2px;border-radius:2px;
      background:linear-gradient(90deg,var(--fq-accent),rgba(242,107,33,.25));
    }
    #tsFaqPage .ts-fq-hero h1{
      font-size:var(--fq-fs-h1);
      font-weight:800;line-height:1.24;letter-spacing:-.022em;
      color:#fff;max-width:16em;text-wrap:balance;
    }
    #tsFaqPage .ts-fq-hero__lead{
      max-width:620px;margin-top:var(--fq-s4);
      font-size:clamp(14.5px,1.1vw,16.5px);line-height:1.9;
      color:rgba(255,255,255,.78);
    }
    #tsFaqPage .ts-fq-hero__actions{
      display:flex;flex-wrap:wrap;align-items:center;
      gap:var(--fq-s3);margin-top:var(--fq-s6);
    }
    #tsFaqPage .ts-fq-hero__facts{
      display:flex;flex-wrap:wrap;align-items:center;
      gap:var(--fq-s2) var(--fq-s4);
      margin-top:var(--fq-s6);padding-top:var(--fq-s5);
      border-top:1px solid rgba(255,255,255,.14);
    }
    #tsFaqPage .ts-fq-fact{
      display:inline-flex;align-items:center;gap:7px;
      font-size:var(--fq-fs-sm);color:rgba(255,255,255,.8);
    }
    #tsFaqPage .ts-fq-fact + .ts-fq-fact{padding-left:var(--fq-s4);border-left:1px solid rgba(255,255,255,.14)}
    #tsFaqPage .ts-fq-fact b{color:#fff;font-weight:700}
    #tsFaqPage .ts-fq-dot{
      flex:none;width:7px;height:7px;border-radius:50%;
      background:#22C55E;box-shadow:0 0 0 4px rgba(34,197,94,.2);
    }
    #tsFaqPage .ts-fq-dot.is-off{background:rgba(255,255,255,.35);box-shadow:none}
    #tsFaqPage .ts-fq-hero__note{
      display:flex;flex-wrap:wrap;align-items:center;
      gap:var(--fq-s2) var(--fq-s3);
      margin-top:var(--fq-s4);
      font-size:var(--fq-fs-xs);line-height:1.7;color:rgba(255,255,255,.56);
    }
    #tsFaqPage .ts-fq-updated{
      display:inline-flex;align-items:center;gap:6px;
      padding-left:var(--fq-s3);border-left:1px solid rgba(255,255,255,.16);
      white-space:nowrap;
    }
    #tsFaqPage .ts-fq-updated time{color:rgba(255,255,255,.84);font-weight:700}

    #tsFaqPage .ts-fq-index{
      padding:clamp(18px,1.8vw,24px);
      border:1px solid rgba(255,255,255,.16);
      border-radius:var(--fq-r-lg);
      background:rgba(255,255,255,.055);
      backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    }
    #tsFaqPage .ts-fq-index h2{
      display:flex;align-items:center;gap:var(--fq-s2);
      font-size:var(--fq-fs-sm);font-weight:800;letter-spacing:.08em;
      color:rgba(255,255,255,.66);
      padding-bottom:var(--fq-s3);margin-bottom:var(--fq-s4);
      border-bottom:1px solid rgba(255,255,255,.14);
    }
    #tsFaqPage .ts-fq-index h2::before{
      content:"";width:3px;height:13px;border-radius:2px;background:var(--fq-accent);
    }
    #tsFaqPage .ts-fq-index__list{display:grid;gap:var(--fq-s1)}
    #tsFaqPage .ts-fq-index__list a{
      display:flex;align-items:center;justify-content:space-between;gap:var(--fq-s3);
      padding:9px 11px;border-radius:var(--fq-r-sm);
      /* ★ 2026-09-22 新增：触屏可点区达标（原盒高 40~43px，低于 44x44）。
         本就是 flex + align-items:center，加 min-height 只抬高度不改横向排版。 */
      min-height:44px;
      font-size:14px;font-weight:600;color:rgba(255,255,255,.92);
      transition:background-color .22s var(--fq-ease),color .22s var(--fq-ease);
    }
    @media (hover: hover){
      #tsFaqPage .ts-fq-index__list a:hover{background:rgba(242,107,33,.18);color:#fff}
    }
    #tsFaqPage .ts-fq-index__list em{
      font-style:normal;flex:none;
      padding:1px 8px;border-radius:999px;background:rgba(255,255,255,.1);
      font-size:var(--fq-fs-xs);font-weight:700;color:rgba(255,255,255,.62);
    }
    @media (hover: hover){
      #tsFaqPage .ts-fq-index__list a:hover em{background:rgba(255,255,255,.2);color:#fff}
    }
    #tsFaqPage .ts-fq-index__facts{
      margin-top:var(--fq-s5);padding-top:var(--fq-s4);
      border-top:1px solid rgba(255,255,255,.14);
      display:grid;gap:7px;font-size:var(--fq-fs-sm);color:rgba(255,255,255,.76);
    }
    #tsFaqPage .ts-fq-index__facts b{color:#fff;font-weight:700}

    /* ======================= 2. 区块与容器 ======================= */
    #tsFaqPage .ts-fq-section{
      padding:var(--fq-section-y) 0 clamp(48px,5vw,84px);
      background:#FFFFFF;   /* 去底色：与页面同为纯白 */
    }
    #tsFaqPage .ts-fq-container{max-width:var(--fq-container);margin:0 auto;padding:0 var(--fq-gutter)}

    /* 区块头：不再给自身设 max-width —— 标题本身很短，无需限宽；
       放开后导读行可用满容器宽度（1280 容器 - 48 内边距 = 1232px），
       在桌面端稳定排成一行，不再折行 */
    #tsFaqPage .ts-fq-head{
      margin:0 auto var(--fq-s6);   /* 自身块级居中 */
      text-align:center;            /* 眉标/标题/导读行内居中 */
    }
    #tsFaqPage .ts-fq-head__eyebrow{
      display:inline-flex;align-items:center;gap:var(--fq-s2);
      margin-bottom:var(--fq-s3);
      font-size:var(--fq-fs-xs);font-weight:700;letter-spacing:.16em;
      color:var(--fq-primary);
    }
    #tsFaqPage .ts-fq-head__eyebrow::before{
      content:"";width:20px;height:2px;border-radius:2px;background:var(--fq-accent);
    }
    #tsFaqPage .ts-fq-head h2{
      font-size:var(--fq-fs-h2);font-weight:800;line-height:1.32;
      letter-spacing:-.018em;color:var(--fq-primary);text-wrap:balance;
    }
    #tsFaqPage .ts-fq-head__lead{
      margin:var(--fq-s3) auto 0;
      max-width:1180px;
      text-align:center;                       /* 元素自身声明，不依赖父级 */
      font-size:clamp(14px,1.05vw,15.5px);line-height:1.85;color:var(--fq-muted);
    }
    #tsFaqPage .ts-fq-head__lead b{color:var(--fq-primary);font-weight:800}


    /* ======================= 3. 分组面板 ======================= */
    /* 分组面板：页面已改纯白，白卡在白底上既无边界又显脏 → 去背景/去阴影/去圆角/去内边距，
       层次改由「组头分隔线 + 组间距」承担 */
    #tsFaqPage .ts-fq-group{
      padding:0;
      border:0;
      border-radius:0;
      background:none;
      box-shadow:none;
    }
    #tsFaqPage .ts-fq-group + .ts-fq-group{margin-top:clamp(40px,4.4vw,64px)   /* 面板去背景后靠组间距分段 */}
    /* 分组头 = 左侧「序号 + 标题」/ 右侧「问数」，说明紧贴标题；分隔线落在说明之下，
       使「标题 + 说明」成为一个完整表头，而不是被线割开 */
    #tsFaqPage .ts-fq-group__head{
      display:flex;flex-wrap:wrap;align-items:baseline;
      gap:var(--fq-s2) var(--fq-s3);
      margin-bottom:var(--fq-s5);
      padding-bottom:var(--fq-s4);
      border-bottom:1px solid var(--fq-line-soft);
    }
    #tsFaqPage .ts-fq-idx{
      font-style:normal;flex:none;
      font-size:13px;font-weight:800;letter-spacing:.08em;
      color:var(--fq-primary);opacity:.38;      /* 可见但从属于标题，不再是脏灰点 */
      font-variant-numeric:tabular-nums;
    }
    #tsFaqPage .ts-fq-group__head h3{
      flex:none;font-size:var(--fq-fs-h3);font-weight:800;
      letter-spacing:-.01em;color:var(--fq-primary);
    }
    #tsFaqPage .ts-fq-group__count{
      font-style:normal;flex:none;margin-left:auto;align-self:center;
      padding:3px 11px;border-radius:999px;
      background:var(--fq-tint-2);border:1px solid var(--fq-line-soft);
      font-size:var(--fq-fs-xs);font-weight:700;color:var(--fq-muted);
      font-variant-numeric:tabular-nums;
      white-space:nowrap;
    }
    #tsFaqPage .ts-fq-group__desc{
      flex:1 1 100%;margin:var(--fq-s1) 0 0;
      font-size:var(--fq-fs-sm);line-height:1.8;color:var(--fq-muted);
    }
    #tsFaqPage .ts-fq-group__desc a{
      color:var(--fq-accent-text);font-weight:700;
      border-bottom:1px solid rgba(242,107,33,.4);
      transition:color .2s var(--fq-ease),border-color .2s var(--fq-ease);
    }
    @media (hover: hover){
      #tsFaqPage .ts-fq-group__desc a:hover{color:var(--fq-accent-dark);border-bottom-color:var(--fq-accent-dark)}
    }

    /* ======================= 4. 问答条目 ======================= */
    #tsFaqPage .ts-fq-grid{
      display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
      gap:var(--fq-item-gap);align-items:stretch;
    }
    #tsFaqPage .ts-fq-item{
      position:relative;display:flex;flex-direction:column;
      border:1px solid transparent;border-radius:var(--fq-r-md);
      background:var(--fq-tint);
      transition:background-color .24s var(--fq-ease),border-color .24s var(--fq-ease),
                 box-shadow .24s var(--fq-ease);
    }
    @media (hover: hover){
      #tsFaqPage .ts-fq-item:hover{
        background:var(--fq-surface);border-color:rgba(242,107,33,.28);
        box-shadow:0 14px 32px -26px rgba(11,31,58,.4);
      }
    }
    #tsFaqPage .ts-fq-item[open]{
      background:var(--fq-surface);border-color:rgba(242,107,33,.4);
      box-shadow:0 2px 4px rgba(11,31,58,.04), 0 26px 52px -34px rgba(11,31,58,.4);
    }
    #tsFaqPage .ts-fq-item[open]::before{
      content:"";position:absolute;left:-1px;top:14px;bottom:14px;width:3px;
      border-radius:0 3px 3px 0;background:var(--fq-accent);
    }
    #tsFaqPage .ts-fq-item > summary{
      display:flex;align-items:flex-start;gap:var(--fq-s3);
      padding:16px;
      font-size:var(--fq-fs-q);font-weight:700;line-height:1.55;
      color:var(--fq-primary);-webkit-tap-highlight-color:transparent;
    }
    /* 问题文字用 <h4> 包裹（语义化：让机器把每一问当成独立标题读取，
       而不是一段普通文字）。必须重置主题 h4 的默认字号/边距/颜色，
       否则 32 行问题会整体变形。flex:1 1 auto 让文字占满剩余宽度，
       右侧加号图标仍由 margin-left:auto 顶到最右。 */
    #tsFaqPage .ts-fq-item > summary h4{
      flex:1 1 auto;min-width:0;
      margin:0;padding:0;border:0;
      font:inherit;color:inherit;letter-spacing:inherit;
    }
    #tsFaqPage .ts-fq-no{
      flex:none;display:grid;place-items:center;
      min-width:32px;height:23px;margin-top:1px;padding:0 7px;
      border-radius:7px;
      background:var(--fq-surface);border:1px solid var(--fq-line);
      color:var(--fq-muted);
      font-size:11.5px;font-weight:800;letter-spacing:.03em;
      transition:background-color .24s var(--fq-ease),border-color .24s var(--fq-ease),
                 color .24s var(--fq-ease);
    }
    #tsFaqPage .ts-fq-item[open] .ts-fq-no{
      background:var(--fq-accent);border-color:var(--fq-accent);color:#fff;
    }
    #tsFaqPage .ts-fq-ico{
      flex:none;margin-left:auto;margin-top:3px;
      width:18px;height:18px;color:var(--fq-faint);
      transition:transform .28s var(--fq-ease),color .26s var(--fq-ease);
    }
    @media (hover: hover){
      #tsFaqPage .ts-fq-item:hover .ts-fq-ico{color:var(--fq-accent-text)}
    }
    #tsFaqPage .ts-fq-item[open] .ts-fq-ico{transform:rotate(135deg);color:var(--fq-accent-text)}
    #tsFaqPage .ts-fq-body{padding:0 16px 16px 61px}
    #tsFaqPage .ts-fq-body p{font-size:var(--fq-fs-body);line-height:1.9;color:var(--fq-text)}
    #tsFaqPage .ts-fq-body p + p{margin-top:var(--fq-s3)}
    #tsFaqPage .ts-fq-body > p:first-child{color:var(--fq-primary);font-weight:600}
    #tsFaqPage .ts-fq-body ul{
      margin:var(--fq-s3) 0 0;padding-left:18px;list-style:disc;
      font-size:var(--fq-fs-body);line-height:1.9;color:var(--fq-text);
    }
    #tsFaqPage .ts-fq-body li + li{margin-top:6px}
    #tsFaqPage .ts-fq-body li::marker{color:var(--fq-accent)}
    #tsFaqPage .ts-fq-body b{color:var(--fq-primary);font-weight:700}
    #tsFaqPage .ts-fq-body a{
      color:var(--fq-accent-text);font-weight:700;
      border-bottom:1px solid rgba(242,107,33,.35);
      transition:color .2s var(--fq-ease),border-color .2s var(--fq-ease);
    }
    @media (hover: hover){
      #tsFaqPage .ts-fq-body a:hover{color:var(--fq-accent-dark);border-bottom-color:var(--fq-accent-dark)}
    }
    #tsFaqPage .ts-fq-item > summary:focus-visible{
      outline:3px solid rgba(242,107,33,.55);outline-offset:-3px;border-radius:var(--fq-r-md);
    }

    /* ======================= 5. 按钮 ======================= */
    #tsFaqPage .ts-fq-btn{
      display:inline-flex;align-items:center;justify-content:center;gap:9px;
      padding:14px 24px;border:1px solid transparent;border-radius:11px;
      font-size:15px;font-weight:700;line-height:1;cursor:pointer;
      transition:background-color .24s var(--fq-ease),color .24s var(--fq-ease),
                 border-color .24s var(--fq-ease),transform .24s var(--fq-ease),
                 box-shadow .24s var(--fq-ease);
    }
    #tsFaqPage .ts-fq-btn svg{width:16px;height:16px;flex:none}
    #tsFaqPage .ts-fq-btn--primary{
      background:var(--fq-accent);color:var(--fq-primary);
      box-shadow:0 12px 28px -14px rgba(242,107,33,.7);
    }
    @media (hover: hover){
      #tsFaqPage .ts-fq-btn--primary:hover{
        background:var(--fq-accent-dark);color:#fff;transform:translateY(-2px);
        box-shadow:0 16px 34px -14px rgba(224,99,26,.75);
      }
    }
    #tsFaqPage .ts-fq-btn--ghost{
      border-color:rgba(255,255,255,.34);color:#fff;background:rgba(255,255,255,.06);
      backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
    }
    @media (hover: hover){
      #tsFaqPage .ts-fq-btn--ghost:hover{
        border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.14);transform:translateY(-2px);
      }
    }
    #tsFaqPage .ts-fq-btn:focus-visible{outline:3px solid var(--fq-accent);outline-offset:3px}

    /* ======================= 6. 相关阅读 ======================= */
    /* 相关阅读属页面级区块，与上方「问答区标题」同级 → 同样居中 */
    #tsFaqPage .ts-fq-read{margin-top:var(--fq-s8);text-align:center}
    #tsFaqPage .ts-fq-read h2{
      font-size:var(--fq-fs-h2);font-weight:800;letter-spacing:-.018em;
      color:var(--fq-primary);text-wrap:balance;
    }
    #tsFaqPage .ts-fq-read__lead{
      max-width:640px;
      margin:var(--fq-s3) auto clamp(18px,1.8vw,26px);  /* 上方 12px、下方 18~26px，紧凑些 */
      text-align:center;                       /* 元素自身声明，不依赖父级 */
      font-size:clamp(14px,1.05vw,15.5px);line-height:1.85;color:var(--fq-muted);
    }
    #tsFaqPage .ts-fq-read ul{margin-top:0;text-align:left}
    #tsFaqPage .ts-fq-read ul{
      display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
      gap:var(--fq-item-gap);
    }
    #tsFaqPage .ts-fq-read a{
      display:flex;align-items:center;gap:var(--fq-s3);height:100%;
      padding:16px 18px;border-radius:var(--fq-r-md);
      background:var(--fq-surface);border:1px solid var(--fq-line-soft);
      font-size:14.5px;font-weight:700;color:var(--fq-primary);
      box-shadow:none;
      transition:background-color .22s var(--fq-ease),color .22s var(--fq-ease),
                 transform .22s var(--fq-ease),box-shadow .22s var(--fq-ease);
    }
    #tsFaqPage .ts-fq-read a::after{
      content:"";flex:none;width:7px;height:7px;margin-left:auto;
      border-top:1.6px solid currentColor;border-right:1.6px solid currentColor;
      transform:rotate(45deg);opacity:.5;
    }
    @media (hover: hover){
      #tsFaqPage .ts-fq-read a:hover{
        color:var(--fq-accent-text);transform:translateY(-2px);
        box-shadow:0 2px 4px rgba(11,31,58,.04), 0 22px 44px -30px rgba(11,31,58,.45);
      }
    }
    #tsFaqPage .ts-fq-read a:focus-visible{outline:3px solid rgba(242,107,33,.55);outline-offset:2px}

    /* 7. 底部转化区 —— 深色卡片，宽度收进 1280 版心，左右留出 gutter，
          与上方白面板左右边缘对齐（不再通栏） */
    #tsFaqPage .ts-fq-cta{
      position:relative;
      color:#fff;
      background:none;
      border-radius:0;
      overflow:visible;
    }
    #tsFaqPage .ts-fq-cta__inner{
      position:relative;overflow:hidden;
      display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
      gap:clamp(26px,3vw,52px);align-items:center;
      padding:clamp(36px,4vw,60px) clamp(24px,2.6vw,44px);
      border-radius:var(--fq-r-lg);
      background:
        radial-gradient(620px 320px at 88% 0%, rgba(242,107,33,.22), transparent 66%),
        linear-gradient(145deg,var(--fq-primary) 0%,var(--fq-primary-soft) 62%,var(--fq-primary-ink) 100%);
    }
    #tsFaqPage .ts-fq-cta__main{min-width:0}   /* 网格左列的容器：把眉标/标题/说明/按钮/备注收成一体 */
    #tsFaqPage .ts-fq-cta__eyebrow{
      display:inline-flex;align-items:center;gap:var(--fq-s2);
      margin-bottom:var(--fq-s3);
      font-size:var(--fq-fs-xs);font-weight:700;letter-spacing:.16em;
      color:var(--fq-accent);
    }
    #tsFaqPage .ts-fq-cta__eyebrow::before{
      content:"";width:20px;height:2px;border-radius:2px;
      background:linear-gradient(90deg,var(--fq-accent),rgba(242,107,33,.25));
    }
    #tsFaqPage .ts-fq-cta h2{
      font-size:clamp(21px,2.3vw,31px);font-weight:800;line-height:1.34;
      letter-spacing:-.015em;color:#fff;text-wrap:balance;
    }
    #tsFaqPage .ts-fq-cta__desc{
      margin-top:var(--fq-s3);max-width:520px;
      font-size:clamp(14.5px,1.05vw,15.5px);line-height:1.85;
      color:rgba(255,255,255,.78);
    }
    #tsFaqPage .ts-fq-cta__note{
      margin-top:var(--fq-s4);
      font-size:var(--fq-fs-xs);line-height:1.7;color:rgba(255,255,255,.5);
    }
    #tsFaqPage .ts-fq-cta__actions{
      display:flex;flex-wrap:wrap;align-items:center;
      gap:var(--fq-s3);margin-top:var(--fq-s6);
    }
    #tsFaqPage .ts-fq-cta__box{
      padding:clamp(20px,2vw,28px);
      border:1px solid rgba(255,255,255,.16);border-radius:var(--fq-r-md);
      background:rgba(255,255,255,.06);
      backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    }
    #tsFaqPage .ts-fq-cta__row + .ts-fq-cta__row{
      margin-top:var(--fq-s4);padding-top:var(--fq-s4);
      border-top:1px solid rgba(255,255,255,.13);
    }
    #tsFaqPage .ts-fq-cta__label{
      font-size:var(--fq-fs-xs);letter-spacing:.06em;color:rgba(255,255,255,.58);
    }
    #tsFaqPage .ts-fq-cta__value{
      margin-top:5px;font-size:15.5px;font-weight:700;color:#fff;line-height:1.7;
    }
    #tsFaqPage .ts-fq-cta__value a{
      color:#fff;border-bottom:1px solid rgba(255,255,255,.38);
      transition:color .2s var(--fq-ease),border-color .2s var(--fq-ease);
    }
    #tsFaqPage .ts-fq-cta__map{
      display:inline-flex;align-items:center;gap:7px;
    }
    #tsFaqPage .ts-fq-cta__map::after{                     /* 外链示意箭头，纯装饰 */
      content:"";flex:none;width:6px;height:6px;
      border-top:1.6px solid currentColor;border-right:1.6px solid currentColor;
      transform:rotate(45deg);opacity:.6;
    }
    @media (hover: hover){
      #tsFaqPage .ts-fq-cta__value a:hover{
        color:var(--fq-accent);border-bottom-color:var(--fq-accent);
      }
    }
    #tsFaqPage .ts-fq-cta__area{
      margin-top:7px;display:flex;flex-wrap:wrap;gap:6px;
    }
    #tsFaqPage .ts-fq-cta__area span{
      padding:3px 10px;border-radius:999px;
      background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.13);
      font-size:var(--fq-fs-xs);font-weight:600;color:rgba(255,255,255,.86);
      line-height:1.6;
    }
    /* ======================= 8. 响应式 ======================= */
    @media (max-width:1180px){
      #tsFaqPage .ts-fq-read ul{grid-template-columns:repeat(2,minmax(0,1fr))}
    }
    /* ★ 2026-09-22 修订：首屏/CTA 由「≤1100 单列」改为「≤767 单列」。
       原断点让 iPad 竖屏（768~1024）也走手机版单列，右侧目录卡被拉成 720px 通栏，
       版式松散且首屏过高。768 起左文右卡双列，与「平板改用汉堡菜单」的断点对齐。 */
    @media (max-width:767px){
      #tsFaqPage .ts-fq-hero__inner{grid-template-columns:minmax(0,1fr);gap:var(--fq-s6)}
      #tsFaqPage .ts-fq-cta__inner{grid-template-columns:minmax(0,1fr);gap:var(--fq-s6)}
    }
    /* ★ 2026-09-22 修订：问答栅格由「≤1024 单列」改为「≤767 单列」。
       实测：768px 双列时每卡宽 ≈355px，与 390px 手机单列的卡宽（354px）基本一致，
       文字可用宽不降反持平，不存在挤压；页面高度 5916px → 约 3300px。 */
    @media (max-width:767px){
      #tsFaqPage .ts-fq-grid{grid-template-columns:minmax(0,1fr)}
    }
    @media (max-width:1024px){
      #tsFaqPage .ts-fq-item[open]::before{top:10px;bottom:10px}
    }
    @media (max-width:767px){
      #tsFaqPage{--fq-gutter:18px}
      #tsFaqPage .ts-fq-hero__actions .ts-fq-btn{width:100%}
      #tsFaqPage .ts-fq-hero__facts{gap:var(--fq-s3)}
      #tsFaqPage .ts-fq-fact + .ts-fq-fact{padding-left:0;border-left:0}
      #tsFaqPage .ts-fq-body{padding:0 16px 16px 16px}
      #tsFaqPage .ts-fq-item > summary{padding:14px 15px}
      #tsFaqPage .ts-fq-read ul{grid-template-columns:minmax(0,1fr)}
      #tsFaqPage .ts-fq-cta__actions .ts-fq-btn{width:100%}
    }
    @media (max-width:480px){
      #tsFaqPage .ts-fq-index__list a{font-size:13.5px;padding:8px 10px}
      #tsFaqPage .ts-fq-no{min-width:29px;font-size:11px}
      #tsFaqPage .ts-fq-body{padding:0 14px 14px 14px}
    }
    @media (prefers-reduced-motion:reduce){
      #tsFaqPage *,#tsFaqPage *::before,#tsFaqPage *::after{
        transition:none;animation:none;
      }
    }

/* ==========================================================================
   全宽实现（2026-09-13 19:00 定稿 · 完全照搬 contact.css 的既有做法）
   ---------------------------------------------------------------------------
   contact.css 的做法（线上已验证有效、且不影响页头导航）：
       只给首屏写 width:100vw + 负左外边距，把区块顶出容器到视口两侧；
       不碰任何容器（不写 #page / .site-content / .inside-article），
       不加任何 overflow 裁切。
   本文件此前两轮之所以出问题，就是偏离了这个做法：
       ① 加 overflow-x 裁切 → body 变滚动容器 → 破坏吸顶导航；
       ② 用 revert 保护页头 → 回退到浏览器默认样式而非 GP 作者样式，
          把页头容器的内边距/最大宽度清零 → logo 与按钮跑到视口两端；
       ③ 去解限 #page 等容器 → 多此一举，反而容易误伤。
   现全部改回与 contact.css 一致的写法，并删除所有容器解限与页头规则。
   ========================================================================== */
#tsFaqPage .ts-fq-hero{
    width: calc(100vw - var(--ts-sbw, 0px));
    margin-left: calc((100% - (100vw - var(--ts-sbw, 0px))) / 2);
}
/* 底部转化区宽度收口（2026-09-13 20:38 修正）
   ---------------------------------------------------------------------------
   现象：原写法给 .ts-fq-cta 设 width:100% + border-radius，但它是 .ts-fq-section
   的兄弟节点，宽度跟的是「整页」，不是内容列 → 实际渲染为通栏，圆角也看不见。
   正解：把 .ts-fq-cta 当作一个「版心容器」来用（max-width:1280 + 自身居中 +
   水平 gutter），深色卡片背景交给内层 .ts-fq-cta__inner。这样卡片左右边缘
   与上方白面板严格对齐。 */
#tsFaqPage .ts-fq-cta{
    width: 100%;
    max-width: var(--fq-container);
    margin: 0 auto clamp(40px, 5vw, 72px);
    padding: 0 var(--fq-gutter);
}
@media (max-width: 767px){
    #tsFaqPage .ts-fq-cta{
        margin-bottom: 32px;
    }
    #tsFaqPage .ts-fq-cta__inner{
        padding: 32px 20px;
        border-radius: var(--fq-r-md);
    }
}

/* ==========================================================================
   吸顶分类导航（2026-09-13 19:18 加入）
   ========================================================================== */
#tsFaqPage .ts-fq-toc{
    position: sticky;
    top: 96px;
    z-index: 6;
    background: rgba(255, 255, 255, .94);
    border-bottom: 1px solid var(--fq-line-soft);
    box-shadow: 0 10px 26px -22px rgba(11, 31, 58, .5);
    -webkit-backdrop-filter: saturate(150%) blur(10px);
    backdrop-filter: saturate(150%) blur(10px);
}
#tsFaqPage .ts-fq-toc ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;      /* 胶囊组水平居中 */
    gap: var(--fq-s2);
    padding: 12px 0;
    min-width: 0;
}
#tsFaqPage .ts-fq-toc a{
    display: inline-flex;
    align-items: center;
    gap: 7px;
    /* ★ 2026-09-22 新增：分类胶囊盒高原为 42px，触屏下补到 44px。
       本就是 inline-flex + align-items:center，只抬高度不改横向排版。 */
    min-height: 44px;
    padding: 8px 15px;
    border: 1px solid var(--fq-line);
    border-radius: 999px;
    background: #FFFFFF;
    color: var(--fq-primary);
    font-size: var(--fq-fs-sm);
    font-weight: 600;
    white-space: nowrap;
    transition: background-color .22s var(--fq-ease), color .22s var(--fq-ease),
                border-color .22s var(--fq-ease), box-shadow .22s var(--fq-ease);
}
#tsFaqPage .ts-fq-toc a span{
    color: var(--fq-muted);
    font-size: var(--fq-fs-xs);
    font-weight: 600;
}
@media (hover: hover){
  #tsFaqPage .ts-fq-toc a:hover{
      border-color: rgba(242, 107, 33, .5);
      color: var(--fq-accent-text);
  }
}
#tsFaqPage .ts-fq-toc a:focus-visible{
    outline: 3px solid rgba(242, 107, 33, .55);
    outline-offset: 2px;
}
#tsFaqPage .ts-fq-toc a.is-active{
    background: var(--fq-primary);
    border-color: var(--fq-primary);
    color: #FFFFFF;
    box-shadow: 0 8px 20px -12px rgba(11, 31, 58, .6);
}
#tsFaqPage .ts-fq-toc a.is-active span{color: rgba(255, 255, 255, .72)}

/* 锚点定位预留（吸顶导航不遮挡分组标题） */
#tsFaqPage .ts-fq-group{scroll-margin-top: 148px}

/* 窄屏取消吸顶；平板与窄屏改横向滑动 */
@media (max-width: 767px){
    #tsFaqPage .ts-fq-toc{position: static}
}
@media (max-width: 1024px){
    #tsFaqPage .ts-fq-toc ul{
        flex-wrap: nowrap;
        justify-content: flex-start;  /* 横滑档取消居中，避免首项被裁 */
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        /* ★ 2026-09-22 新增：右侧渐隐，提示"还能往右滑"。
           本档已改为 flex-start（左对齐）：
             · 放不下时（≤900px）右侧是胶囊 → 渐隐生效，等于滚动提示；
             · 放得下时（961~1024px）右侧是空白 → 渐隐落在空区，不可见。
           因此无需再按宽度细分，自身即可自适应。 */
        -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 30px), transparent);
        mask-image: linear-gradient(to right, #000 calc(100% - 30px), transparent);
    }
    #tsFaqPage .ts-fq-toc ul::-webkit-scrollbar{display: none}
}

/* ==========================================================================
   打印：隐藏交互件，问答全部可见
   ========================================================================== */
@media print{
    #tsFaqPage{background: #FFFFFF}
    #tsFaqPage .ts-fq-toc,
    #tsFaqPage .ts-fq-cta,
    #tsFaqPage .ts-fq-hero__actions,
    #tsFaqPage .ts-fq-index{display: none}
    #tsFaqPage .ts-fq-hero,
    #tsFaqPage .ts-fq-section{background: #FFFFFF}
    #tsFaqPage .ts-fq-hero h1,
    #tsFaqPage .ts-fq-eyebrow,
    #tsFaqPage .ts-fq-hero__lead,
    #tsFaqPage .ts-fq-hero__facts,
    #tsFaqPage .ts-fq-fact,
    #tsFaqPage .ts-fq-hero__note,
    #tsFaqPage .ts-fq-fact b{color: #000000}
    #tsFaqPage .ts-fq-group,
    #tsFaqPage .ts-fq-item,
    #tsFaqPage .ts-fq-read a{
        background: #FFFFFF; box-shadow: none; border-color: #DDDDDD;
    }
    #tsFaqPage .ts-fq-item{break-inside: avoid}
    #tsFaqPage .ts-fq-body{display: block}
}

/* ==========================================================================
   ★ 2026-09-22 触控目标补齐（CDP 十视口实测后唯一落地的修复）
   ---------------------------------------------------------------------------
   实测（360/390/480 手机、768/1024 平板、1100/1280/1440/1920 桌面，含展开态）：
   全页布局零缺陷 —— 无横向溢出、无越界、无遮挡、无错排、无小字号。
   触控目标唯一不达 44px 且不属 WCAG 2.5.8「句内豁免」的是 CTA 地址链接
   a.ts-fq-cta__map（实测 216x27px，独占一行）。
   分组导读 .ts-fq-group__desc a（20px）与答案内 .ts-fq-body a（21px）均为
   句内行内链接，属 SC 2.5.8 Inline 豁免，加高会破坏行距并造成相邻热区重叠，
   明确不改。
   触屏判定沿用 style.css「(hover: none), (pointer: coarse)」写法，与宽度
   断点解耦；桌面精确指针下排版不变。 */
@media (hover: none), (pointer: coarse){
    #tsFaqPage .ts-fq-cta__value a{
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }
}
