/* ==========================================================================
   首页落地页补充样式（home.css）：Tailwind 预编译产物只含扫描到的类，
   网格/动画/GEO 版块等自定义样式集中在此（原 Views/Home/Index.cshtml 内联，
   2026-09-10 抽出；页面按文件 mtime 换 URL 防 7 天缓存）
   ========================================================================== */
:root{--brand:#0D9488;--brand-light:#14B8A6;--brand-glow:rgba(13,148,136,0.12);--bg:#09090B;--bg2:#18181B;--bg3:#27272A;--border:#27272A;--border-l:#3F3F46;--text:#FAFAFA;--text2:#A1A1AA;--text3:#71717A;--success:#22C55E;--warning:#F59E0B;--error:#EF4444}
    *{scrollbar-width:thin;scrollbar-color:#3F3F46 transparent}
    body{background:var(--bg);color:var(--text);font-family:'Geist','Noto Sans SC',system-ui,sans-serif;overflow-x:hidden}
    /* 中文可读性微调：Tailwind 的 text-sm(14px)/text-xs(12px) 对 CJK 偏小，统一 +1px；
       覆盖写在 landing.css 之后，同优先级后加载生效，不改预编译产物 */
    .text-sm{font-size:15px}
    .text-xs{font-size:13px}
    .dot-grid{background-image:radial-gradient(circle,#27272A 1px,transparent 1px);background-size:24px 24px}

    /* 文章板块卡片（Tailwind 预编译产物不含未用类，三列网格等自定义样式写在这里） */
    .art-grid{display:grid;grid-template-columns:1fr;gap:24px}
    @media (min-width:768px){.art-grid{grid-template-columns:repeat(3,1fr)}}
    .art-card{display:block;background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:24px;transition:border-color .2s}
    .art-card:hover{border-color:var(--brand-light)}
    .art-card h3{font-size:15px;font-weight:600;margin:0 0 8px;color:var(--text)}
    .art-card p{font-size:13px;color:var(--text3);line-height:1.7;margin:0 0 14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
    .art-card .art-meta{font-size:12px;color:var(--text3);display:flex;justify-content:space-between}
    .art-card .art-meta .art-cat{color:var(--brand-light)}

    /* Window mockup */
    .win{background:var(--bg2);border:1px solid var(--border-l);border-radius:12px;overflow:hidden;box-shadow:0 25px 60px -12px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.04)}
    .win-bar{background:var(--bg3);padding:10px 14px;display:flex;align-items:center;gap:7px;border-bottom:1px solid var(--border)}
    .win-dot{width:11px;height:11px;border-radius:50%;flex-shrink:0}
    .win-body{display:flex;min-height:320px}
    .win-side{width:180px;background:rgba(0,0,0,.25);border-right:1px solid var(--border);padding:8px 0;flex-shrink:0}
    .win-side-item{display:flex;align-items:center;gap:8px;padding:7px 14px;font-size:12.5px;color:var(--text2);cursor:default;transition:all .15s}
    .win-side-item.active{background:var(--brand-glow);color:var(--brand-light);font-weight:500}
    .win-side-item .si-dot{width:5px;height:5px;border-radius:50%;background:var(--text3);flex-shrink:0}
    .win-side-item.active .si-dot{background:var(--brand-light)}
    .win-main{flex:1;padding:16px 18px;overflow:hidden}
    .win-task{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border:1px solid var(--border);border-radius:8px;margin-bottom:8px;background:rgba(0,0,0,.15);font-size:12px}
    .win-badge{font-size:10.5px;padding:2px 8px;border-radius:99px;font-weight:500;white-space:nowrap}
    .badge-done{background:rgba(34,197,94,.12);color:#4ade80}
    .badge-run{background:rgba(245,158,11,.12);color:#fbbf24}
    .badge-wait{background:rgba(161,161,170,.1);color:var(--text2)}

    /* 产品窗口自动演示：三场景堆叠交叉淡入，JS 轮换 .active；无 JS 时只显示第一幕 */
    .win-main{position:relative}
    .win-scene{position:absolute;inset:16px 18px;opacity:0;transform:translateY(10px);transition:opacity .45s ease,transform .45s ease;pointer-events:none}
    .win-scene.active{opacity:1;transform:none;pointer-events:auto}
    /* 打字机光标 */
    .caret{display:inline-block;width:7px;height:13px;background:var(--brand-light);vertical-align:-2px;margin-left:2px;animation:caretBlink 1s steps(1) infinite}
    @keyframes caretBlink{50%{opacity:0}}
    /* 任务进度条（跟随状态徽章循环） */
    .win-progress{height:3px;border-radius:99px;background:rgba(255,255,255,.06);overflow:hidden;margin:-3px 0 8px}
    .win-progress>div{height:100%;width:0;background:var(--brand-light);transition:width .9s linear;border-radius:99px}
    /* 执行中徽章呼吸 */
    .badge-run{animation:badgePulse 1.6s ease-in-out infinite}
    @keyframes badgePulse{50%{opacity:.55}}
    /* 发布记录里的平台小图标（间距写死在类里，不依赖 Tailwind 工具类——预编译会裁掉未用到的） */
    .win-picon{width:16px;height:16px;border-radius:4px;flex-shrink:0;margin-right:10px}

    /* Animations */
    @keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
    @keyframes fadeIn{from{opacity:0}to{opacity:1}}
    .anim-up{opacity:0;transform:translateY(20px)}
    .anim-up.visible{animation:fadeUp .6s ease-out forwards}
    .anim-fade{opacity:0}
    .anim-fade.visible{animation:fadeIn .5s ease-out forwards}
    .anim-delay-1{animation-delay:.1s!important}
    .anim-delay-2{animation-delay:.2s!important}
    .anim-delay-3{animation-delay:.3s!important}
    .anim-delay-4{animation-delay:.4s!important}
    .anim-delay-5{animation-delay:.5s!important}
    .anim-delay-6{animation-delay:.6s!important}

    /* Step connector */
    .step-line{position:absolute;top:20px;left:40px;right:0;height:2px;background:var(--border)}
    @media(max-width:767px){
      .step-line{display:none}
      /* 移动端：窗口示意隐藏侧栏让主区占满；能力表收紧内边距与字号 */
      .win-side{display:none}
      .cap-table th,.cap-table td{padding:8px 8px;font-size:13.5px}
    }


    /* 悬停交互：描边卡片浮起高亮 / 无边框单元底色渐显 / 步骤圈点亮 / 表格行底色 / 行内微移 */
    .hv{transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
    .hv:hover{transform:translateY(-3px);border-color:var(--brand)!important;box-shadow:0 10px 26px -10px rgba(13,148,136,.28)}
    .hv-soft{transition:background .2s ease}
    .hv-soft:hover{background:var(--bg2)}
    .hv-step .w-10{transition:all .25s ease}
    .hv-step:hover .w-10{background:var(--brand);color:#fff;box-shadow:0 0 18px rgba(13,148,136,.45)}
    .cap-table tbody tr{transition:background .15s ease}
    .cap-table tbody tr:hover{background:rgba(13,148,136,.07)}
    .hv-row{transition:transform .2s ease}
    .hv-row:hover{transform:translateX(4px)}
    .hv-row:hover p:first-of-type{color:var(--brand-light)}
    .faq-toggle{transition:background .2s ease}
    .faq-toggle:hover{background:rgba(13,148,136,.06)}
    .tab-btn:hover{color:var(--text)}

    /* FAQ */
    .faq-answer{max-height:0;overflow:hidden;transition:max-height .35s ease,padding .35s ease}
    .faq-answer.open{max-height:300px;padding-top:12px}
    .faq-icon{transition:transform .3s ease}
    .faq-icon.open{transform:rotate(45deg)}

    /* Tab underline */
    .tab-btn{position:relative;padding-bottom:12px;color:var(--text3);transition:color .2s}
    .tab-btn::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--brand);transform:scaleX(0);transition:transform .25s ease}
    .tab-btn.active{color:var(--text)}
    .tab-btn.active::after{transform:scaleX(1)}

    /* Capability table */
    .cap-table th,.cap-table td{padding:10px 16px;text-align:center;border-bottom:1px solid var(--border);font-size:15px}
    .cap-table th{color:var(--text3);font-weight:400;font-size:13.5px}

    /* CTA pulse */
    .cta-pulse{position:relative}
    .cta-pulse::before{content:'';position:absolute;inset:-4px;border-radius:9999px;background:var(--brand);opacity:0;animation:ctaPulse 2.5s ease-in-out infinite}
    @keyframes ctaPulse{0%,100%{opacity:0;transform:scale(1)}50%{opacity:.15;transform:scale(1.02)}}

    /* GEO 专题版块（2026-09-10）：顶部品牌光晕 + AI 回答示意卡扫描动效 */
    .geo-sec{position:relative;overflow:hidden}
    .geo-sec::before{content:'';position:absolute;top:-180px;left:50%;transform:translateX(-50%);width:760px;height:520px;background:radial-gradient(closest-side,rgba(13,148,136,.13),transparent);pointer-events:none}
    .geo-sec .max-w-7xl{position:relative}
    .geo-answer{position:relative;background:var(--bg2);border:1px solid var(--border-l);border-radius:14px;padding:22px 24px;overflow:hidden;box-shadow:0 24px 60px -20px rgba(0,0,0,.55)}
    .geo-answer::after{content:'';position:absolute;top:0;bottom:0;left:-140px;width:120px;background:linear-gradient(100deg,transparent,rgba(20,184,166,.09),transparent);animation:geoScan 3.8s ease-in-out infinite;pointer-events:none}
    @keyframes geoScan{0%{left:-140px}55%,100%{left:calc(100% + 30px)}}
    .geo-q{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text2);border:1px solid var(--border);border-radius:10px;padding:10px 14px;margin-bottom:16px;background:rgba(0,0,0,.2)}
    .geo-a-head{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--brand-light);margin-bottom:8px;font-weight:600}
    .geo-a>p{font-size:13px;color:var(--text3);margin:0 0 12px}
    .geo-pick{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--border);border-radius:10px;margin-bottom:10px;font-size:13.5px;color:var(--text2);background:rgba(0,0,0,.15)}
    .geo-pick:last-child{margin-bottom:0}
    .geo-rank{width:20px;height:20px;border-radius:6px;background:var(--bg3);color:var(--text3);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
    .geo-pick-you{border-color:rgba(20,184,166,.5);background:rgba(13,148,136,.1)}
    .geo-pick-you .geo-rank{background:var(--brand);color:#fff}
    .geo-pick-you b{color:#fff;font-weight:600}
    .geo-pick-you i{display:block;font-style:normal;font-size:11.5px;color:var(--brand-light)}
    .geo-tag-you{margin-left:auto;font-size:11px;color:var(--brand-light);border:1px solid rgba(20,184,166,.4);border-radius:99px;padding:2px 8px;white-space:nowrap;animation:badgePulse 1.8s ease-in-out infinite}
    .geo-hl{display:flex;gap:16px;padding:20px 22px;border:1px solid var(--border);border-radius:12px;background:rgba(0,0,0,.12);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
    .geo-hl:hover{transform:translateY(-3px);border-color:var(--brand);box-shadow:0 10px 26px -10px rgba(13,148,136,.28)}
    .geo-hl h3{margin-bottom:6px}
    .geo-hl .geo-hl-ico{width:40px;height:40px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
    .geo-badge{border:1px solid rgba(20,184,166,.4)}
    .geo-h2{line-height:1.22}

    /* GEO 示意卡动态演示（2026-09-10）：JS 加 .geo-anim 后才隐藏条目，
       无 JS / 减少动效时直接呈现最终态；逐条 .in 上浮浮现 */
    .geo-anim .geo-reveal{opacity:0;transform:translateY(10px)}
    .geo-reveal{transition:opacity .45s ease,transform .45s ease}
    .geo-reveal.in{opacity:1;transform:none}
    .geo-punch{margin-top:14px;padding-top:12px;border-top:1px dashed var(--border-l);display:flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--brand-light)}
    .geo-punch small{font-weight:400;color:var(--text3);font-size:12px}

    /* GEO CTA 按钮效果（2026-09-10）：周期性流光扫过 + hover 浮起加深光晕 + 箭头右移；
       流光用内层 span 裁剪，保住 cta-pulse 的外圈脉冲不被 overflow 切掉 */
    .geo-cta{transition:transform .2s ease,box-shadow .25s ease,background-color .2s ease}
    .geo-cta:hover{transform:translateY(-2px);box-shadow:0 12px 30px -8px rgba(13,148,136,.55)}
    .geo-cta iconify-icon{transition:transform .2s ease}
    .geo-cta:hover iconify-icon{transform:translateX(3px)}
    .geo-cta-shine{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}
    .geo-cta-shine::after{content:'';position:absolute;top:-20%;bottom:-20%;left:-50%;width:36%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.26),transparent);transform:skewX(-18deg);animation:geoCtaShine 3.2s ease-in-out infinite}
    @keyframes geoCtaShine{0%{left:-50%}55%,100%{left:140%}}

    /* Reduced motion */
    @media(prefers-reduced-motion:reduce){
      .anim-up,.anim-fade{opacity:1;transform:none}
      .cta-pulse::before{animation:none}
      *{animation-duration:0.01ms!important;transition-duration:0.01ms!important}
    }


/* --------------------------------------------------------------------------
   友情链接区块（v48，Views/Home/Index.cshtml 底部版权上方；
   深色框架一致：细分隔线 + 小标签 + 灰链接 hover 品牌色）
   -------------------------------------------------------------------------- */
.friend-links{border-top:1px solid var(--border);padding:22px 20px 6px}
.friend-links-inner{max-width:80rem;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 18px}
.friend-links-label{font-size:12px;letter-spacing:.15em;color:var(--text3);border:1px solid var(--border-l);border-radius:999px;padding:3px 12px;white-space:nowrap}
.friend-links-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 22px}
.friend-links-row a{font-size:13px;color:var(--text2);text-decoration:none;transition:color .18s ease}
.friend-links-row a:hover{color:var(--brand-light)}
@media(max-width:767px){.friend-links{padding:16px 12px 4px}.friend-links-row{gap:6px 16px}}


/* --------------------------------------------------------------------------
   使用方法选项卡（2026-09-10 移动端适配）：按钮内图标+文字锁定一行不换行；
   移动端间距 32px→16px，极端窄屏允许横向滑动且隐藏滚动条
   -------------------------------------------------------------------------- */
.howto-tabs .tab-btn{white-space:nowrap;flex-shrink:0}
@media(max-width:767px){
  .howto-tabs{gap:16px;overflow-x:auto;scrollbar-width:none}
  .howto-tabs::-webkit-scrollbar{display:none}
}