/* ============================================================
   旭湘官网 · 视觉升级（正式定稿 · 取优紧凑版）
   方向：信赖 · 高级工业风
   - 质量字体：Noto Sans SC（中文）+ Sora（拉丁/数字）
   - 暖琥珀 #f5a524 点睛色（克制使用，单次稀有）
   - 精致卡片 + 紧凑版面（首页整体长度约 -20~25%，契合手机端不长）
   说明：本文件为增量覆盖层，不修改 main.css；确认后批量挂到全站。
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;700;900&family=Sora:wght@300;400;600;700;800&display=swap');

:root{
  --brand:#0a4d8c;
  --brand-2:#0e6bb8;
  --brand-3:#1e9ad6;
  --brand-soft:#eaf3fb;
  --accent:#f5a524;          /* 暖琥珀点睛色 */
  --accent-soft:#fff4e0;
  --accent-ink:#7a4a00;
  --ink:#0b1a2b;
  --ink-2:#33475f;
  --muted:#5d7288;
  --line:#e4ebf3;
  --line-2:#eef3f9;
  --bg:#ffffff;
  --bg-soft:#f6f8fc;
  --bg-deep:#0b1a2b;
  --ok:#1f8a55;
  --radius:14px;
  --radius-sm:10px;
  --shadow-sm:0 1px 2px rgba(15,27,45,.05),0 6px 18px rgba(15,27,45,.06);
  --shadow:0 2px 6px rgba(15,27,45,.06),0 22px 50px rgba(15,27,45,.10);
  --maxw:1200px;
  --gap:clamp(14px,2vw,20px);
  --section-y:clamp(26px,3vw,42px);   /* 取优：板块间距再压紧封顶 42px（覆盖 main.css 的 64px） */
  --font-body:"Noto Sans SC","PingFang SC","Microsoft YaHei","Hiragino Sans GB","Source Han Sans SC",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --font-display:"Sora","Noto Sans SC","PingFang SC",-apple-system,BlinkMacSystemFont,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
}

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  font-family:var(--font-body);
  color:var(--ink-2);
  line-height:1.78;
  letter-spacing:.012em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,.section-title{ font-family:var(--font-display); color:var(--ink); letter-spacing:-.012em; }
a{ transition:color .2s var(--ease); }

/* ===================== 区块节奏（紧凑） ===================== */
.section{ padding:var(--section-y) 0; }
.section-soft{ background:linear-gradient(180deg,var(--bg-soft),#fff); }
.section + .section{ border-top:1px solid var(--line-2); }   /* 弱分隔，弱化割裂感 */
.section-head{ margin-bottom:clamp(18px,2.2vw,28px); }
.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--font-display); font-weight:700; font-size:11.5px;
  letter-spacing:.18em; text-transform:uppercase; color:var(--brand);
  margin-bottom:8px;
}
.eyebrow::before{
  content:""; width:22px; height:2px; border-radius:2px;
  background:linear-gradient(90deg,var(--accent),var(--brand-3));
}
.section-title{ font-size:clamp(20px,2.3vw,29px); font-weight:800; line-height:1.2; }
.section-sub{ margin-top:8px; color:var(--muted); font-size:clamp(13.5px,1.25vw,15px); line-height:1.75; }

/* 让首页 .section 间距真正生效（覆盖 main.css 的 .page-home .section{padding:64px} 高特异性） */
.page-home .section{ padding:var(--section-y) 0; }
.page-home #process-assure{ padding-top:var(--section-y); padding-bottom:var(--section-y); }
.section-head{ margin-bottom:clamp(15px,1.9vw,22px); }
.eyebrow{ margin-bottom:7px; }

/* 5 卡卖点网格：≤1100px 时末卡横跨整行，消除 2/3 列布局的右下空位 */
@media (max-width:1100px){
  .adv-grid .adv-item:last-child{
    grid-column:1/-1; display:flex; flex-direction:row; flex-wrap:wrap;
    align-items:center; justify-content:center; text-align:center; gap:10px 14px;
    border-color:rgba(245,165,36,.42); background:linear-gradient(180deg,#fffdf7,#fff4e0);
  }
}

/* 媒体矩阵账号未开通（空块）时整段隐藏，消除"技术文章"与"服务范围说明"之间的大空白 */
.section#sec-media:has(.media-grid:empty){ display:none; }

/* 局部间距再收紧 */
.seo-note{ margin-top:18px; }
.ind-chips{ margin-bottom:18px; }
.tst-grid{ margin-top:14px; }
.flow-band{ margin-top:24px; }

/* ===================== 按钮 ===================== */
.btn{
  border-radius:12px; font-family:var(--font-body); font-weight:600;
  transition:transform .22s var(--ease),box-shadow .25s var(--ease),background .25s var(--ease),border-color .25s;
}
.btn-primary{
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  box-shadow:0 10px 24px rgba(10,77,140,.26);
}
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 16px 32px rgba(10,77,140,.34); }
.btn-ghost{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.35); color:#fff; }
.btn-ghost:hover{ background:rgba(255,255,255,.16); transform:translateY(-2px); }
.btn-tel{ background:var(--accent); color:#1c1206; border-color:transparent; box-shadow:0 10px 24px rgba(245,165,36,.32); }
.btn-tel:hover{ transform:translateY(-2px); box-shadow:0 16px 32px rgba(245,165,36,.4); }
.btn-tel .tl b{ color:#1c1206; }

/* ===================== 首屏（更密、转化聚焦） ===================== */
.hero-x{ padding:clamp(30px,4vw,52px) 0 clamp(18px,2.6vw,30px); }
.hero-x-inner{ position:relative; z-index:3; }
.hero-x h1.hx{
  font-family:var(--font-display);
  font-size:clamp(26px,3.7vw,48px);
  line-height:1.04; font-weight:800; color:#fff; letter-spacing:-.02em;
}
.hero-x h1.hx .hx-thin{ font-weight:300; color:rgba(255,255,255,.9); }
.hero-x h1.hx em{ font-style:normal; color:var(--accent); }
.hero-x h1.hx .hx-models{
  display:block; font-family:var(--font-body); font-weight:500;
  font-size:clamp(12px,1.25vw,15px); color:rgba(255,255,255,.78);
  margin-top:7px; letter-spacing:.04em; line-height:1.6;
}
.hero-x-lead{
  font-size:clamp(13.5px,1.3vw,15px); color:rgba(255,255,255,.84);
  max-width:760px; line-height:1.72; margin-top:9px;
}
.hero-x-cta{ margin-top:15px; display:flex; flex-wrap:wrap; gap:9px; }
.hero-x-cta .btn{ height:48px; padding:0 20px; font-size:14.5px; }

.hero-x-kpi{
  display:grid; grid-template-columns:repeat(4,1fr); gap:8px;
  margin-top:16px; max-width:880px;
}
.hero-x-kpi .k{
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14);
  border-radius:12px; padding:10px 12px; backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px); transition:transform .3s var(--ease),border-color .3s var(--ease);
}
.hero-x-kpi .k:hover{ transform:translateY(-3px); border-color:rgba(245,165,36,.5); }
.hero-x-kpi .k b{
  display:block; font-family:var(--font-display); color:#fff;
  font-size:clamp(18px,2vw,25px); font-weight:700; line-height:1;
}
.hero-x-kpi .k b i{ font-style:normal; color:var(--accent); font-size:.46em; margin-left:3px; font-weight:600; }
.hero-x-kpi .k span{ display:block; margin-top:4px; font-size:11.5px; color:rgba(255,255,255,.66); line-height:1.5; }

.hero-x-foot{ margin-top:9px; display:flex; flex-wrap:wrap; gap:8px; }
.hero-x-foot .pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:5px 12px; border-radius:999px; font-size:12px; font-weight:600;
  color:#fff; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18);
}
.hero-x-foot .pill::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--accent); }

.hero-x-commit{
  margin-top:8px; color:rgba(255,255,255,.72); font-size:12.5px; line-height:1.8;
  border-left:2px solid var(--accent); padding-left:11px;
}
.hero-x-commit b{ color:#fff; font-weight:700; }

/* ===================== 卡片（紧凑精致） ===================== */
.card{
  border-radius:var(--radius); border:1px solid var(--line);
  background:#fff; box-shadow:var(--shadow-sm); overflow:hidden;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);
}
.card:hover{ transform:translateY(-5px); box-shadow:var(--shadow); border-color:rgba(10,77,140,.22); }
.card img, .card .city-scen-media{ transition:transform .55s var(--ease); }
.card:hover img{ transform:scale(1.045); }
.card .city-scen-no{
  font-family:var(--font-display); font-weight:800; color:var(--accent);
  font-size:13.5px; letter-spacing:.04em;
}
.card h3{ font-size:16px; font-weight:700; line-height:1.38; }
.card .city-scen-body, .card .sv-body, .card .c-body{ padding:14px 16px 16px; }

.grid, .sv-grid, .faq-grid, .brand-xgrid{ gap:var(--gap); }

/* ===================== 常见问题 ===================== */
.faq-item{
  border:1px solid var(--line); border-radius:var(--radius-sm);
  background:#fff; box-shadow:var(--shadow-sm);
  transition:border-color .25s var(--ease),box-shadow .25s var(--ease);
}
.faq-item[open], .faq-item:hover{ border-color:rgba(10,77,140,.22); box-shadow:var(--shadow); }
.faq-item summary{ font-family:var(--font-display); font-weight:600; color:var(--ink); padding:13px 16px; }
.faq-item p{ padding:0 16px 15px; color:var(--ink-2); line-height:1.9; }

/* ===================== CTA 带 ===================== */
.cta-band{
  border-radius:18px;
  background:linear-gradient(118deg,#061426,#0a4d8c 52%,#0e7cc4 100%);
  box-shadow:var(--shadow);
  padding:clamp(26px,3.4vw,40px);
  position:relative; overflow:hidden;
}
.cta-band::after{
  content:""; position:absolute; right:-60px; top:-60px; width:220px; height:220px;
  background:radial-gradient(circle,rgba(245,165,36,.35),transparent 70%); filter:blur(8px);
}
.cta-band h2,.cta-band .cta-title{ font-family:var(--font-display); color:#fff; font-weight:800; }

/* ===================== 页脚（格力式精简） ===================== */
footer.site-footer{ padding:clamp(32px,4vw,50px) 0 22px; }
.footer-top{ grid-template-columns:1.7fr 1fr 1fr 1fr; gap:26px; padding-bottom:24px; }
.footer-h{ font-family:var(--font-display); font-size:14px; font-weight:700; letter-spacing:.04em; color:#fff; margin-bottom:11px; }
.footer-col a{ color:rgba(255,255,255,.66); }
.footer-col a:hover{ color:var(--accent); }
.site-footer .brand-text b{ color:#fff; }
.site-footer .brand-mark{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); }

/* ===================== 滚动揭示动画 ===================== */
.reveal{ transition:opacity .7s var(--ease),transform .7s var(--ease); }
[data-stagger] > *{ transition:opacity .6s var(--ease),transform .6s var(--ease); }

/* ===================== 响应式收敛 ===================== */
@media (max-width:900px){
  .hero-x-kpi{ grid-template-columns:repeat(2,1fr); }
  .footer-top{ grid-template-columns:1fr 1fr; gap:22px; }
}
@media (max-width:560px){
  .hero-x-kpi{ grid-template-columns:repeat(2,1fr); }
  .hero-x-cta{ flex-direction:column; align-items:stretch; }
  .hero-x-cta .btn{ width:100%; }
  .footer-top{ grid-template-columns:1fr; }
  .section-title{ font-size:clamp(20px,6vw,26px); }
}
