/* HVAC LEADER 官网样式：视觉方向 A（产品册蓝），配色与产品册 build/catalogue.css 同源 */
:root{--b:#1C4486;--bd:#102B5C;--ink:#18212D;--g:#5B6675;--l:#D5DCE5;--t2:#F4F7FB;--new:#D9822B;--maxw:1312px}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
/* 正文字号固定 16px：其余字号都是 px，若正文跟随浏览器默认字号会与之错位（2026-11-13 联系页实测） */
body{font-family:Arial,Helvetica,sans-serif;font-size:16px;color:var(--ink);background:#fff;line-height:1.5}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none}
:focus-visible{outline:3px solid #7FA7E8;outline-offset:2px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 64px}

/* 顶栏 */
.nav{border-bottom:1px solid var(--l);background:#fff;position:sticky;top:0;z-index:10}
.nav-in{display:flex;align-items:center;gap:48px;height:84px}
.brand img{height:34px;width:auto}
.nav nav{display:flex;gap:32px;flex:1;font-size:15px}
.nav nav a:hover,.nav nav a[aria-current]{color:var(--b)}
.nav nav a[aria-current]{font-weight:700}
.mailbtn{display:inline-flex;align-items:center;gap:8px;background:var(--b);color:#fff;padding:11px 20px;font-weight:700;font-size:15px;white-space:nowrap}
.mailbtn:hover{background:var(--bd)}

/* hero：左文 5 : 右图 7，轮播保持原图 16:9 */
.hero{display:grid;grid-template-columns:5fr 7fr;background:var(--b);color:#fff}
.hero-txt{display:flex;flex-direction:column;justify-content:center;padding:48px 56px 48px max(64px,calc((100vw - var(--maxw))/2 + 64px))}
.kicker{letter-spacing:.14em;font-size:13px;opacity:.85;text-transform:uppercase}
.hero h1{font:700 46px/1.1 "Arial Narrow",Arial,sans-serif;margin-top:14px}
.figs{display:flex;margin-top:36px;padding-top:24px;border-top:1px solid rgba(255,255,255,.25)}
.fig{flex:none;padding-right:26px}
.fig+.fig{padding-left:26px;border-left:1px solid rgba(255,255,255,.25)}
.fig b{display:block;font-size:28px;margin-bottom:4px;white-space:nowrap}
.fig span{font-size:13px;opacity:.85;white-space:nowrap}
.figs.light{border-top-color:var(--l);margin:40px 0}
.figs.light .fig+.fig{border-left-color:var(--l)}
.figs.light b{color:var(--b)}
.car{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--bd)}
.car .sl{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s}
.car .sl.on{opacity:1}
.dots{position:absolute;left:0;right:0;bottom:18px;display:flex;justify-content:center;gap:10px}
.dots button{width:10px;height:10px;border-radius:5px;background:rgba(255,255,255,.55);transition:width .3s}
.dots button.on{background:#fff;width:28px}

/* 区块 */
.sec{padding-top:56px;padding-bottom:72px}
.sec-hd{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:24px}
.sec h2,.pg-h{font:700 32px/1.15 "Arial Narrow",Arial,sans-serif;color:var(--bd)}
.pg-h{margin-bottom:28px}
.sub-h{font:700 20px "Arial Narrow",Arial,sans-serif;color:var(--bd);margin-bottom:14px}
.more{color:var(--b);font-weight:700;font-size:15px}
.lead{font-size:18px;color:var(--g);margin:-12px 0 28px}
.crumb{padding-top:24px;font-size:13px;color:var(--g)}
.crumb a:hover{color:var(--b)}
.crumb b{color:var(--ink);font-weight:400}

/* 章节卡片 / 产品卡片 */
.cgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.ccard{display:flex;flex-direction:column;border:1px solid var(--l);border-left:6px solid var(--c);padding:18px 20px;background:#fff;transition:box-shadow .2s}
.ccard:hover,.pcard:hover{box-shadow:0 6px 20px rgba(16,43,92,.12)}
.ccard .num{font-size:12px;color:var(--g)}
.ccard .cimg{height:150px;display:flex;align-items:center;justify-content:center;margin:12px 0}
.ccard .cimg img,.pcard .pimg img{max-height:100%;width:auto;object-fit:contain}
.ccard .nm{font-weight:700;font-size:16px;color:var(--bd)}
.ccard .ct{font-size:13px;color:var(--g)}
.ch-hd{display:flex;align-items:center;gap:16px;margin-bottom:28px;padding-left:14px;border-left:6px solid var(--c)}
.ch-hd .pg-h{margin:0}
.ch-hd .num{font:700 32px "Arial Narrow",Arial;color:var(--g)}
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.pcard{display:flex;flex-direction:column;border:1px solid var(--l);padding:16px;transition:box-shadow .2s}
.pcard .pimg{height:180px;display:flex;align-items:center;justify-content:center;background:var(--t2);margin-bottom:14px;padding:12px}
.pno{font-size:13px;color:var(--b);font-weight:700}
.pname{font-size:16px;font-weight:700;color:var(--bd);margin-top:2px}
.new{font-style:normal;font-size:11px;color:#fff;background:var(--new);padding:1px 6px;margin-left:4px;vertical-align:1px}

/* 产品详情 */
.prod{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;padding-top:24px;padding-bottom:40px}
.gal .main{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;padding:32px;background:var(--t2);border:1px solid var(--l)}
.gal .main img{max-height:100%;width:auto;object-fit:contain}
.thumbs{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.thumbs button{width:88px;height:68px;padding:5px;background:var(--t2);border:1px solid var(--l)}
.thumbs button.on{border:2px solid var(--b)}
.thumbs img{width:100%;height:100%;object-fit:contain}
.info .code{font-size:14px;letter-spacing:.06em;color:var(--b);font-weight:700;padding-left:10px;border-left:4px solid var(--c)}
.info h1{font:700 40px/1.1 "Arial Narrow",Arial,sans-serif;color:var(--bd);margin:12px 0 16px}
.ov{font-size:17px;line-height:1.6;margin-bottom:24px}
.specs{display:grid;grid-template-columns:1fr 1fr;gap:20px 32px}
.blk h2{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--b);margin-bottom:6px}
.blk ul{padding-left:18px;font-size:15px;line-height:1.6}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.btn{display:inline-block;background:var(--b);color:#fff;padding:14px 26px;font-weight:700;font-size:15px;border:1.5px solid var(--b)}
.btn:hover{background:var(--bd);border-color:var(--bd)}
.btn.ghost{background:#fff;color:var(--b)}
.btn.ghost:hover{background:var(--t2)}
.items{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}
.item{border:1px solid var(--l);padding:14px;display:flex;flex-direction:column;gap:4px;font-size:14px}
.item img{height:120px;width:auto;object-fit:contain;margin:0 auto 8px}
.item b{color:var(--b)}
.item small{color:var(--g)}
.tblsec{padding-bottom:36px}
.tw{overflow-x:auto;border:1px solid var(--l)}
table{width:100%;border-collapse:collapse;font-size:14px}
th{background:var(--b);color:#fff;font-weight:700;text-align:left;padding:10px 14px;white-space:nowrap}
td{padding:9px 14px;border-top:1px solid var(--l)}
tbody tr:nth-child(even) td{background:var(--t2)}
.note{font-size:13px;color:var(--g);margin-top:8px}
.pager{display:flex;justify-content:space-between;gap:24px;padding-top:24px;padding-bottom:64px;font-size:15px;color:var(--b);font-weight:700}

/* 关于 / 联系 / 目录 */
.about-cols{columns:2;column-gap:48px;font-size:16px;line-height:1.7}
.about-cols p{margin-bottom:16px;break-inside:avoid}
.values{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:40px}
.values li{border-top:3px solid var(--b);padding-top:12px;font-weight:700;color:var(--bd)}
.values span{display:block;color:var(--g);font-size:13px}
.photos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:32px}
.contact>div{border-top:3px solid var(--b);padding-top:16px}
.contact h2{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--g);margin-bottom:10px}
.contact p{font-size:16px;line-height:1.6}
.contact .big{display:block;font-size:18px;font-weight:700;color:var(--b);margin-bottom:4px}
.contact .big:hover{text-decoration:underline}
.toc{list-style:none;margin-top:36px;max-width:760px}
.toc li{display:flex;align-items:center;gap:16px;padding:12px 0 12px 14px;border-bottom:1px solid var(--l);border-left:6px solid var(--c)}
.toc span{color:var(--g);width:24px}
.toc a{flex:1;font-weight:700;color:var(--bd)}
.toc .pg{flex:none;font-weight:400;color:var(--g);font-size:14px}

/* 页脚 */
.foot{background:var(--bd);color:#C9D6EC;font-size:14px;line-height:1.7}
.foot-in{display:flex;gap:64px;padding-top:40px;padding-bottom:40px}
.foot img{height:29px;width:auto;margin-bottom:14px}
.foot-links{display:flex;flex-direction:column;margin-left:auto}
.foot a:hover{color:#fff}

/* 平板 */
@media (max-width:1100px){
  .wrap{padding:0 32px}
  .hero{grid-template-columns:1fr}
  .hero-txt{padding:40px 32px}
  .cgrid,.pgrid{grid-template-columns:repeat(3,1fr)}
  .prod{grid-template-columns:1fr;gap:32px}
  .nav-in{gap:24px}
  .nav nav{gap:20px}
}
/* 手机 */
@media (max-width:640px){
  .wrap{padding:0 16px}
  .nav-in{flex-wrap:wrap;height:auto;padding-top:12px;padding-bottom:10px;gap:10px 16px}
  .brand img{height:28px}
  .nav nav{order:3;flex-basis:100%;gap:20px;font-size:14px}
  .mailbtn{margin-left:auto;padding:8px 12px;font-size:14px}
  .hero-txt{padding:32px 16px}
  .hero h1{font-size:34px}
  /* 三个数字固定一行，不折到第二行（折行后竖线会悬空） */
  .fig{flex:1 1 0;padding-right:12px}.fig+.fig{padding-left:12px}
  .fig b{font-size:20px}
  .fig span{white-space:normal;font-size:12px;line-height:1.3;display:block}
  .cgrid,.pgrid{grid-template-columns:repeat(2,1fr);gap:12px}
  .ccard,.pcard{padding:12px}
  .ccard .cimg,.pcard .pimg{height:110px}
  .sec h2,.pg-h{font-size:26px}
  .info h1{font-size:30px}
  .specs,.contact,.photos{grid-template-columns:1fr}
  .about-cols{columns:1}
  .values{grid-template-columns:1fr 1fr}
  .foot-in{flex-direction:column;gap:20px}
  .foot-links{margin-left:0}
  .pager{flex-direction:column}
}