/* ==========================================================================
   series-hero.v1.css — 产品系列页顶部横幅
   只作用于 .shero，不改动页面其余部分的既有样式。
   浅色调，与原版页面保持一致；只解决"顶部一片空白 + 开头只有文字"。
   ========================================================================== */

.shero{
  margin:0 0 34px;
  border:1px solid #dadce0;
  border-radius:6px;
  overflow:hidden;
  background:#fff;
}

/* ---- 顶部纹理条：真实产品纹理平铺，不用占位图 ---- */
.shero__strip{
  display:grid;
  grid-template-columns:repeat(10,1fr);
  height:190px;
  background:#f1f3f4;
  border-bottom:1px solid #dadce0;
}
.shero__tile{
  margin:0;overflow:hidden;position:relative;
  border-right:1px solid rgba(0,0,0,.06);
}
.shero__tile:last-child{border-right:0}
.shero__tile img{
  width:100%;height:100%;
  object-fit:cover;object-position:center;
  display:block;
  filter:saturate(.93) contrast(1.02);
  transition:transform .5s cubic-bezier(.2,.7,.3,1),filter .3s ease;
}
.shero__tile:hover img{transform:scale(1.09);filter:saturate(1) contrast(1.06)}
.shero__tile--blank{
  background:
    repeating-linear-gradient(135deg,#eceff1 0 8px,#f7f8f9 8px 16px);
}

/* ---- 文字区 ---- */
.shero__body{padding:30px 32px 28px}
.shero__eyebrow{
  margin:0 0 8px;
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:#1a73e8;font-weight:600;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.shero__body h1{
  font-family:'Fraunces',Georgia,serif;
  font-size:clamp(30px,4vw,46px);
  line-height:1.08;letter-spacing:-.02em;font-weight:600;
  color:#202124;margin:0 0 10px;
}
.shero__cn{
  margin:0 0 22px;font-size:15px;color:#5f6368;letter-spacing:.01em;
}

/* ---- 关键数据条：横向排布，替代裸表格的首屏信息 ---- */
.shero__chips{
  list-style:none;margin:0;padding:20px 0 0;
  border-top:1px solid #e8eaed;
  display:flex;flex-wrap:wrap;gap:0;
}
.shero__chips li{
  flex:1 1 150px;min-width:0;padding:0 22px;
  border-left:1px solid #e8eaed;
}
.shero__chips li:first-child{padding-left:0;border-left:0}
.shero__k{
  display:block;margin-bottom:5px;
  font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:#80868b;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.shero__v{
  display:block;font-size:17px;color:#202124;font-weight:600;line-height:1.3;
}

/* ---- 响应式 ---- */
@media (max-width:1000px){
  .shero__strip{grid-template-columns:repeat(5,1fr);height:150px}
  .shero__body{padding:24px 22px}
}
@media (max-width:600px){
  /* 原版 nav.top 是单行 flex，6 个链接在 390px 下会横向溢出 35px */
  nav.top{flex-wrap:wrap;gap:10px 14px;padding:10px 16px;font-size:13px}
  nav.top a{white-space:nowrap}
  .shero__strip{grid-template-columns:repeat(3,1fr);height:118px}
  .shero__tile:nth-child(n+7){display:none}
  .shero__body{padding:20px 18px}
  .shero__chips li{
    flex:1 1 50%;padding:12px 14px 0 0;border-left:0;
    border-top:1px solid #e8eaed;
  }
  .shero__chips li:nth-child(-n+2){border-top:0;padding-top:0}
  .shero__chips li:nth-child(even){padding-left:14px;border-left:1px solid #e8eaed}
  .shero__v{font-size:15px}
}

/* ---- 可达性 ---- */
.shero__tile img{transition:none}
@media (prefers-reduced-motion:reduce){
  .shero__tile:hover img{transform:none}
}
@media print{
  .shero__strip{height:120px}
}