/* ==========================================
   羚羊工业互联网平台 — 完全对照截图重写 v3
   ========================================== */

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
  --nav-bg:#060b18;
  --hero-from:#122d7a;
  --hero-to:#2563eb;
  --footer-bg:#060b18;
  --primary:#1d4ed8;
  --primary-l:#3b82f6;
  --txt:#1e293b;
  --txt2:#64748b;
  --txt3:#94a3b8;
  --bdr:#e2e8f0;
  --bg:#f1f5f9;
  --w:#fff;
  --sh:0 1px 2px rgba(0,0,0,.04),0 1px 3px rgba(0,0,0,.06);
  --sh-md:0 4px 8px rgba(0,0,0,.06),0 2px 4px rgba(0,0,0,.05);
  --sh-lg:0 8px 16px rgba(0,0,0,.08),0 4px 8px rgba(0,0,0,.04);
  --r:8px;
  --mw:1200px;
  --nav-h:56px
}

body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Helvetica Neue",sans-serif;
  color:var(--txt);background:var(--w);font-size:14px;line-height:1.6;
  -webkit-font-smoothing:antialiased
}
a{text-decoration:none;color:inherit}
ul,ol{list-style:none}
img{max-width:100%;display:block}
.container{max-width:var(--mw);margin:0 auto;padding:0 24px}

/* ====== NAV ====== */
.top-bar{
  background:var(--nav-bg);height:var(--nav-h);position:fixed;
  top:0;left:0;right:0;z-index:1000
}
.top-bar .container{display:flex;align-items:center;height:100%;gap:32px}
.top-bar .logo{display:flex;align-items:center;gap:8px;color:#fff;font-size:15px;font-weight:600;white-space:nowrap;flex-shrink:0}
.top-bar .logo .logo-icon{width:28px;height:28px;background:var(--primary);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:14px}
.top-bar .nav-links{display:flex;align-items:center;height:100%;gap:0}
.top-bar .nav-links a{color:rgba(255,255,255,.72);padding:0 14px;height:100%;display:flex;align-items:center;font-size:13px;white-space:nowrap;transition:.15s;position:relative}
.top-bar .nav-links a:hover,.top-bar .nav-links a.active{color:#fff}
.top-bar .nav-links a.active::after{content:'';position:absolute;bottom:0;left:12px;right:12px;height:2px;background:var(--primary-l);border-radius:1px 1px 0 0}
.top-bar .header-actions{margin-left:auto;display:flex;align-items:center;gap:14px;flex-shrink:0}
.top-bar .btn-register{padding:4px 14px;border:1px solid rgba(255,255,255,.35);border-radius:4px;color:#fff;font-size:12px;transition:.15s;white-space:nowrap}
.top-bar .btn-register:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.6)}
.top-bar .btn-login{color:rgba(255,255,255,.75);font-size:12px;transition:.15s;white-space:nowrap}
.top-bar .btn-login:hover{color:#fff}

/* ====== HERO ====== */
.hero{
  margin-top:var(--nav-h);
  background:linear-gradient(160deg, #0f2668 0%, #1a4bd6 40%, #2563eb 70%, #3b82f6 100%);
  padding:60px 0 70px;position:relative;overflow:hidden
}
.hero::before{content:'';position:absolute;top:-70px;right:-90px;width:380px;height:380px;border-radius:50%;background:rgba(255,255,255,.025)}
.hero::after{content:'';position:absolute;bottom:-50px;right:160px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.02)}
.hero .container{position:relative;z-index:1;display:flex;align-items:center;gap:40px}
.hero-content{flex:1;color:#fff}
.hero-content h1{font-size:32px;font-weight:700;margin-bottom:4px;letter-spacing:.5px}
.hero-content .hero-subtitle{font-size:16px;opacity:.82;margin-bottom:24px}
.hero-search{display:flex;max-width:460px;margin-bottom:28px;border-radius:6px;overflow:hidden;box-shadow:0 4px 18px rgba(0,0,0,.14);background:#fff}
.hero-search input{flex:1;padding:11px 16px;border:none;font-size:13px;outline:none;color:var(--txt);min-width:0}
.hero-search input::placeholder{color:#94a3b8}
.hero-search button{padding:11px 22px;background:#fff;color:var(--primary);border:none;border-left:1px solid #e8ecf1;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .15s}
.hero-search button:hover{background:#f8fafc}
.hero-stats{display:flex;gap:40px}
.hero-stats .stat-item{text-align:center}
.hero-stats .stat-number{font-size:24px;font-weight:700;line-height:1.2}
.hero-stats .stat-label{font-size:12px;opacity:.7;margin-top:2px}
.hero-visual{flex:0 0 380px;display:flex;align-items:center;justify-content:center}
.hero-mockup{width:360px;background:rgba(255,255,255,.08);border-radius:10px;padding:20px 16px 14px;border:1px solid rgba(255,255,255,.1)}
.hero-mockup .mdots{display:flex;gap:5px;margin-bottom:12px}
.hero-mockup .mdot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.45)}
.hero-mockup .mrow{display:flex;gap:8px;margin-bottom:8px}
.hero-mockup .mblk{height:48px;background:rgba(255,255,255,.1);border-radius:4px;flex:1}
.hero-mockup .mln{height:28px;background:rgba(255,255,255,.06);border-radius:3px;margin-bottom:6px}
.hero-mockup .mln.s1{width:58%}.hero-mockup .mln.s2{width:40%}

/* ====== SECTIONS ====== */
.sec{padding:50px 0}
.sec-gray{background:var(--bg)}
.sec-ttl{font-size:24px;font-weight:700;color:var(--txt);text-align:center;margin-bottom:6px}
.sec-sub{text-align:center;color:var(--txt2);font-size:13px;margin-bottom:32px}

/* ====== CARDS ====== */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:var(--w);border-radius:var(--r);padding:22px 20px;box-shadow:var(--sh);border:1px solid #f1f5f9;transition:.2s;display:block;color:inherit}
.card:hover{transform:translateY(-2px);box-shadow:var(--sh-lg);border-color:#dbeafe}
.card .cicon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:12px}
.cicon.bl{background:#eff6ff;color:#2563eb}.cicon.gr{background:#ecfdf5;color:#059669}
.cicon.or{background:#fffbeb;color:#d97706}.cicon.tl{background:#f0fdfa;color:#0d9488}
.cicon.pu{background:#f5f3ff;color:#7c3aed}.cicon.rd{background:#fef2f2;color:#dc2626}
.card h3{font-size:15px;font-weight:600;margin-bottom:4px;color:var(--txt)}
.card p{font-size:12px;color:var(--txt2);line-height:1.55}

/* ====== KE CHAN ====== */
.kechan{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.kc-col{background:var(--w);border-radius:var(--r);padding:20px 22px;box-shadow:var(--sh);border:1px solid #f1f5f9}
.kc-col .kchd{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--bdr)}
.kc-col .kchd h4{font-size:15px;font-weight:600}
.kc-col .kchd .more{font-size:12px;color:var(--primary-l);transition:.15s}
.kc-col .kchd .more:hover{color:var(--primary)}
.kc-list li{display:flex;justify-content:space-between;align-items:center;padding:9px 0;gap:10px}
.kc-list li+li{border-top:1px dashed #e8ecf1}
.kc-list .kt{flex:1;font-size:13px;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .15s}
.kc-list .kt:hover{color:var(--primary)}
.kc-list .kd{font-size:11px;color:var(--txt3);white-space:nowrap}

/* ====== NEWS ====== */
.news{display:grid;grid-template-columns:1fr 300px;gap:20px}
.news-main{background:var(--w);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden}
.news-tabs{display:flex;border-bottom:1px solid var(--bdr)}
.news-tabs .tab{padding:10px 20px;font-size:13px;color:var(--txt2);cursor:pointer;border-bottom:2px solid transparent;transition:.15s}
.news-tabs .tab:hover{color:var(--primary)}
.news-tabs .tab.active{color:var(--primary);border-bottom-color:var(--primary);font-weight:600}
.news-list{padding:10px 20px}
.news-list li{display:flex;align-items:center;gap:12px;padding:11px 0}
.news-list li+li{border-top:1px dashed #e8ecf1}
.news-list .nd{width:60px;text-align:center;flex-shrink:0}
.news-list .nd .day{font-size:18px;font-weight:700;color:var(--txt2);line-height:1}
.news-list .nd .mon{font-size:11px;color:var(--txt3);margin-top:1px}
.news-list .nt{flex:1;font-size:13px;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .15s}
.news-list .nt:hover{color:var(--primary)}
.news-side{background:var(--w);border-radius:var(--r);box-shadow:var(--sh);padding:18px}
.news-side h4{font-size:15px;font-weight:600;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--bdr)}
.news-side .si{width:100%;height:120px;background:linear-gradient(135deg,#eff6ff,#dbeafe);border-radius:6px;margin-bottom:8px;display:flex;align-items:center;justify-content:center;font-size:28px;color:var(--primary)}
.news-side .st{font-size:12px;color:var(--txt2);line-height:1.55;margin-bottom:12px}
.news-side .sl li{padding:6px 0;font-size:12px;color:var(--txt2);border-bottom:1px dashed #e8ecf1;cursor:pointer;transition:color .15s}
.news-side .sl li:hover{color:var(--primary)}

/* ====== PARTNERS ====== */
.parts{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.part{background:var(--w);border-radius:6px;border:1px solid #e8ecf1;padding:16px 10px;display:flex;align-items:center;justify-content:center;height:64px;font-size:12px;color:var(--txt2);transition:.15s;text-align:center}
.part:hover{border-color:#bfdbfe;box-shadow:var(--sh);color:var(--primary)}

/* ====== FOOTER ====== */
.footer{background:var(--footer-bg);color:#94a3b8;padding:44px 0 0}
.footer .fgrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:20px;padding-bottom:32px;border-bottom:1px solid rgba(255,255,255,.05)}
.footer .fi .flogo{font-size:17px;font-weight:700;color:#e2e8f0;margin-bottom:8px}
.footer .fi .fdesc{font-size:11px;line-height:1.75;margin-bottom:8px}
.footer .fi .fcontact{font-size:11px;line-height:1.75}
.footer .fc h5{font-size:13px;font-weight:600;color:#cbd5e1;margin-bottom:12px}
.footer .fc ul li{margin-bottom:7px}
.footer .fc ul li a{font-size:11px;color:#94a3b8;transition:color .15s}
.footer .fc ul li a:hover{color:#e2e8f0}
.footer .fqr{text-align:center}
.footer .fqr .qr{width:80px;height:80px;background:rgba(255,255,255,.06);border-radius:6px;margin:0 auto 4px;display:flex;align-items:center;justify-content:center;font-size:24px}
.footer .fqr p{font-size:10px}
.footer .fbot{padding:14px 0;text-align:center;font-size:11px;color:rgba(255,255,255,.22)}

/* ====== SUBPAGES ====== */
.pg-banner{margin-top:var(--nav-h);background:linear-gradient(160deg,#0f2668,#2563eb);padding:34px 0;color:#fff}
.pg-banner h1{font-size:22px;font-weight:700;margin-bottom:2px}
.pg-banner .bc{font-size:11px;opacity:.78}
.pg-banner .bc span{margin:0 3px}
.pg-body{padding:32px 0;min-height:340px}
.c-card{background:var(--w);border-radius:var(--r);box-shadow:var(--sh);padding:24px;border:1px solid #f1f5f9}
.c-card h2{font-size:17px;font-weight:600;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--bdr)}
.c-card p{font-size:13px;color:var(--txt2);line-height:1.75;margin-bottom:8px}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}
.fitem{text-align:center;padding:22px 14px;border:1px solid #e8ecf1;border-radius:var(--r);transition:.2s}
.fitem:hover{border-color:#bfdbfe;box-shadow:var(--sh-md)}
.fitem .fi-icon{width:48px;height:48px;border-radius:50%;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;font-size:20px}
.fitem h4{font-size:14px;font-weight:600;margin-bottom:2px}
.fitem p{font-size:12px;color:var(--txt2)}

/* ====== RWD ====== */
@media(max-width:992px){
  .hero .container{flex-direction:column;text-align:center;gap:24px}
  .hero-search{margin:0 auto 24px}
  .hero-stats{justify-content:center}
  .hero-visual{flex:none;width:100%;max-width:340px}
  .cards{grid-template-columns:repeat(2,1fr)}
  .kechan{grid-template-columns:1fr}
  .news{grid-template-columns:1fr}
  .parts{grid-template-columns:repeat(3,1fr)}
  .footer .fgrid{grid-template-columns:repeat(3,1fr)}
  .fgrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .top-bar .nav-links{display:none}
  .hero-content h1{font-size:22px}
  .hero-stats{flex-wrap:wrap;gap:16px}
  .cards{grid-template-columns:1fr}
  .parts{grid-template-columns:repeat(2,1fr)}
  .footer .fgrid{grid-template-columns:1fr 1fr}
  .fgrid{grid-template-columns:1fr}
}