/* ============================================================
   鼎汉智能 · Hero  v18
   照集团官网：暖米色底 + 左图右文 + 标题居中 + 底部弧线切到白色。
   集团站的 Hero 是这个结构，子站沿用，两个站放一起才像一家。
   ============================================================ */

.hero{
  position:relative;
  padding-top:calc(var(--nav-h) + clamp(48px,6vw,90px));
  padding-bottom:clamp(64px,8vw,120px);
  background:radial-gradient(120% 140% at 50% 40%,var(--warm) 0%,var(--warm-2) 100%);
}
/* 底部弧线过渡到白色 —— 集团站最好认的一处版式 */
.hero::after{
  content:"";position:absolute;left:-2%;right:-2%;
  bottom:calc(-1 * clamp(36px,4.6vw,66px));height:clamp(38px,4.8vw,70px);
  background:var(--bg);border-radius:50% 50% 0 0/100% 100% 0 0;pointer-events:none;
}

.hero__in{
  display:grid;grid-template-columns:1fr 1.02fr;
  gap:clamp(34px,4.6vw,72px);align-items:center;
}
.hero__ph{border-radius:var(--r-l);overflow:hidden;box-shadow:var(--sh-2)}
.hero__ph img{display:block;width:100%;height:auto}

.hero__t{text-align:center}
.hero h1{margin-top:18px}
.hero__sub{margin-top:26px;text-align:left}
.hero__acts{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:40px}

/* 两条要点：集团站用金色 ✓ 成对排在 Hero 底部 */
.hero__trust{margin-top:clamp(36px,4.2vw,52px)}
.hero__trust .trust{justify-content:center;gap:12px 34px}

@media (max-width:900px){
  .hero__in{grid-template-columns:1fr;gap:30px}
  .hero__ph{order:-1}
}

/* ============================================================
   纯文字 Hero（.hero--t）
   首页用。手上四张照片全是活动照（剪彩、蛋糕、彩带、舞台），
   放在第一屏读起来像公司年会相册，不像企业软件官网。
   照片仍然用在「关于我们」和「集团背景」两段 —— 在那里讲团队讲集团，
   活动照是合适的；在 Hero 当第一印象不合适。
   拿到正式素材（办公场景 / 团队工作照 / 写字楼外景）后，
   去掉 .hero--t 并把 .hero__ph 放回 .hero__in 即可。
   ============================================================ */
.hero--t{
  padding-top:calc(var(--nav-h) + clamp(72px,9vw,132px));
  padding-bottom:clamp(84px,10vw,148px);
}
.hero--t .hero__in{grid-template-columns:1fr}
.hero--t .hero__t{max-width:820px;margin-inline:auto}
.hero--t .hero__sub{max-width:640px;margin-inline:auto;text-align:center}

/* ============================================================
   产品页 Hero（.hero--m）—— 文案居中在上，产品图整幅在下
   左右分栏时图最多只能占半个版心：人资宝那张 1500×782 的工作台
   压到 635px 宽，界面里的字根本看不清 —— 客户打开官网看不到产品长什么样，
   这一屏就白做了。改成整幅之后图有 1160px 宽，接近原图尺寸，
   仪表盘上的数字、表格、菜单都读得出来。
   文案照首页的做法居中，三个 Hero 于是有了同一种读法。
   ============================================================ */
.hero--m .hero__in{grid-template-columns:1fr;gap:clamp(44px,5.2vw,70px)}
.hero--m .hero__t{order:-1;max-width:820px;margin-inline:auto}   /* 文案排到图前面 */
.hero--m .hero__sub{max-width:680px;margin-inline:auto;text-align:center}