/* ==========================================================================
   SG Growth · 首页改版专用样式（样式分离，仅首页加载）
   说明：本文件只承载【首屏以上重写板块】的样式，类名统一加 sg- 前缀隔离，
   不影响全站 main.css / common.css。新闻资讯及以下沿用原主题样式。
   配色：深空蓝 + 品牌橙，高级工业信任感。
   ========================================================================== */

:root{
  --sg-navy:#0b1b34;  --sg-navy2:#102a4e;  --sg-navy3:#16385f;
  --sg-orange:#f5a623; --sg-orange2:#ff8c00;
  --sg-ink:#1a2332; --sg-sub:#5b6b80; --sg-line:#e3e8f0;
  --sg-bg:#f6f8fb; --sg-card:#ffffff;
}

/* ---------------- ① 首屏 Hero（替换原 adminbuy_banner，桌面紧凑版） ---------------- */
.sg-hero{
  position:relative; min-height:auto;
  display:flex; align-items:center;
  background:linear-gradient(135deg,var(--sg-navy) 0%,var(--sg-navy2) 55%,var(--sg-navy3) 100%);
  color:#fff; overflow:hidden; padding:52px 0 40px;
}
.sg-hero .sg-bg{
  position:absolute; inset:0; z-index:0; opacity:.30;
  background:center/cover no-repeat;
}
.sg-hero .sg-mask{position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(11,27,52,.94) 0%,rgba(11,27,52,.55) 55%,rgba(11,27,52,.15) 100%)}
.sg-hero .containe{position:relative; z-index:2; width:100%; max-width:1200px; margin:0 auto; padding:0 24px; box-sizing:border-box}
.sg-hero .sg-tag{
  display:inline-block; border:1px solid rgba(255,255,255,.35); border-radius:20px;
  padding:4px 14px; font-size:13px; letter-spacing:1px; margin-bottom:14px; color:#dbe6f5;
}
.sg-hero h1{font-size:40px; line-height:1.2; font-weight:800; margin:0 0 14px; color:#fff}
.sg-hero h1 b{color:var(--sg-orange); font-weight:800}
.sg-hero .sg-lead{font-size:17px; color:#cdd9ea; max-width:680px; margin:0 0 24px; line-height:1.7}
.sg-hero .sg-lead b{color:#fff}
.sg-hero .sg-cta{display:flex; gap:16px; flex-wrap:wrap}
.sg-btn{border-radius:8px; padding:12px 26px; font-size:15px; font-weight:600; display:inline-block; transition:.2s; border:none; cursor:pointer; line-height:1.4}
.sg-btn-primary{background:var(--sg-orange); color:var(--sg-navy)}
.sg-btn-primary:hover{background:var(--sg-orange2)}
.sg-btn-ghost{background:transparent; border:1px solid rgba(255,255,255,.55); color:#fff}
.sg-btn-ghost:hover{background:rgba(255,255,255,.12)}
.sg-hero .sg-stats{display:flex; gap:44px; margin-top:30px; flex-wrap:wrap}
.sg-hero .sg-stat b{font-size:28px; color:var(--sg-orange); display:block; line-height:1.2}
.sg-hero .sg-stat span{font-size:13.5px; color:#cdd9ea}

/* ---------------- ② 数据信任带（白色卡片 + 细边框，与首页浅色板块和谐） ---------------- */
.sg-trust{background:var(--sg-bg); padding:0}
.sg-trust .containe{max-width:1200px; margin:0 auto; padding:0 24px; box-sizing:border-box}
.sg-trust .sg-trust-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:0; text-align:center; background:var(--sg-card);
  border:1px solid var(--sg-orange2); border-radius:14px;
  padding:26px 12px; margin:28px 0; box-shadow:0 4px 18px rgba(11,27,52,.06);
}
.sg-trust .sg-trust-item{border-right:1px solid var(--sg-line); padding:4px 12px}
.sg-trust .sg-trust-item:last-child{border-right:none}
.sg-trust .sg-trust-item b{font-size:34px; color:var(--sg-orange2); display:block}
.sg-trust .sg-trust-item span{font-size:14px; color:var(--sg-sub)}

/* ---------------- ③ 痛点区 ---------------- */
.sg-pain{background:var(--sg-bg); padding:84px 0}
.sg-pain .containe{max-width:1200px; margin:0 auto; padding:0 24px; box-sizing:border-box}
.sg-sec-title{font-size:30px; font-weight:700; color:var(--sg-navy); text-align:center; margin:0 0 10px; letter-spacing:.5px}
.sg-sec-title b{color:var(--sg-orange2); font-weight:700}
.sg-sec-sub{text-align:center; color:var(--sg-sub); font-size:16px; margin:0 auto 46px; max-width:760px}
.sg-pain-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:18px}
.sg-pain-card{background:var(--sg-card); border:1px solid var(--sg-line); border-left:4px solid var(--sg-orange2); border-radius:10px; padding:22px}
.sg-pain-card h4{font-size:16px; color:var(--sg-navy); margin:0 0 6px}
.sg-pain-card p{font-size:14px; color:var(--sg-sub); margin:0}
.sg-pain-card .sg-fix{margin-top:10px; font-size:13.5px; color:var(--sg-orange2); font-weight:600}

/* ---------------- ④ 服务对号入座（改造 do4s，保留 pboot 数据标签） ---------------- */
.sg-serve{background:#fff; padding:84px 0}
.sg-serve .containe{max-width:1200px; margin:0 auto; padding:0 24px; box-sizing:border-box}
.sg-serve-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); gap:22px}
.sg-s-card{border:1px solid var(--sg-line); border-radius:14px; overflow:hidden; background:var(--sg-card); transition:.25s}
.sg-s-card:hover{box-shadow:0 12px 32px rgba(11,27,52,.10); transform:translateY(-4px)}
.sg-s-card .sg-head{padding:22px 24px 16px; border-bottom:3px solid var(--sg-orange); background:linear-gradient(180deg,#fff,#f7f9fc)}
.sg-s-card .sg-en{font-size:12px; color:var(--sg-orange2); letter-spacing:1px; margin-bottom:6px}
.sg-s-card .sg-head h3{font-size:20px; color:var(--sg-navy); margin:0}
.sg-s-card .sg-body{padding:20px 24px 24px}
.sg-s-card .sg-value{font-size:15px; color:var(--sg-ink); font-weight:600; margin-bottom:12px}
.sg-s-card .sg-body ul{list-style:none; margin:0; padding:0}
.sg-s-card .sg-body ul li{font-size:14px; color:var(--sg-sub); padding:5px 0 5px 22px; position:relative}
.sg-s-card .sg-body ul li::before{content:"✓"; position:absolute; left:0; color:var(--sg-orange2); font-weight:700}
.sg-s-card .sg-meta{margin-top:14px; padding-top:12px; border-top:1px dashed var(--sg-line); font-size:14px; color:var(--sg-navy); display:flex; justify-content:space-between; flex-wrap:wrap; gap:6px}
.sg-s-card .sg-meta b{color:var(--sg-orange2)}

/* ---------------- ⑤ 团队/资质背书 ---------------- */
.sg-team{background:var(--sg-bg); padding:84px 0}
.sg-team .containe{max-width:1200px; margin:0 auto; padding:0 24px; box-sizing:border-box}
.sg-team-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:22px}
.sg-t-card{background:var(--sg-card); border:1px solid var(--sg-line); border-radius:12px; padding:24px; text-align:center}
.sg-t-avatar{width:88px; height:88px; border-radius:50%; background:linear-gradient(135deg,var(--sg-navy),var(--sg-navy3)); color:#fff; font-size:30px; font-weight:700; display:flex; align-items:center; justify-content:center; margin:0 auto 14px}
.sg-t-card h4{font-size:17px; color:var(--sg-navy); margin:0}
.sg-t-card .sg-role{font-size:13px; color:var(--sg-orange2); margin:4px 0 8px}
.sg-t-card p{font-size:13.5px; color:var(--sg-sub); margin:0}
.sg-badge-row{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:32px}
.sg-badge{background:#fff7e8; border:1px solid #ffe0a8; color:#7a5a00; border-radius:20px; padding:8px 18px; font-size:14px}

/* ---------------- 案例区（沿用 adminbuy_case 结构，仅对齐标题/间距） ---------------- */
.sg-case-wrap{padding:84px 0 40px}
/* 对齐：实战成果 / 新闻资讯 容器统一 1200px（原主题 .containe 为 1600px，需收紧与上方板块一致） */
#adminbuy_case.containe,
#adminbuy_news3s.containe{max-width:1200px; margin:0 auto; padding:0 24px; box-sizing:border-box}
.sg-case-note{max-width:1200px; margin:0 auto; padding:32px 24px; box-sizing:border-box; text-align:center; border:1px dashed var(--sg-line); border-radius:14px; color:var(--sg-sub); background:#fafbfd; font-size:15px}

/* ---------------- 陪跑横幅（沿用 subimg，修复图片自适应，防超宽溢出） ---------------- */
.sg-subimg-margin{margin-top:0}
.subimg>img{max-width:100%;height:auto}

/* ---------------- 响应式 ---------------- */
@media (max-width:900px){
  .sg-hero{min-height:auto;padding:76px 0 30px}
  .sg-hero h1{font-size:26px;line-height:1.3;margin-bottom:14px}
  .sg-hero .sg-lead{font-size:15px;margin-bottom:22px}
  .sg-hero .sg-tag{margin-bottom:14px}
  .sg-hero .sg-stats{margin-top:28px;gap:20px}
  .sg-hero .sg-stat b{font-size:24px}
  .sg-hero .sg-stat span{font-size:13px}
  .sg-pain,.sg-serve,.sg-team{padding:48px 0}
  .sg-sec-title{font-size:24px}
  .sg-sec-sub{margin-bottom:30px}
  .sg-pain-grid{grid-template-columns:1fr}
  .sg-serve-grid{grid-template-columns:1fr}
  .sg-s-card .sg-head h3{font-size:18px}
  .sg-s-card .sg-body{padding:16px 20px 20px}
  .sg-team-grid{grid-template-columns:1fr 1fr}
  .sg-t-card{padding:18px}
  .sg-badge-row{gap:8px}
  .sg-case-wrap{padding:48px 0 20px}
}
