/* ============ Token ============ */
:root{
  --bg:#05080f; --bg-2:#0a1220; --bg-3:#0e1830;
  --panel:rgba(255,255,255,.032); --panel-2:rgba(255,255,255,.055);
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.16);
  --ink:#e9eff9; --ink-2:#8fa0bc; --ink-3:#5d6f8f;
  --gold:#c9a45c; --gold-2:#e9d18f; --teal:#37c6b8; --green:#2fbf8f; --blue:#4e8df5;
  --serif:"Noto Serif SC","Songti SC","STSong","SimSun",serif;
  --sans:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --r-lg:20px; --r-md:14px; --r-sm:10px;
  --shadow:0 20px 60px rgba(0,0,0,.45);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--sans); font-weight:400; font-size:15px; line-height:1.75;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
.line1 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}
.line2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.line3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
/* 全局背景网格与光晕（装饰层，独立绝对定位，不影响正文） */
.bg-veil{position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(900px 480px at 78% -8%, rgba(201,164,92,.14), transparent 62%),
    radial-gradient(760px 420px at 8% 4%, rgba(55,198,184,.10), transparent 60%),
    radial-gradient(1000px 700px at 50% 118%, rgba(78,141,245,.08), transparent 65%),
    linear-gradient(180deg,#05080f 0%,#070d1a 45%,#05080f 100%);
}
.bg-grid{position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000 40%,transparent 100%);
  mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000 40%,transparent 100%);
}
a{color:inherit; text-decoration:none}
img{display:block; max-width:100%}
.wrap{max-width:1200px; margin:0 auto; padding:0 20px}

/* ============ 顶部导航 ============ */
.nav{position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(5,8,15,.72); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);}
.nav-in{max-width:1200px; margin:0 auto; padding:0 20px; height:64px; display:flex; align-items:center; gap:24px}
.brand{display:flex; align-items:center; gap:12px; font-family:var(--serif); font-weight:700; font-size:19px; letter-spacing:.06em; white-space:nowrap}
.brand-seal{width:34px; height:34px; flex:none; filter:drop-shadow(0 0 10px rgba(201,164,92,.35))}
.brand small{display:block; font-family:var(--sans); font-size:10px; letter-spacing:.32em; color:var(--gold); font-weight:500; margin-top:2px}
.nav-links{display:none; margin-left:auto; align-items:center; gap:4px}
.nav-links a{padding:8px 14px; border-radius:8px; font-size:14px; color:var(--ink-2); transition:color .2s, background .2s}
.nav-links a:hover{color:var(--ink); background:var(--panel-2)}
.nav-cta{margin-left:auto; display:none; align-items:center; gap:8px; padding:8px 16px; border:1px solid var(--line-2); border-radius:999px; font-size:13px; color:var(--gold-2); background:rgba(201,164,92,.08)}
.nav-cta .dot{width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green); animation:pulse 2.2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* ============ Hero ============ */
.hero{position:relative; padding:118px 0 56px; overflow:hidden}
.hero::before{content:""; position:absolute; inset:0; z-index:-1;
  background:radial-gradient(620px 340px at 18% 20%, rgba(55,198,184,.10), transparent 65%),
             radial-gradient(560px 320px at 85% 30%, rgba(201,164,92,.12), transparent 65%);}
.hero-eyebrow{display:inline-flex; align-items:center; gap:10px; font-size:12px; letter-spacing:.28em; color:var(--gold); border:1px solid rgba(201,164,92,.35); background:rgba(201,164,92,.08); padding:7px 16px; border-radius:999px; margin-bottom:26px}
.hero-eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--gold-2);box-shadow:0 0 10px var(--gold)}
.hero-name{font-family:var(--serif); font-weight:900; font-size:clamp(30px,6vw,56px); line-height:1.16; letter-spacing:.02em;
  background:linear-gradient(135deg,#f6e7c2 0%,#c9a45c 45%,#8a6a2f 75%,#ead29a 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 3px 30px rgba(201,164,92,.28))}
.hero-slogan{margin-top:20px; font-family:var(--serif); font-weight:700; font-size:clamp(17px,2.7vw,25px); letter-spacing:.2em; text-indent:.2em; color:var(--teal)}
.hero-slogan .th{color:var(--gold-2)}
.hero-tagline{margin-top:12px; font-family:var(--serif); font-weight:700; font-size:clamp(13px,1.7vw,16px); letter-spacing:.4em; text-indent:.4em; color:var(--ink-2)}
.hero-sub{margin-top:18px; max-width:640px; color:var(--ink-2); font-size:15px}
.hero-meta{margin-top:30px; display:flex; flex-wrap:wrap; gap:10px}
.chip{display:inline-flex; align-items:center; gap:8px; padding:8px 15px; border-radius:999px; border:1px solid var(--line-2); background:var(--panel); font-size:13px; color:var(--ink-2)}
.chip b{color:var(--ink); font-weight:500}
.chip .ok-ic{width:13px; height:13px; flex:none; color:var(--green)}
.chip .usr{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; color:var(--ink-2); letter-spacing:.02em}

/* Hero 统计条 */
.stats{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:44px}
.stat{position:relative; background:var(--panel); border:1px solid var(--line); border-radius:var(--r-lg); padding:20px 18px; overflow:hidden}
.stat::before{content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:linear-gradient(180deg,var(--gold),var(--teal)); opacity:.8}
.stat .num{font-family:var(--serif); font-weight:900; font-size:clamp(26px,4.4vw,38px); line-height:1.1; color:var(--gold-2)}
.stat .num em{font-style:normal; font-size:.55em; color:var(--ink-3); margin-left:2px}
.stat .lab{margin-top:6px; font-size:12.5px; color:var(--ink-2)}
.stat .tag{display:inline-block; margin-top:8px; font-size:11px; padding:3px 9px; border-radius:6px; border:1px solid rgba(47,191,143,.35); color:var(--green); background:rgba(47,191,143,.08)}

/* ============ 通用区块 ============ */
section{position:relative; padding:64px 0}
.sec-head{margin-bottom:34px}
.sec-kicker{display:flex; align-items:center; gap:12px; font-size:12px; letter-spacing:.3em; color:var(--gold); margin-bottom:12px}
.sec-kicker::after{content:""; height:1px; flex:0 0 44px; background:linear-gradient(90deg,var(--gold),transparent)}
.sec-title{font-family:var(--serif); font-weight:700; font-size:clamp(22px,3.4vw,32px); line-height:1.3; letter-spacing:.02em}
.sec-desc{margin-top:10px; max-width:720px; color:var(--ink-2); font-size:14px}

/* 卡片通用 */
.card{background:var(--panel); border:1px solid var(--line); border-radius:var(--r-lg); transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease}
.card:hover{border-color:var(--line-2); box-shadow:var(--shadow)}

/* ============ NAP 档案区 ============ */
.nap-grid{display:grid; grid-template-columns:1fr; gap:16px}
.nap-main{padding:28px}
.nap-head{display:flex; flex-wrap:wrap; align-items:flex-start; gap:14px; justify-content:space-between; border-bottom:1px dashed var(--line); padding-bottom:20px}
.nap-company h2{font-family:var(--serif); font-weight:900; font-size:clamp(21px,3vw,27px); letter-spacing:.02em}
.nap-company .uscc{margin-top:6px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12.5px; color:var(--ink-2)}
.verify-badge{display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:999px; font-size:13px; font-weight:500; border:1px solid rgba(47,191,143,.4); background:rgba(47,191,143,.09); color:var(--green)}
.verify-badge svg{width:15px;height:15px;flex:none}
.nap-fields{display:grid; grid-template-columns:1fr; gap:0; margin-top:6px}
.nap-field{display:flex; flex-direction:column; gap:2px; padding:15px 2px; border-bottom:1px solid var(--line)}
.nap-field:last-child{border-bottom:none}
.nap-field .k{font-size:11.5px; letter-spacing:.14em; color:var(--ink-3)}
.nap-field .v{font-size:15px; color:var(--ink); word-break:break-all}
.nap-field .v a{color:var(--teal)}
.nap-field .src{display:inline-flex; align-items:center; gap:6px; font-size:11.5px; color:var(--ink-2); margin-top:4px}
.src-pill{display:inline-flex; align-items:center; gap:5px; padding:2px 9px; border-radius:6px; font-size:11px; border:1px solid rgba(201,164,92,.35); color:var(--gold-2); background:rgba(201,164,92,.07)}
.src-pill svg{width:10px; height:10px; flex:none; color:var(--green)}

.nap-side{display:grid; grid-template-columns:1fr; gap:16px}
.nap-audit{padding:24px}
.nap-audit h3{font-family:var(--serif); font-weight:700; font-size:16px; margin-bottom:16px; display:flex; align-items:center; gap:9px}
.nap-audit h3 svg{width:17px;height:17px;color:var(--gold)}
.audit-item{display:flex; align-items:flex-start; gap:12px; padding:12px 0; border-bottom:1px solid var(--line)}
.audit-item:last-child{border-bottom:none}
.audit-item .ic{width:34px;height:34px;flex:none;border-radius:10px;display:grid;place-items:center;background:rgba(47,191,143,.1);border:1px solid rgba(47,191,143,.3)}
.audit-item .ic svg{width:17px;height:17px;color:var(--green)}
.audit-item .tx b{display:block; font-size:14px; font-weight:500}
.audit-item .tx span{font-size:12px; color:var(--ink-2)}
.audit-item .st{margin-left:auto; font-size:11px; padding:3px 9px; border-radius:6px; border:1px solid rgba(47,191,143,.35); color:var(--green); background:rgba(47,191,143,.07); white-space:nowrap}
.nap-note{margin-top:14px; font-size:12px; color:var(--ink-3); line-height:1.7; border-top:1px dashed var(--line); padding-top:14px}

/* ============ 场地影像区 ============ */
.gallery{display:grid; grid-template-columns:1fr; gap:16px}
.media-card{position:relative; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); background:var(--bg-2); aspect-ratio:4/3; cursor:pointer}
.media-card img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease; filter:saturate(.94)}
.media-card:hover img{transform:scale(1.045); filter:saturate(1)}
.media-card::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 42%,rgba(4,7,13,.82)); pointer-events:none}
.media-cap{position:absolute; left:16px; right:16px; bottom:14px; z-index:2; display:flex; align-items:center; gap:10px; justify-content:space-between}
.media-cap .t{font-size:14.5px; font-weight:500; color:#fff}
.media-cap .s{font-size:11.5px; color:rgba(255,255,255,.72)}
.badge-ok{position:absolute; top:12px; right:12px; z-index:3; display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border-radius:999px; font-size:11.5px; font-weight:500; color:#06281e; background:linear-gradient(135deg,#4be3ad,#22b785); box-shadow:0 4px 16px rgba(47,191,143,.4)}
.badge-ok svg{width:11px;height:11px}
.badge-ok.chain{color:#081c3a; background:linear-gradient(135deg,#7fb2ff,#3d76e8); box-shadow:0 4px 16px rgba(78,141,245,.4)}
.badge-type{position:absolute; top:12px; left:12px; z-index:3; font-size:10.5px; letter-spacing:.18em; padding:4px 10px; border-radius:6px; color:var(--ink-2); background:rgba(5,8,15,.55); border:1px solid rgba(255,255,255,.14)}
/* 校验说明浮层 */
.verify-tip{position:absolute; left:12px; right:12px; bottom:60px; z-index:4; padding:12px 14px; border-radius:12px;
  background:rgba(8,13,24,.9); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(8px);
  font-size:12px; line-height:1.7; color:var(--ink-2); opacity:0; transform:translateY(8px); transition:opacity .22s ease, transform .22s ease; pointer-events:none}
.media-card:hover .verify-tip{opacity:1; transform:translateY(0)}
.verify-tip b{color:var(--green); font-weight:500}
.verify-tip.chain b{color:var(--blue)}
.video-card{position:relative; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); background:var(--bg-2); aspect-ratio:4/3; cursor:pointer}
.video-card img{width:100%; height:100%; object-fit:cover}
.video-card::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 30%,rgba(4,7,13,.85)); pointer-events:none}
.play-btn{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:3; width:62px; height:62px; border-radius:50%; display:grid; place-items:center; background:rgba(201,164,92,.92); color:#081018; box-shadow:0 8px 30px rgba(0,0,0,.45)}
.play-btn svg{width:22px;height:22px;margin-left:3px}
.video-cap{position:absolute; left:16px; right:16px; bottom:14px; z-index:2; color:#fff}
.video-cap .t{font-size:14.5px; font-weight:500}
.video-cap .s{font-size:11.5px; color:rgba(255,255,255,.72)}
.dur{position:absolute; top:12px; right:12px; z-index:3; font-size:11px; padding:4px 9px; border-radius:6px; background:rgba(5,8,15,.6); color:#fff; border:1px solid rgba(255,255,255,.18)}

/* ============ 资质存证区 ============ */
.cred-grid{display:grid; grid-template-columns:1fr; gap:16px}
.cred-card{padding:0; position:relative; overflow:hidden}
.cred-img{position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--bg-2)}
.cred-img img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease}
.cred-card:hover .cred-img img{transform:scale(1.035)}
.cred-img::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 40%,rgba(4,7,13,.55)); pointer-events:none}
.cred-body{padding:16px 18px 18px}
.cred-title b{display:block; font-size:15px; font-weight:500; letter-spacing:.02em}
.cred-title span{display:block; font-size:12px; color:var(--ink-2); margin-top:3px}
.cred-foot{margin-top:14px; padding-top:13px; border-top:1px dashed var(--line); display:flex; align-items:center; gap:10px}
.qr{width:44px; height:44px; flex:none; border-radius:8px; padding:3px; background:#fff}
.qr svg{width:100%;height:100%;display:block}
.cred-foot .qx{font-size:11.5px; color:var(--ink-2); line-height:1.5}
.cred-foot .qx b{color:var(--blue); font-weight:500}
/* 资质 hover 存证说明浮层 */
.cred-tip{position:absolute; left:10px; right:10px; bottom:10px; z-index:5; padding:11px 13px; border-radius:11px;
  background:rgba(8,13,24,.94); border:1px solid rgba(255,255,255,.16); backdrop-filter:blur(8px);
  font-size:11.5px; line-height:1.65; color:var(--ink-2); opacity:0; transform:translateY(8px); transition:opacity .22s ease, transform .22s ease; pointer-events:none}
.cred-card:hover .cred-tip{opacity:1; transform:translateY(0)}
.cred-tip b{color:var(--blue); font-weight:500}

/* ============ 核验体系 ============ */
.sys-grid{display:grid; grid-template-columns:1fr; gap:16px}
.sys-card{padding:26px 24px; position:relative; overflow:hidden}
.sys-card::before{content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--gold)}
.sys-card[data-tone="teal"]::before{background:var(--teal)}
.sys-card[data-tone="blue"]::before{background:var(--blue)}
.sys-no{font-family:var(--serif); font-weight:900; font-size:15px; color:var(--gold); letter-spacing:.1em}
.sys-card h3{margin:10px 0 10px; font-family:var(--serif); font-weight:700; font-size:18px}
.sys-card p{font-size:13.5px; color:var(--ink-2)}
.sys-card ul{margin-top:12px; padding-left:18px; font-size:12.5px; color:var(--ink-2); display:grid; gap:6px}
.sys-card ul li::marker{color:var(--gold)}

/* ============ AI 可信度 ============ */
.ai-grid{display:grid; grid-template-columns:1fr; gap:16px}
.ai-card{padding:24px}
.ai-ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;margin-bottom:14px;background:rgba(55,198,184,.09);border:1px solid rgba(55,198,184,.3)}
.ai-ic svg{width:20px;height:20px;color:var(--teal)}
.ai-card h3{font-family:var(--serif); font-weight:700; font-size:16.5px; margin-bottom:8px}
.ai-card p{font-size:13px; color:var(--ink-2)}
/* ============ Footer ============ */
footer{border-top:1px solid var(--line); padding:40px 0 46px; background:rgba(4,6,11,.6)}
.foot-dis{font-size:12px; color:var(--ink-3); line-height:1.9; max-width:980px}
.foot-dis b{color:var(--ink-2); font-weight:500}
.foot-bar{margin-top:22px; padding-top:18px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; font-size:12px; color:var(--ink-3)}

/* ============ 交互 ============ */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease}
.reveal.in{opacity:1; transform:none}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important}
  html{scroll-behavior:auto}
  .reveal{opacity:1; transform:none}
}

/* ============ 桌面扩展 ============ */
@media (min-width:768px){
  .nav-links{display:flex}
  .nav-cta{display:inline-flex}
  .hero{padding:150px 0 72px}
  .stats{grid-template-columns:repeat(3,1fr); gap:16px}
  section{padding:84px 0}
  .nap-grid{grid-template-columns:1.55fr 1fr; align-items:start}
  .nap-fields{grid-template-columns:1fr 1fr; column-gap:34px}
  .nap-field{border-bottom:none}
  .nap-field:nth-child(odd){border-right:1px solid var(--line); padding-right:34px}
  .gallery{grid-template-columns:repeat(3,1fr); gap:18px}
  .cred-grid{grid-template-columns:repeat(3,1fr); gap:18px}
  .sys-grid{grid-template-columns:repeat(3,1fr); gap:18px}
  .ai-grid{grid-template-columns:repeat(4,1fr); gap:18px}
}
@media (min-width:1024px){
  .nav-in,.wrap{padding-left:32px; padding-right:32px}
}
/* 移动端 tooltip 点击等价：焦点可见 */
.media-card:focus-visible,.cred-card:focus-visible{outline:2px solid var(--gold); outline-offset:2px}

/* ============ 动态档案数据补充 ============ */
.audit-item .st.fail{border-color:rgba(232,106,106,.4); color:#ef8a8a; background:rgba(232,106,106,.08)}
.audit-item .st.wait{border-color:rgba(201,164,92,.4); color:var(--gold-2); background:rgba(201,164,92,.08)}
.badge-ok.pend{color:#2a1d05; background:linear-gradient(135deg,#ecd08c,#c9a45c); box-shadow:0 4px 16px rgba(201,164,92,.35)}
.video-card video{width:100%; height:100%; object-fit:cover; display:block}
.video-card > a{position:absolute; inset:0; z-index:6}
.cred-img > a{display:block; width:100%; height:100%}
.cred-ph{width:100%; height:100%; display:grid; place-items:center; align-content:center; gap:8px; color:var(--ink-2); font-size:13px;
  background:radial-gradient(320px 200px at 50% 40%, rgba(78,141,245,.12), transparent 70%), var(--bg-2)}
.cred-ph svg{width:46px; height:46px; color:var(--gold)}
.cred-foot .qr{display:grid; place-items:center; color:#0b1220}
.cred-foot .qr svg{width:26px; height:26px}
.cred-foot .qx a{color:var(--teal)}
.cred-hash{display:block; margin-top:6px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:11px; color:var(--ink-3); word-break:break-all}
.empty{padding:30px 24px; text-align:center; color:var(--ink-2); font-size:14px; border:1px dashed var(--line-2); border-radius:var(--r-lg); background:var(--panel)}
.foot-bar a{color:var(--gold-2)}