/* ==================================================================
   WOXIN 追加模块样式（在旧版站基础上叠加，不改旧版任何原有样式）
   - .wb-scope*  关于我们页「8 大业务方向」业务范围模块
   - .wb-hero-*  首页首屏四张海报轮播
   配色严格沿用旧版 token：
     #07090D 正文 / #606369 次要 / #E3E5E8 边框 / #F0F2F5 浅底 / #008CE4 品牌
   ================================================================== */

/* ============ ① 业务范围模块 ============ */
.wb-scope{
  /* 上边距刻意留大：业务范围紧贴首屏会显得顶，留出呼吸感 */
  max-width:1280px;margin:0 auto;padding:56px 20px 64px;
}
@media (min-width:640px){ .wb-scope{padding:76px 24px 80px} }
@media (min-width:768px){ .wb-scope{padding:96px 32px 96px} }

.wb-scope-card{
  position:relative;border:1px solid #E3E5E8;border-radius:24px;overflow:hidden;
  background:
    radial-gradient(ellipse 70% 90% at 88% 0%,rgba(0,140,228,.05),transparent 62%),
    linear-gradient(180deg,#FBFCFD 0%,#F5F7F9 100%);
  padding:44px 40px 40px;
}
@media (min-width:768px){ .wb-scope-card{padding:56px 56px 48px} }

.wb-scope-top{
  display:grid;grid-template-columns:1fr;gap:28px;align-items:end;
}
@media (min-width:900px){ .wb-scope-top{grid-template-columns:1fr auto;gap:48px} }

.wb-scope-title{
  font-size:clamp(26px,3vw,38px);font-weight:600;letter-spacing:-.02em;
  color:#07090D;line-height:1.1;display:flex;align-items:baseline;gap:6px;
}
.wb-scope-title .wb-num{
  font-size:clamp(46px,6vw,74px);font-weight:700;letter-spacing:-.05em;line-height:1;
  color:#0B1220;margin-right:4px;
}
.wb-scope-line{
  margin-top:18px;font-size:clamp(17px,1.9vw,24px);font-weight:600;
  letter-spacing:-.01em;line-height:1.55;color:#07090D;
}
.wb-scope-desc{
  margin-top:16px;font-size:14px;line-height:1.9;color:#606369;max-width:620px;
}
.wb-scope-side{text-align:left}
@media (min-width:900px){ .wb-scope-side{text-align:right;padding-bottom:6px} }
.wb-scope-side .k{
  font-size:10.5px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;
  color:#9AA0A8;
}
.wb-scope-side .t{
  margin-top:10px;font-size:22px;font-weight:600;line-height:1.4;color:#07090D;
}
.wb-scope-side .t b{color:#2F6BFF;font-weight:600}

.wb-chips{
  display:flex;flex-wrap:wrap;gap:10px;margin-top:30px;
  padding-top:26px;border-top:1px solid rgba(15,23,42,.08);
}
.wb-chips span{
  font-size:12.5px;line-height:1;padding:9px 16px;border-radius:999px;
  background:#fff;border:1px solid #E3E5E8;color:#606369;white-space:nowrap;
}

.wb-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:26px;
}
@media (min-width:640px){ .wb-grid{grid-template-columns:repeat(4,1fr);gap:16px} }

.wb-grid figure{
  margin:0;border-radius:14px;background:#fff;border:1px solid #E3E5E8;
  overflow:hidden;text-align:center;padding:0 0 12px;
}
.wb-grid .wb-pic{
  aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;
  padding:10px 10px 4px;
}
.wb-grid img{
  width:100%;height:100%;object-fit:contain;display:block;
}
.wb-grid figcaption{
  font-size:12.5px;color:#606369;letter-spacing:.02em;line-height:1.5;
  padding-top:6px;
}

/* ============ ② 首页首屏轮播 ============ */
.wb-hero-slide{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .9s ease;
}
.wb-hero-slide.wb-on{opacity:1}

/* 文案切换的淡入 */
.wb-copy-fade{animation:wbFade .7s ease both}
@keyframes wbFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* 旧版首屏底部居中有一个「Scroll」指示器（bottom-6 / 24px），
   圆点必须抬到它上方，否则压在一起 */
.wb-hero-dots{
  position:absolute;left:50%;transform:translateX(-50%);bottom:58px;z-index:20;
  display:flex;align-items:center;gap:10px;
}
.wb-hero-dots button{
  width:8px;height:8px;border-radius:999px;border:0;padding:0;cursor:pointer;
  background:rgba(255,255,255,.42);transition:all .3s ease;
}
.wb-hero-dots button.wb-on{background:#fff;width:26px}
.wb-hero-dots button:hover{background:rgba(255,255,255,.75)}

@media (max-width:640px){
  .wb-scope-card{padding:30px 20px 26px;border-radius:18px}
  .wb-hero-dots{bottom:18px}
}

/* ============ ③ 首页商务海报：完全不加遮罩 ============
   原版是深蓝墙面，靠左侧 0.86 的深色渐变压住白字才看得清。
   换成明亮窗景图后，那层暗色显得脏 → 遮罩整层去掉，照片 100% 原样。
   左侧本来就亮（均值 203~214、仅 2~3% 像素暗于 60），
   所以文字从白色翻成深色即可，不需要任何压暗/提亮涂层。 */
body .hero-sub .biz-hero-mask{
  background:none !important;
  background-image:none !important;
  opacity:0 !important;
}
/* 2026-11-09 老板拍板：白字保留，但阴影要"少一点、不要这么明显"。
   旧版是三层叠影（0 0 2 / 0 1px 6 / 0 3px 18），观感脏 →
   统一换成单层很淡的柔影（透明度 .30 左右，只够托住白字不被亮窗吃掉）。
   照片依旧 100% 原样、不加遮罩；字号 +5% 保留。 */
body .hero-sub .biz-hero-copy{ color:#fff; }
body .hero-sub .biz-hero-copy .bz-eyebrow{
  color:#EAF7FF;
  font-size:clamp(.945rem,1.1025vw,1.1025rem) !important;   /* 原 1.05vw/1.05rem ×1.05 */
  text-shadow:0 1px 8px rgba(0,0,0,.30) !important;
}
body .hero-sub .biz-hero-copy .bz-title{
  color:#fff;
  text-shadow:0 1px 14px rgba(0,0,0,.32) !important;
}
body .hero-sub .biz-hero-copy .bz-sub{
  color:#fff;
  text-shadow:0 1px 10px rgba(0,0,0,.30) !important;
}
body .hero-sub .biz-hero-copy .bz-notes{
  color:#fff;
  font-size:clamp(1.035rem,1.2075vw,1.2075rem) !important;  /* 原 1.15vw/1.15rem ×1.05 */
  text-shadow:0 1px 8px rgba(0,0,0,.30) !important;
}
body .hero-sub .biz-hero-copy .bz-cta{
  color:#07090D; background:#fff; border-color:#fff;
  box-shadow:0 2px 12px rgba(0,0,0,.18);
}
body .hero-sub .biz-hero-copy .bz-cta:hover{
  background:#008CE4; border-color:#008CE4; color:#fff;
}

/* ④ 文案整体左移 + 收一档字号，别压到时钟
   机身左沿约在画面 31.6% 处，数字屏从 39% 起。原版容器居中（1920 下文字从 344 起），
   标题右端 854 直接盖住"15:56"。改成贴左锚定 + 标题/副标按 3.55vw / 1.62vw 缩放，
   使文字块宽度恒为视口的 ~25% / ~30%，在任何宽度下都停在机身左侧。 */
@media (min-width:1024px){
  body .hero-sub .biz-hero-copy{
    margin-left:0 !important;
    margin-right:auto !important;
    padding-left:clamp(28px,3.4vw,76px) !important;
    padding-right:24px !important;
  }
  body .hero-sub .biz-hero-copy .bz-title{
    font-size:clamp(2.1rem,3.7275vw,4.515rem) !important;   /* 原 3.55vw / 4.3rem 各 +5% */
  }
  body .hero-sub .biz-hero-copy .bz-sub{
    font-size:clamp(1.05rem,1.701vw,1.8375rem) !important;  /* 原 1.62vw / 1.75rem 各 +5% */
  }
}

/* ⑤ 首屏底部 Scroll 提示：原版是 text-white/50 且无投影，
   换成深蓝芯片海报后正好压在一道高光带在，"SCROLL" 几乎看不见了。
   只加一层很淡的深色投影并提到 78% 白，不加任何底衬、不动照片。 */
body .hero-home > div[class*="bottom-6"]{
  color:rgba(255,255,255,.88);
  text-shadow:0 0 1px rgba(0,0,0,.55), 0 1px 6px rgba(0,0,0,.42);
}

/* ⑥a 首页轮播（四张共用）：文案阴影减淡（旧版标题 0 2px 20px/.5、副标两层 .9/.65 太重） */
body .hero-home .hc-eyebrow{ text-shadow:0 1px 6px rgba(0,0,0,.32) !important; }
body .hero-home .hc-title{ text-shadow:0 1px 14px rgba(0,0,0,.32) !important; }
body .hero-home .hc-sub{ text-shadow:0 1px 10px rgba(0,0,0,.30) !important; }
body .hero-home .hc-desc{ text-shadow:0 1px 8px rgba(0,0,0,.28) !important; }

/* ⑥ 首页首屏第一张：文案整体缩 5%（别遮住芯片主体）
   四张海报共用同一块文案 DOM，用 show() 打的 data-wb-slide 限定只在第 0 张生效。 */
body .hero-home[data-wb-slide="0"] .hc-title{
  font-size:clamp(2rem,3.99vw,4.75rem) !important;        /* 原 4.2vw / 5rem   ×0.95 */
}
body .hero-home[data-wb-slide="0"] .hc-sub{
  font-size:clamp(1.045rem,2.09vw,2.185rem) !important;   /* 原 2.2vw / 2.3rem ×0.95 */
}
body .hero-home[data-wb-slide="0"] .hc-desc{
  font-size:clamp(1.02rem,1.385vw,1.6625rem) !important;  /* 原 1.458vw / 1.75rem ×0.95 */
}

/* ============ ⑦ 公司产品页海报（换明亮棚拍图后整块重排） ============
   原版是「整幅黑色压暗 + 白色文字」；新图是白底明亮场景，压暗会整块发灰 →
   取消压暗层，文字改深色，左栏收在显示器左侧（屏幕左沿在画面 39% 处）。
   图片 1920×860（2.233），hero 高度跟着宽度走（44.79vw），整机不被裁。 */
body.page-products .hero-sub{ min-height:40.3vw; }   /* 原 44.79vw，整体小一档（约 -10%） */
body.page-products .hero-sub > img{
  object-fit:cover !important;
  object-position:center 34% !important;   /* 只在上下各裁一点，显示器与底座都保住 */
}
/* 白字要能读：左侧一层很淡的深色渐变（右侧 70% 之后完全透明，产品 100% 原样）。
   原图文字区中位亮度 162~191，纯白字只有 1.5:1；这层把左侧压到 120~150，约 3:1。 */
body.page-products .hero-sub > div.absolute.inset-0{
  background:linear-gradient(to right, rgba(6,12,22,.46) 0%, rgba(6,12,22,.34) 40%, rgba(6,12,22,.10) 62%, rgba(6,12,22,0) 74%) !important;
}
@media (min-width:1024px){ body.page-products .hero-sub{ padding-top:88px; } }  /* 让开顶部导航（小屏图在上，不需要） */
body.page-products .hero-sub > div.max-w-7xl{
  max-width:none !important;
  padding-left:clamp(24px,5vw,96px) !important;
  padding-right:clamp(24px,5vw,96px) !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  color:#07090D !important;
}
body.page-products .hero-sub .max-w-7xl > div > p:first-child{
  margin-bottom:6px !important;
}
body.page-products .hero-sub h1{
  color:#fff !important;
  text-shadow:0 1px 14px rgba(0,0,0,.30) !important;
  margin-top:26px !important;
  max-width:clamp(300px,34vw,600px) !important;   /* 窄屏自动收窄，别越过显示器左沿（39%） */
  font-size:clamp(2.3rem,3.6vw,4.4rem) !important;
  line-height:1.13 !important;
  letter-spacing:-.025em !important;
  text-shadow:none !important;
}
body.page-products .hero-sub .max-w-7xl > div > p:first-child{
  color:rgba(255,255,255,.86) !important;
  text-shadow:0 1px 8px rgba(0,0,0,.30) !important;
  font-size:clamp(.76rem,.78vw,.86rem) !important;
  letter-spacing:.28em !important;
  font-weight:600 !important;
}
body.page-products .hero-sub .max-w-7xl > div > p:nth-of-type(2){
  color:rgba(255,255,255,.92) !important;
  font-weight:400 !important;
  text-shadow:0 1px 8px rgba(0,0,0,.30) !important;
  margin-top:26px !important;
  max-width:clamp(280px,29vw,470px) !important;   /* 窄桌面别压到显示器（屏左沿=39%） */
  font-size:clamp(.95rem,1.02vw,1.08rem) !important;
  line-height:1.85 !important;
  text-wrap:balance;
}
body.page-products .hero-sub .max-w-7xl a[href^="/cooperation/"]{
  background:#fff !important; border-color:#fff !important; color:#07090D !important;
}
body.page-products .hero-sub .max-w-7xl a[href^="/cooperation/"]:hover{
  background:rgba(255,255,255,.90) !important; border-color:rgba(255,255,255,.90) !important;
}
body.page-products .hero-sub .max-w-7xl a[href="#list"]{
  background:rgba(255,255,255,.14) !important;
  border-color:rgba(255,255,255,.42) !important; color:#fff !important;
  backdrop-filter:blur(6px);
}
body.page-products .hero-sub .max-w-7xl a[href="#list"]:hover{
  background:rgba(255,255,255,.26) !important;
}

/* 小屏：图在上面、文案在下面（白底深字），避免文字压在一屏毛绒玩具上 */
@media (max-width:1023px){
  body.page-products .hero-sub{
    flex-direction:column; align-items:stretch; min-height:0;
  }
  body.page-products .hero-sub > img{
    position:relative !important; inset:auto !important; z-index:0 !important;
    width:100% !important; height:auto !important;
    aspect-ratio:1920/860; object-fit:cover; object-position:center top;
  }
  body.page-products .hero-sub > div.absolute.inset-0{ display:none !important; }
  body.page-products .hero-sub > div.max-w-7xl{
    padding-top:34px !important; padding-bottom:34px !important;
  }
  body.page-products .hero-sub h1{
    font-size:clamp(1.9rem,6.4vw,2.6rem) !important;
    max-width:none !important;
    color:#07090D !important;                 /* 小屏是白底深字，白字会看不见 */
    text-shadow:none !important;
  }
  body.page-products .hero-sub .max-w-7xl > div > p:first-child{
    color:#0B72C4 !important; text-shadow:none !important;
  }
  body.page-products .hero-sub .max-w-7xl > div > p:nth-of-type(2){
    max-width:none !important;
    color:#1A1F26 !important; text-shadow:none !important;
  }
  body.page-products .hero-sub .max-w-7xl a[href^="/cooperation/"]{
    background:#07090D !important; border-color:#07090D !important; color:#fff !important;
  }
  body.page-products .hero-sub .max-w-7xl a[href="#list"]{
    background:#fff !important; border-color:rgba(7,9,13,.18) !important; color:#07090D !important;
  }
}
