/* ===== 钢结构团队 作品集 共享样式 ===== */
:root{
  --navy:#0f2c4c;--navy2:#14406b;--gold:#c8a45c;--gold-soft:#e3c98f;
  --ink:#23303a;--muted:#5d6b76;--line:#e6e9ee;--bg:#f4f6f9;--card:#fff;--accent:#1c6fb8;
  --green:#2f9d3f;--red:#c0512f;--orange:#d98a3d;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",-apple-system,sans-serif;color:var(--ink);background:var(--bg);line-height:1.75;-webkit-font-smoothing:antialiased;}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px 80px;}

/* ===== 顶部门户导航栏（所有页面统一）===== */
.portalbar{background:#0a1f37;color:#fff;border-bottom:1px solid rgba(255,255,255,.08);}
.portalbar-inner{max-width:1180px;margin:0 auto;padding:0 18px;display:flex;align-items:center;gap:8px;overflow-x:auto;scrollbar-width:none;}
.portalbar-inner::-webkit-scrollbar{display:none;}
.pb-brand{flex:none;display:flex;align-items:center;gap:7px;font-size:14px;font-weight:800;color:#fff;text-decoration:none;padding:11px 14px 11px 0;letter-spacing:.5px;}
.pb-brand .hex{color:var(--gold-soft);}
.pb-links{display:flex;gap:2px;align-items:center;}
.pb-links a{flex:none;white-space:nowrap;font-size:12.5px;color:#aab9c9;text-decoration:none;padding:11px 12px;border-bottom:2px solid transparent;font-weight:600;transition:.15s;}
.pb-links a:hover{color:#fff;}
.pb-links a.active{color:#fff;border-bottom-color:var(--gold);}
.pb-links .sep{width:1px;height:16px;background:rgba(255,255,255,.14);margin:0 4px;}

/* ===== Hero ===== */
.hero{background:linear-gradient(135deg,var(--navy),var(--navy2) 60%,#1b5184);color:#fff;position:relative;overflow:hidden;}
.hero::after{content:"";position:absolute;right:-120px;top:-120px;width:440px;height:440px;background:radial-gradient(circle,rgba(200,164,92,.28),transparent 70%);}
.hero-inner{max-width:1100px;margin:0 auto;padding:54px 20px 44px;position:relative;z-index:2;}
.eyebrow{display:inline-block;letter-spacing:3px;font-size:12.5px;color:var(--gold-soft);border:1px solid rgba(200,164,92,.5);padding:4px 14px;border-radius:30px;margin-bottom:20px;}
.hero h1{font-size:36px;font-weight:800;margin-bottom:10px;line-height:1.2;}
.hero h1 span{color:var(--gold-soft);}
.hero p.sub{font-size:15.5px;color:#cfe0f0;max-width:800px;}
.hero-pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px;}
.pill{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:30px;padding:7px 16px;font-size:13px;color:#eaf2fb;}
.hero-stats{display:flex;flex-wrap:wrap;gap:16px;margin-top:24px;}
.stat{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:14px 20px;min-width:140px;flex:1;}
.stat b{display:block;font-size:26px;font-weight:800;color:#fff;}
.stat b small{font-size:14px;color:var(--gold-soft);}
.stat span{font-size:12.5px;color:#bcd0e6;}

/* ===== 章节内导航 ===== */
.nav{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);box-shadow:0 2px 14px rgba(15,44,76,.06);}
.nav-inner{max-width:1100px;margin:0 auto;padding:0 14px;display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;}
.nav-inner::-webkit-scrollbar{display:none;}
.nav a{flex:none;white-space:nowrap;padding:14px 14px 12px;font-size:13.5px;color:var(--muted);text-decoration:none;border-bottom:3px solid transparent;font-weight:600;}
.nav a:hover{color:var(--navy);}
.nav a.active{color:var(--navy);border-bottom-color:var(--gold);}

/* ===== 通用结构 ===== */
section{margin-top:48px;scroll-margin-top:62px;}
.sec-head{display:flex;align-items:center;gap:14px;margin-bottom:20px;}
.sec-head .num{width:42px;height:42px;border-radius:11px;flex:none;background:linear-gradient(135deg,var(--gold),var(--gold-soft));color:var(--navy);font-weight:800;font-size:19px;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(200,164,92,.35);}
.sec-head h2{font-size:23px;color:var(--navy);font-weight:800;}
.sec-head .en{font-size:12px;color:var(--muted);letter-spacing:1px;text-transform:uppercase;}
.lead{font-size:14.5px;color:var(--muted);margin-bottom:20px;}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px 26px;box-shadow:0 4px 20px rgba(15,44,76,.05);}

/* 表格 */
.tbl{width:100%;border-collapse:collapse;font-size:13.5px;}
.tbl th,.tbl td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;}
.tbl th{background:var(--navy);color:#fff;font-weight:700;font-size:13px;}
.tbl td:first-child{font-weight:700;color:var(--navy);}
.tbl tr:nth-child(even) td{background:#fafbfd;}
.tbl .y{color:#2f7d3a;font-weight:700;}
.tbl .n{color:#c0512f;}

/* 要点列表 */
.bullets{list-style:none;}
.bullets li{font-size:14px;padding-left:20px;position:relative;margin-bottom:9px;line-height:1.6;}
.bullets li::before{content:"▹";position:absolute;left:0;color:var(--gold);}
.hl{color:#b8852b;font-weight:700;}

/* 网格卡 */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.minicard{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 20px;border-top:4px solid var(--gold);box-shadow:0 4px 16px rgba(15,44,76,.05);}
.minicard h4{font-size:15px;color:var(--navy);margin-bottom:8px;display:flex;align-items:center;gap:8px;}
.minicard .ic{width:30px;height:30px;border-radius:8px;background:#eef4fa;color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:15px;flex:none;}
.minicard ul{list-style:none;}
.minicard li{font-size:13px;color:var(--muted);padding-left:15px;position:relative;margin-bottom:6px;line-height:1.55;}
.minicard li::before{content:"·";position:absolute;left:4px;color:var(--gold);font-weight:900;}

/* 指标 */
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.metric{background:var(--card);border:1px solid var(--line);border-top:4px solid var(--gold);border-radius:14px;padding:20px;text-align:center;box-shadow:0 4px 16px rgba(15,44,76,.05);}
.metric b{display:block;font-size:28px;font-weight:800;color:var(--navy);line-height:1.1;}
.metric b small{font-size:14px;color:var(--gold);}
.metric span{font-size:12.5px;color:var(--muted);}

/* 流程 */
.flow{display:flex;flex-wrap:wrap;align-items:stretch;}
.flow .fstep{flex:1;min-width:130px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 12px;text-align:center;}
.flow .fn{width:30px;height:30px;border-radius:50%;background:var(--navy);color:#fff;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;margin:0 auto 8px;}
.flow .fstep b{display:block;font-size:13.5px;color:var(--navy);margin-bottom:3px;}
.flow .fstep span{font-size:11px;color:var(--muted);}
.flow .farrow{display:flex;align-items:center;color:var(--gold);font-size:20px;font-weight:800;padding:0 4px;}

/* 强调框 */
.callout{margin-top:22px;background:#fbf7ee;border:1px solid var(--gold-soft);border-radius:14px;padding:22px 26px;}
.callout h4{color:#8a6d2f;font-size:16px;margin-bottom:10px;}
.callout p{font-size:14.5px;color:var(--ink);}

.tag{display:inline-block;font-size:11.5px;background:#f2f7fc;border:1px solid #dde9f4;color:var(--accent);border-radius:6px;padding:2px 9px;margin:3px 4px 0 0;}
.disclaimer{margin-top:30px;background:#fbf7ee;border:1px solid var(--gold-soft);border-radius:12px;padding:14px 18px;font-size:12.5px;color:#8a6d2f;}
footer{text-align:center;color:var(--muted);font-size:12.5px;margin-top:46px;padding-top:24px;border-top:1px solid var(--line);}

@media(max-width:820px){
  .hero h1{font-size:27px;}
  .grid2,.grid3,.grid4,.metrics{grid-template-columns:1fr 1fr;}
  .flow .farrow{transform:rotate(90deg);width:100%;padding:6px 0;}
}
@media(max-width:560px){
  .grid2,.grid3,.grid4,.metrics{grid-template-columns:1fr;}
  .tbl{font-size:12.5px;}.tbl th,.tbl td{padding:8px 9px;}
}
