/* ============================================================
   首页专属样式 v2026-10-02
   基于 styles.css 设计体系，解决首屏空荡、层次弱的问题：
   1. 压缩首屏高度，去掉固定 min-height 造成的大片留白
   2. 新增整宽数据带（填充首屏下方空间，传达实力信息）
   3. 服务卡片从"细线表格"升级为悬浮卡片
   4. 收紧整体纵向节奏
   ============================================================ */

/* ---------- 首屏：紧凑布局 ---------- */
.hero{min-height:0}
.hero-grid{min-height:0;padding:58px 0 40px;gap:40px}
.hero-copy{padding:0}
.hero h1{font-size:clamp(38px,4.6vw,58px);margin-bottom:18px}
.hero-copy>p{font-size:15.5px;line-height:1.9}
.hero-actions{margin-top:28px}
.hero-visual{height:420px}

/* ---------- 首屏产品照片组合（真实产品图，错落拼贴） ---------- */
.visual-photo{position:absolute;overflow:hidden;box-shadow:0 22px 55px rgba(0,0,0,.38)}
.visual-photo img{width:100%;height:100%;object-fit:cover;display:block}
.visual-photo--main{width:72%;height:76%;left:0;top:0;transform:rotate(-1.5deg);border:1px solid rgba(98,205,210,.32)}
.visual-photo--sub{width:47%;height:54%;right:1%;bottom:2%;transform:rotate(2deg);border:6px solid #f2f6f6;box-shadow:0 26px 60px rgba(0,0,0,.45)}
.hero-visual .visual-card{left:5%;right:auto;bottom:-8px;width:272px}
.hero-visual .visual-chip{top:16px;left:14px}

/* ---------- 数据带（填充首屏留白） ---------- */
.hero-stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);margin-bottom:36px}
.hero-stats .stat{padding:20px 26px;border-right:1px solid rgba(255,255,255,.1);position:relative}
.hero-stats .stat:last-child{border-right:0}
.hero-stats .stat::before{content:"";position:absolute;left:26px;top:0;width:26px;height:2px;background:#58c9c8}
.hero-stats b{display:block;font-size:25px;font-weight:700;color:#fff;letter-spacing:-.02em;margin-top:8px}
.hero-stats b i{font-style:normal;color:#73d4d1}
.hero-stats span{font-size:12px;color:#8fa4b3;letter-spacing:.03em}

/* ---------- 首屏底部条 ---------- */
.bottom-inner{height:56px}

/* ---------- 整体节奏收紧 ---------- */
main .section{padding:88px 0}
.section-head{margin-bottom:44px}

/* ---------- 服务卡片：升级为悬浮卡片 ---------- */
.service-grid{gap:20px;background:transparent;border:0}
.service-card{background:#fff;border:1px solid #e3e8ec;padding:30px 26px 28px;position:relative;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.service-card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(16,31,49,.10);border-color:#c9d6de}
.service-number{position:absolute;top:24px;right:24px;font:11px 'DM Mono',monospace;color:#b6c2cc;letter-spacing:.1em}
.service-icon{width:44px;height:44px;border:1px solid #cfe6e5;background:#eef7f6;color:#2a9d9a;
  display:flex;align-items:center;justify-content:center;font-size:19px;margin:4px 0 18px}
.service-card h3{font-size:17px;margin-bottom:10px}
.service-card p{font-size:13px;line-height:1.9;color:#5c6b7a}
.service-card h4{font-size:11px;letter-spacing:.1em;color:#8494a2;margin:18px 0 8px}
.service-card ul{font-size:12.5px}
.service-output{background:#f2f8f8;border-left:2px solid #45b8b6;margin-top:18px}
.service-output b{font-size:10px;letter-spacing:.08em;color:#1a7a8c}
.tag-row{margin-top:14px}
.tag-row span{background:#f4f7f8;border:1px solid #e3e8ec;color:#74818d}

/* ---------- 服务卡片底部对齐 ---------- */
.service-card{display:flex;flex-direction:column}
.service-card .tag-row{margin-top:auto;padding-top:14px}

/* ---------- 案例区微调 ---------- */
.project-photo{height:212px}

/* ---------- 响应式 ---------- */
@media(max-width:900px){
  .hero-grid{gap:26px;padding:44px 0 30px}
  .hero-visual{height:380px}
  .hero-stats{grid-template-columns:1fr 1fr}
  .hero-stats .stat:nth-child(2){border-right:0}
  .hero-stats .stat:nth-child(1),.hero-stats .stat:nth-child(2){border-bottom:1px solid rgba(255,255,255,.1)}
  .service-grid{grid-template-columns:1fr 1fr}
  main .section{padding:70px 0}
}
@media(max-width:680px){
  .hero-grid{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:38px 0 22px}
  .hero h1{font-size:33px}
  .hero-visual{height:300px;margin:14px 0 6px}
  .visual-photo--sub{border-width:4px}
  .hero-visual .visual-card{width:212px;padding:14px 16px;bottom:-4px}
  .visual-card strong{font-size:17px}
  .hero-visual .visual-chip{top:10px;left:8px;padding:9px 11px;font-size:9px}
  .hero-stats{grid-template-columns:1fr 1fr;margin-bottom:24px}
  .hero-stats .stat{padding:16px 18px}
  .hero-stats b{font-size:20px}
  .hero-stats .stat::before{left:18px}
  .bottom-inner{height:48px}
  .service-grid{grid-template-columns:1fr;gap:14px}
  main .section{padding:60px 0}
  .project-photo{height:170px}
}