/* ── HERO ── */
.hero-section { background:#fff; border-bottom:1px solid var(--border); overflow:hidden; position:relative; }
/* 科技点阵网格：径向点 + 边缘渐隐遮罩，营造实验室坐标系/电路板工程感 */
.hero-section::before {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    radial-gradient(rgba(58,82,176,.08) 1px, transparent 1px),
    radial-gradient(rgba(91,120,204,.05) 1px, transparent 1px);
  background-size:28px 28px, 28px 28px;
  background-position:0 0, 14px 14px;
  -webkit-mask-image:radial-gradient(ellipse 78% 72% at 50% 34%, #000 28%, transparent 76%);
  mask-image:radial-gradient(ellipse 78% 72% at 50% 34%, #000 28%, transparent 76%);
}
.hero-bg-blob { position:absolute; top:-140px; right:-140px; width:640px; height:640px; border-radius:50%; background:radial-gradient(circle,rgba(91,120,204,.13) 0%,transparent 68%); pointer-events:none; }
.hero-bg-blob2 { position:absolute; bottom:-100px; left:-100px; width:440px; height:440px; border-radius:50%; background:radial-gradient(circle,rgba(58,82,176,.06) 0%,transparent 68%); pointer-events:none; }
.hero-inner { max-width:1240px; margin:0 auto; padding:100px 2.5rem 92px; display:grid; grid-template-columns:1fr 420px; gap:72px; align-items:center; position:relative; }
.hero-left { animation:fadeUp .7s ease both; }
.hero-eyebrow { display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:700; color:var(--or2); letter-spacing:1.5px; text-transform:uppercase; padding:6px 14px; background:var(--or5); border-radius:20px; border:1px solid var(--or4); margin-bottom:20px; }
.eyebrow-dot { width:6px; height:6px; border-radius:50%; background:var(--or2); animation:pulse 2s infinite; }
.hero-title { font-size:52px; font-weight:800; line-height:1.1; letter-spacing:0; color:var(--dark); margin-bottom:22px; }
/* 重点行：鲜亮蓝→青→紫 tech 渐变（强调色板，与品牌深蓝 token 区分） */
.hero-title em {
  font-style:normal;
  background:linear-gradient(120deg,#1f7ae0 0%,#16b9cc 55%,#6d5dfc 100%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text; color:transparent;
}
.hero-desc { font-size:16px; color:var(--mid); line-height:1.8; margin-bottom:36px; max-width:500px; }
.hero-actions { display:flex; gap:14px; align-items:center; }

/* Hero card */
.hero-right { animation:fadeUp .7s .15s ease both; }
.hero-card {
  background:rgba(255,255,255,.62);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  backdrop-filter:blur(16px) saturate(150%);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:0 14px 44px rgba(58,82,176,.15), inset 0 1px 0 rgba(255,255,255,.65);
  border-radius:22px; padding:32px;
  display:flex; flex-direction:column; gap:16px;
  position:relative; z-index:1;
}
.hc-head { display:flex; align-items:center; justify-content:space-between; }
.hc-live { display:flex; align-items:center; gap:7px; font-size:12px; font-weight:600; color:var(--or2); }
.hc-live-dot { width:7px; height:7px; border-radius:50%; background:#22c55e; animation:pulse 1.5s infinite; }
.hc-date { font-size:11px; color:var(--muted); }
.hc-stats { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.hc-stat { padding:16px; background:rgba(255,255,255,.78); border-radius:12px; border:1px solid rgba(255,255,255,.85); box-shadow:0 1px 0 rgba(255,255,255,.5) inset; transition:transform .2s, box-shadow .2s; }
.hc-stat:hover { transform:translateY(-2px); box-shadow:0 8px 22px rgba(58,82,176,.12); }
.hc-val {
  font-size:26px; font-weight:800; letter-spacing:-0.02em; line-height:1;
  font-variant-numeric:tabular-nums;
  background:linear-gradient(135deg,#1f7ae0,#16b9cc);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text; color:transparent;
}
.hc-val sup { font-size:16px; }
.hc-label { font-size:12px; color:var(--muted); margin-top:4px; font-weight:500; }
.hc-divider { height:1px; background:var(--border); }
.hc-tags { display:flex; gap:7px; flex-wrap:wrap; }
.hc-tag { font-size:11px; font-weight:600; padding:5px 12px; border-radius:20px; background:#fff; color:var(--or1); border:1px solid var(--border); transition:all .15s; }
.hc-tag:hover { background:var(--or5); border-color:var(--or3); }

/* Philosophy band background gradient */
.stats-band { background:linear-gradient(135deg,var(--or1) 0%,var(--or2) 55%,var(--or3) 100%); padding:29px 2.5rem; position:relative; overflow:hidden; }

/* Philosophy Band */
.phi-band-inner { max-width:1240px; margin:0 auto; text-align:center; padding:8px 0; }
.phi-band-tag { font-size:12px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,.88); margin-bottom:10px; }
.phi-band-main { font-size:48px; font-weight:800; color:#fff; letter-spacing:0; line-height:1.1; margin-bottom:10px; }
.phi-band-sub { font-size:14px; font-weight:500; color:rgba(255,255,255,.78); letter-spacing:1px; }

/* 二级标题关键词高亮：鲜亮蓝→青渐变（只包关键词，勿整块变色） */
.section-title em {
  font-style:normal;
  background:linear-gradient(120deg,#1f7ae0,#16b9cc);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text; color:transparent;
}

/* Services */
.svc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.svc-card { background:#fff; border:1px solid var(--border); border-radius:16px; padding:28px; cursor:pointer; transition:all .22s; position:relative; overflow:hidden; }
.svc-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--or1),var(--or3)); transform:scaleX(0); transform-origin:left; transition:transform .3s ease; }
.svc-card:hover { border-color:var(--or3); box-shadow:0 8px 32px rgba(58,82,176,.12); transform:translateY(-4px); }
.svc-card:hover::before { transform:scaleX(1); }
.svc-header { display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.svc-icon { width:52px; height:52px; flex-shrink:0; border-radius:14px; background:var(--or5); display:flex; align-items:center; justify-content:center; font-size:24px; transition:transform .2s; }
.svc-card:hover .svc-icon { transform:scale(1.1) rotate(-4deg); }
.svc-icon svg { width:26px; height:26px; color:var(--or1); }
.svc-title { font-size:17px; font-weight:700; color:var(--dark); margin-bottom:0; }
.svc-desc { font-size:13.5px; color:var(--mid); line-height:1.7; margin-bottom:18px; }
.svc-chips { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:18px; }
.svc-link {
  font-size:13px; font-weight:700; transition:letter-spacing .15s;
  background:linear-gradient(90deg,#1f7ae0,#16b9cc);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text; color:transparent;
}
.svc-card:hover .svc-link { letter-spacing:.5px; }

/* WorldSkills */
.ws-section { background:#fff; border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:80px 2.5rem; }
.ws-inner { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:1fr 480px; gap:80px; align-items:center; }
.ws-text p { font-size:15px; color:var(--mid); line-height:1.8; margin:14px 0 32px; }
.ws-visual { background:var(--or5); border:1px solid var(--border); border-radius:22px; padding:36px; }
.ws-trophy { text-align:center; font-size:64px; margin-bottom:24px; }
.ws-trophy svg { width:64px; height:64px; color:var(--or1); }
.case-thumb svg { width:60px; height:60px; color:var(--or2); opacity:.9; }
.ws-badges { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ws-badge { background:#fff; border:1px solid var(--border); border-radius:12px; padding:14px 16px; text-align:center; transition:all .18s; }
.ws-badge:hover { border-color:var(--or3); transform:translateY(-2px); }
.ws-badge-title { font-size:14px; font-weight:700; color:var(--dark); }
.ws-badge-sub { font-size:11px; color:var(--muted); margin-top:4px; font-weight:500; }

/* Cases */
.cases-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.case-card { background:#fff; border:1px solid var(--border); border-radius:16px; overflow:hidden; cursor:pointer; transition:all .22s; display:flex; flex-direction:column; }
.case-card:hover { border-color:var(--or3); box-shadow:0 8px 32px rgba(58,82,176,.12); transform:translateY(-4px); }
.case-thumb { height:160px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.case-thumb.c1 { background:linear-gradient(135deg,#eef2fb,#d7e1f6); }
.case-thumb.c2 { background:linear-gradient(135deg,#eaf0fc,#cfddf4); }
.case-thumb.c3 { background:linear-gradient(135deg,#f0f4fc,#dde7f7); }
/* 真实项目照片：统一降饱和 + 蓝色调叠加，保持版面色彩统一 */
.case-thumb img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.88); transition:transform .35s ease; }
.case-thumb::after { content:''; position:absolute; inset:0; background:linear-gradient(160deg,rgba(58,82,176,.18),rgba(58,82,176,0) 55%); pointer-events:none; }
.case-card:hover .case-thumb img { transform:scale(1.045); }
.case-badge { position:absolute; top:12px; left:12px; z-index:1; font-size:11px; font-weight:700; color:var(--or1); background:#fff; padding:4px 10px; border-radius:20px; border:1px solid var(--or4); }
.case-body { padding:20px; flex:1; }
.case-type { font-size:11px; font-weight:700; color:var(--or2); text-transform:uppercase; letter-spacing:.8px; margin-bottom:8px; }
.case-title { font-size:14.5px; font-weight:700; color:var(--dark); margin-bottom:8px; line-height:1.45; }
.case-meta { font-size:12px; color:var(--muted); font-weight:500; }
.case-footer { padding:12px 20px; border-top:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; }
.case-result { font-size:12px; color:var(--or1); font-weight:600; }
.case-arrow { font-size:14px; color:var(--or3); transition:transform .15s; }
.case-card:hover .case-arrow { transform:translateX(5px); }

/* Partners */
.partners-section { padding:56px 2.5rem; border-top:1px solid var(--border); background:var(--or6); }
.partners-label { font-size:12px; font-weight:700; color:var(--muted); letter-spacing:2px; text-transform:uppercase; text-align:center; margin-bottom:28px; }
.partners-logos { display:flex; align-items:center; justify-content:center; gap:16px 18px; flex-wrap:wrap; }
.partner-pill { display:inline-flex; align-items:center; min-height:46px; font-size:13px; font-weight:600; color:var(--muted); padding:9px 22px; border:1px solid var(--border); border-radius:10px; background:#fff; transition:all .2s; }
.partner-pill:hover { border-color:var(--or3); color:var(--or1); transform:translateY(-2px); box-shadow:0 6px 18px rgba(58,82,176,.1); }

/* CTA：深蓝渐变卡片收口，反白文字 + 白色按钮 */
.cta-section { padding:48px 2.5rem; }
.cta-box { max-width:900px; margin:0 auto; border-radius:20px; padding:44px 48px; text-align:center; position:relative; overflow:hidden; background:linear-gradient(135deg,var(--or1) 0%,#4763BE 60%,var(--or2) 100%); box-shadow:0 14px 44px rgba(58,82,176,.22); }
.cta-box::before { content:''; position:absolute; top:-80px; right:-60px; width:280px; height:280px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.16),transparent 70%); pointer-events:none; }
.cta-box h2 { font-size:26px; font-weight:800; color:#fff; margin-bottom:10px; letter-spacing:0; position:relative; }
.cta-box p { font-size:14px; color:rgba(255,255,255,.82); margin-bottom:28px; font-weight:500; position:relative; }
.cta-acts { display:flex; gap:14px; justify-content:center; position:relative; }

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
  .hero-inner { grid-template-columns: 1fr; gap: 36px; padding: 52px 1.25rem 48px; }
  .hero-right { display: block; }
  .hero-card { animation: none; padding: 22px; }
  .hc-head, .hc-divider, .hc-tags { display: none; }
  .hero-title { font-size: 34px; }
  .hero-actions { flex-wrap: wrap; gap: 10px; }

  .stats-band { padding: 20px 1.25rem; }

  .svc-grid { grid-template-columns: 1fr; gap: 14px; }

  .ws-section { padding: 52px 1.25rem; }
  .ws-inner { grid-template-columns: 1fr; gap: 40px; }

  .cases-grid { grid-template-columns: 1fr; gap: 14px; }

  .phi-band-main { font-size: 30px; }

  .partners-section { padding: 40px 1.25rem; }

  .cta-section { padding: 36px 1.25rem; }
  .cta-box { padding: 32px 20px; }
  .cta-box h2 { font-size: 22px; }
  .cta-acts { flex-direction: column; align-items: stretch; gap: 10px; }
  .cta-acts .btn-white, .cta-acts .btn-outline-white { justify-content: center; }
}

@media (max-width: 480px) {
  .hero-title { font-size: 28px; }
}