/* AI 模型服务弹层样式（V9 蓝图工程版，从 ai/v9 内联样式 + ai/base.css 移植）
   作用域挂在 .ai-model-nav（.service-nav 弹层体系）下，不影响页面与其他遮罩。
   弹层壳沿用 .service-nav 全屏深色底，内部用 ai-wrap 容器滚动。 */

/* ---------- 弹层壳 ---------- */
.ai-model-nav{
    /* .service-nav 自带全屏黑底 + z-index:6 + 右上角关闭按钮 */
    font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
    --bg:#0e1c33; --ink:#eaf2ff;
    --ac:#5ea8ff; --ac2:#ffd36e;
    --card:rgba(16,36,64,.6); --line:rgba(94,168,255,.3);
    --glow:rgba(94,168,255,.14);
    background:
        radial-gradient(60% 40% at 50% 0%, rgba(94,168,255,.12), transparent 70%),
        linear-gradient(180deg,#0e1c33,#0a1426);
    color: var(--ink);
    overflow-x: hidden;
}
.ai-model-nav .service-inner{
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.ai-model-nav .fx-bg{
    position: fixed; inset: 0; pointer-events: none; z-index: 0; opacity: .5;
    background-image:linear-gradient(rgba(94,168,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(94,168,255,.06) 1px,transparent 1px),
        linear-gradient(rgba(94,168,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(94,168,255,.03) 1px,transparent 1px);
    background-size:160px 160px,160px 160px,32px 32px,32px 32px;
}
.ai-model-nav .ai-wrap{
    position: relative; z-index: 1;
    max-width: 1120px; margin: 0 auto; padding: 84px 28px 60px;
    color: var(--ink);
}
.ai-model-nav a{ color: inherit; text-decoration: none; }

/* ---------- HERO ---------- */
.ai-model-nav .hero{ text-align:left; padding:30px 0 30px; }
.ai-model-nav .hero-kicker{ font-family:Consolas,monospace; font-size:12px; letter-spacing:6px; color:var(--ac2); }
.ai-model-nav .hero-kicker:before{ content:"// "; }
.ai-model-nav .hero-title{ margin-top:22px; font-size:52px; line-height:1.3; font-weight:700; letter-spacing:1px; }
.ai-model-nav .hero-title em{ font-style:normal; color:var(--ac); }
.ai-model-nav .hero-sub{ max-width:680px; margin:20px 0 0; font-size:15px; line-height:28px; color:rgba(234,242,255,.6); font-family:Consolas,monospace; }
.ai-model-nav .hero-cta-row{ display:flex; gap:16px; margin-top:36px; flex-wrap:wrap; }
.ai-model-nav .hero-cta{ padding:14px 30px; border-radius:6px; font-size:15px; letter-spacing:1px; transition:all .25s; }
.ai-model-nav .hero-cta.primary{ background:#5ea8ff; color:#06121f; box-shadow:0 8px 30px rgba(94,168,255,.35); }
.ai-model-nav .hero-cta.ghost{ border:1px solid var(--line); color:rgba(234,242,255,.85); }
.ai-model-nav .hero-cta:hover{ transform:translateY(-2px); }
.ai-model-nav .gift-tip{ display:inline-flex; align-items:center; gap:14px; margin-top:40px; padding:12px 22px;
  border:1px dashed rgba(255,211,110,.5); border-radius:6px; background:rgba(255,211,110,.04); font-size:14px; color:rgba(234,242,255,.85); flex-wrap:wrap; }
.ai-model-nav .gift-tip i{ font-style:normal; font-family:Consolas,monospace; font-size:11px; letter-spacing:2px; color:var(--ac2); }
.ai-model-nav .gift-tip b{ color:var(--ac2); }
.ai-model-nav .gift-tip em{ font-style:normal; font-size:16px; color:#fff; }

/* ---------- 模型双卡 ---------- */
.ai-model-nav .models{ display:grid; grid-template-columns:1fr 1fr; gap:22px; margin:54px 0 0; }
.ai-model-nav .model-card{
    position:relative; display:block; overflow:hidden;
    padding:34px 30px 28px; border:1px solid var(--line); border-radius:6px;
    background:var(--card);
    transition: transform .3s, border-color .3s, box-shadow .3s;
}
.ai-model-nav .model-card:before{ content:""; position:absolute; top:10px; left:10px; width:14px; height:14px;
  border:1px solid rgba(94,168,255,.6); border-radius:50%; }
.ai-model-nav .model-card:hover{ transform:translateY(-4px); border-color:var(--ac); box-shadow:0 18px 50px rgba(0,0,0,.45), 0 0 30px var(--glow); }
.ai-model-nav .m-tag{ position:absolute; top:20px; right:20px; font-family:Consolas,monospace; font-size:11px;
    letter-spacing:2px; padding:4px 12px; border:1px solid var(--line); border-radius:3px; color:var(--ac2); }
.ai-model-nav .m-name{ font-size:30px; font-weight:800; letter-spacing:.5px;
    background:linear-gradient(120deg,#fff, var(--ac2)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.ai-model-nav .m-en{ margin-top:4px; font-family:Consolas,monospace; font-size:12px; color:rgba(234,242,255,.4); letter-spacing:1px; }
.ai-model-nav .m-line{ display:flex; gap:22px; margin-top:20px; flex-wrap:wrap; font-size:13px; color:rgba(234,242,255,.75); }
.ai-model-nav .m-line b{ font-weight:400; color:var(--ac2); }
.ai-model-nav .m-desc{ margin-top:16px; font-size:14px; line-height:24px; color:rgba(234,242,255,.6); }
.ai-model-nav .m-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.ai-model-nav .m-tags i{ font-style:normal; font-size:12px; padding:4px 10px; border-radius:6px;
    background:rgba(94,168,255,.14); border:1px solid var(--line); color:rgba(234,242,255,.8); }
.ai-model-nav .m-cta{ display:inline-block; margin-top:20px; font-size:14px; color:var(--ac2);
    border:1px solid var(--line); border-radius:6px; padding:9px 22px; transition:all .25s; }
.ai-model-nav .model-card:hover .m-cta{ background:var(--ac); border-color:var(--ac); color:#06121f; }
.ai-model-nav .price{ margin-top:14px; font-family:Consolas,monospace; font-size:13px; color:rgba(234,242,255,.85); }
.ai-model-nav .price em{ font-style:normal; font-size:26px; color:#fff; margin:0 4px; }

/* ---------- Token 查询 ---------- */
.ai-model-nav .token-box{ margin-top:70px; border:1px solid var(--line); border-radius:16px; padding:38px 36px;
    background:var(--card); position:relative; overflow:hidden; }
.ai-model-nav .token-box:before{ content:""; position:absolute; inset:0 0 auto 0; height:1px;
    background:linear-gradient(90deg,transparent,var(--ac),transparent); }
.ai-model-nav .token-box h3{ font-size:22px; letter-spacing:1px; }
.ai-model-nav .t-sub{ margin-top:8px; font-size:13px; color:rgba(234,242,255,.5); }
.ai-model-nav .t-row{ display:flex; gap:14px; margin-top:22px; flex-wrap:wrap; }
.ai-model-nav .t-row input{
    background:rgba(0,0,0,.35); border:1px solid var(--line); border-radius:10px;
    color:var(--ink); font-size:14px; padding:12px 16px; outline:none; transition:border-color .2s;
    flex:1; min-width:280px; font-family:Consolas,monospace;
}
.ai-model-nav .t-row input:focus{ border-color:var(--ac); }
.ai-model-nav .t-row button{ border:none; border-radius:10px; padding:12px 34px; font-size:14px; cursor:pointer;
    background:linear-gradient(120deg,var(--ac),#2e6ae0); color:#fff; letter-spacing:2px; transition:filter .2s, transform .2s; }
.ai-model-nav .t-row button:hover{ filter:brightness(1.15); transform:translateY(-1px); }
.ai-model-nav .t-row button:disabled{ opacity:.6; cursor:wait; }
.ai-model-nav .t-result{ display:none; margin-top:24px; padding:20px 22px; border:1px solid var(--line); border-radius:12px;
    background:rgba(0,0,0,.3); font-family:Consolas,monospace; }
.ai-model-nav .r-head{ font-size:13px; color:var(--ac2); letter-spacing:2px; }
.ai-model-nav .r-main{ display:flex; gap:16px; margin-top:14px; flex-wrap:wrap; }
.ai-model-nav .r-main .num{ font-size:34px; color:#fff; }
.ai-model-nav .r-main .unit{ font-size:13px; color:rgba(234,242,255,.5); margin-top:20px; }
.ai-model-nav .r-bar{ margin-top:14px; height:6px; border-radius:6px; background:rgba(255,255,255,.08); overflow:hidden; }
.ai-model-nav .r-bar i{ display:block; height:100%; width:60%; border-radius:6px;
    background:linear-gradient(90deg,var(--ac),var(--ac2)); }
.ai-model-nav .r-note{ margin-top:10px; font-size:12px; color:rgba(234,242,255,.4); }
.ai-model-nav .t-err{ display:none; margin-top:16px; padding:14px 18px; border:1px solid rgba(255,99,99,.35);
  border-radius:10px; background:rgba(255,99,99,.07); font-size:14px; color:#ff9a9a; }

/* ---------- 联系区 ---------- */
.ai-model-nav .contact{ margin:70px 0 10px; text-align:center; border:1px solid var(--line); border-radius:16px;
    padding:44px 30px; background:var(--card); }
.ai-model-nav .contact h3{ font-size:26px; letter-spacing:1px; }
.ai-model-nav .contact p{ margin-top:10px; font-size:14px; color:rgba(234,242,255,.55); }
.ai-model-nav .c-row{ display:flex; justify-content:center; gap:18px; margin-top:24px; flex-wrap:wrap; }
.ai-model-nav .c-btn{ display:inline-block; border:1px solid var(--line); border-radius:6px; padding:12px 30px;
    font-size:15px; letter-spacing:1px; transition:all .25s; }
.ai-model-nav .c-btn.wechat{ background:linear-gradient(120deg,#17c964,#0e9f4d); border-color:transparent; color:#fff; }
.ai-model-nav .c-btn.tel{ background:linear-gradient(120deg,var(--ac),#2e6ae0); border-color:transparent; color:#fff; }
.ai-model-nav .c-btn:hover{ transform:translateY(-2px); filter:brightness(1.12); }

/* ---------- 页脚 ---------- */
.ai-model-nav .ai-footer{ border-top:1px solid var(--line); margin-top:30px; padding:26px 0 20px;
    text-align:center; font-size:13px; color:rgba(234,242,255,.35); }

/* ---------- 响应式 ---------- */
@media (max-width:860px){
    .ai-model-nav .models{ grid-template-columns:1fr; }
    .ai-model-nav .hero-title{ font-size:36px; }
    .ai-model-nav .ai-wrap{ padding:70px 18px 50px; }
}

/* ---------- 接入方式（接口地址 + 模型 id） ---------- */
.ai-model-nav .ai-api{
    margin-top:70px; border:1px solid var(--line); border-radius:16px; padding:38px 36px;
    background:var(--card); position:relative; overflow:hidden;
}
.ai-model-nav .ai-api:before{ content:""; position:absolute; inset:0 0 auto 0; height:1px;
    background:linear-gradient(90deg,transparent,var(--ac),transparent); }
.ai-model-nav .ai-api h3{ font-size:22px; letter-spacing:1px; }
.ai-model-nav .api-row{ display:flex; align-items:center; gap:18px; margin-top:18px; flex-wrap:wrap; }
.ai-model-nav .api-label{ flex:none; width:170px; font-size:14px; color:rgba(234,242,255,.6); }
.ai-model-nav .api-val{ flex:1; min-width:300px; display:flex; align-items:center; gap:12px;
    padding:11px 16px; background:rgba(0,0,0,.35); border:1px solid var(--line); border-radius:8px; }
.ai-model-nav .api-val code{ flex:1; font-size:14px; letter-spacing:.5px; color:var(--ac2); word-break:break-all; }
.ai-model-nav .api-copy{ flex:none; border:1px solid var(--line); border-radius:6px; background:transparent;
    color:rgba(234,242,255,.75); font-size:12px; letter-spacing:1px; padding:5px 14px; cursor:pointer; transition:all .2s; }
.ai-model-nav .api-copy:hover{ border-color:var(--ac); color:var(--ac2); }
.ai-model-nav .api-copy.copied{ background:var(--ac); border-color:var(--ac); color:#06121f; }
.ai-model-nav .api-note{ margin-top:16px; font-size:12px; color:rgba(234,242,255,.4); line-height:20px; }

@media (max-width:860px){
    .ai-model-nav .api-label{ width:100%; }
    .ai-model-nav .api-val{ min-width:0; }
}