@import url("https://fonts.googleapis.cn/css2?family=Noto+Sans+SC:wght@500;700;900&display=swap");
/* reset.css - 基础重置 + 全站设计令牌 */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC","Noto Sans SC",sans-serif;
  font-size:15px;line-height:1.75;color:#1a1a1a;background:#fff;min-width:320px;overflow-x:hidden;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
img{display:block;max-width:100%;height:auto;vertical-align:middle}
a{color:inherit;text-decoration:none;cursor:pointer;transition:color .2s}
a:hover{color:#C8102E}
ul,ol{list-style:none}
h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.3;letter-spacing:.01em}
button{font-family:inherit;cursor:pointer;border:none;background:none;outline:none}
input,textarea{font-family:inherit;outline:none;border:none}
table{border-collapse:collapse;border-spacing:0}

/* CSS变量 - 全站设计令牌 */
:root{
  /* 色彩(沿用品牌黑白红) */
  --c-black:#1a1a1a;
  --c-ink:#141414;
  --c-white:#fff;
  --c-red:#C8102E;
  --c-red-dark:#a40d24;
  --c-gray-bg:#f6f6f7;
  --c-gray-line:#e8e8ea;
  --c-gray-text:#6b6b70;
  --c-text:#1a1a1a;

  /* 字体族 */
  --font-sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC","Noto Sans SC",sans-serif;
  --font-en:"Helvetica Neue",Helvetica,"Segoe UI",Arial,sans-serif;
  --font-heavy:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;

  /* 版式 */
  --w-container:1200px;
  --w-pad:24px;

  /* 字阶 */
  --fz-hero:56px;
  --fz-base:15px;
  --fz-h1:48px;
  --fz-h2:36px;
  --fz-h3:20px;
  --fz-small:13px;

  /* 字距 */
  --ls-eyebrow:.32em;
  --ls-title:.06em;

  /* 圆角与阴影 */
  --r-card:8px;
  --shadow-card:0 2px 12px rgba(20,20,20,.06);
  --shadow-card-hover:0 14px 40px rgba(20,20,20,.13);

  --r-nav:64px;
  --tr:.3s ease;
}

/* 通用容器 */
.container{max-width:var(--w-container);margin:0 auto;padding:0 var(--w-pad)}

/* ============== 通用区块标题(叙事编号版式) ============== */
/* 结构:
   <div class="section-title">
     <div class="st-eyebrow"><span class="st-no">01</span><i></i><span class="st-en">SCENARIO</span></div>
     <h2>场景方案</h2>
     <p class="st-lead">从场景出发,为园区构建智能化整体方案</p>
   </div> */
.section-title{text-align:center;margin-bottom:52px}
.st-eyebrow{
  display:flex;align-items:center;justify-content:center;gap:14px;
  font-family:var(--font-en);margin-bottom:14px;
}
.st-eyebrow .st-no{
  font-size:13px;font-weight:600;letter-spacing:.12em;color:var(--c-red);
  font-variant-numeric:tabular-nums;
}
.st-eyebrow i{display:block;width:36px;height:1px;background:var(--c-red);opacity:.55}
.st-eyebrow .st-en{
  font-size:12px;font-weight:500;letter-spacing:var(--ls-eyebrow);
  color:var(--c-gray-text);text-transform:uppercase;
}
.section-title h2{
  font-size:var(--fz-h2);font-weight:700;color:var(--c-text);
  letter-spacing:.12em;margin-bottom:12px;
}
.section-title .st-lead{font-size:14px;color:var(--c-gray-text);letter-spacing:.04em}

/* 兼容旧版式(h2 + 单行英文小标,无 eyebrow 容器时) */
.section-title>p{font-size:12px;letter-spacing:var(--ls-eyebrow);color:var(--c-gray-text);text-transform:uppercase;font-family:var(--font-en)}

/* 按钮 */
.btn{
  display:inline-block;padding:13px 34px;background:var(--c-red);color:#fff;
  font-family:var(--font-heavy);font-size:17px;font-weight:700;letter-spacing:.14em;
  border-radius:12px;transition:background var(--tr),transform var(--tr);
}
.btn:hover{background:var(--c-red-dark);color:#fff}
.btn-ghost{background:transparent;border:1px solid rgba(255,255,255,.85);color:#fff;border-radius:12px}
.btn-ghost:hover{background:#fff;color:var(--c-red)}
