/*
Theme Name: 金泰达官网 · 清泉蓝
Theme URI: https://jtd-tech.com
Author: KS-JTD
Description: 昆山金泰达电子科技有限公司官网主题（方案B · 清泉蓝灵动版）——静态转制版，内容写死与原稿一致。
Version: 1.1.9
Text Domain: jtd-theme
*/

/* v1.1.8 页脚备案号 */
.foot-row .icp { margin: 4px 0 0; }
.foot-row .icp a { color: inherit; text-decoration: none; opacity: .75; }
.foot-row .icp a:hover { opacity: 1; text-decoration: underline; }

/* v1.1.8 核心竞争力·特色卡要点列表（修复转制遗漏的字段渲染） */
.edge-big .edge-fl { margin: 10px 0 0; padding: 0; list-style: none; }
.edge-big .edge-fl li { position: relative; padding-left: 15px; font-size: 13px; line-height: 1.75; color: var(--ink-soft); }
.edge-big .edge-fl li::before { content: ""; position: absolute; left: 0; top: .6em; width: 7px; height: 7px; border-radius: 2px; background: var(--azure); }

/* ============================================================
     方案B · 清泉蓝 · 灵动版
     设计方向：浅色通透 + 流体曲线（液冷意象）+ bento 布局
     色彩令牌实测自公司 PDF（2026-09-07 像素采样）
     ============================================================ */
  :root {
    --azure: #48A8D8;
    --azure-deep: #2E8FC4;
    --azure-bright: #50C0F0;
    --navy: #205078;
    --navy-dark: #103050;
    --ink: #14314B;
    --ink-soft: #5A7890;
    --mist: #EFF7FC;
    --mist-2: #E1F0F9;
    --line: #D9E9F3;
    --paper: #FFFFFF;
    --font-num: "Space Grotesk", "Noto Sans SC", sans-serif;
    --font-cn: "Noto Sans SC", "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    --s1: 8px; --s2: 16px; --s3: 24px; --s4: 32px; --s5: 48px; --s6: 64px; --s7: 96px; --s8: 128px;
    --r-lg: 24px; --r-md: 16px; --r-sm: 12px;
  }
  * { margin: 0; padding: 0; box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { font-family: var(--font-cn); color: var(--ink); background: var(--paper); line-height: 1.7; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
  img { display: block; max-width: 100%; }
  a { text-decoration: none; color: inherit; }
  .wrap { max-width: 1180px; margin: 0 auto; padding: 0 var(--s4); }

  /* ---------- 通用 ---------- */
  .pill {
    display: inline-flex; align-items: center; gap: var(--s1);
    padding: 7px 18px; border-radius: 999px; font-size: 13px; font-weight: 700;
    background: rgba(72,168,216,.1); color: var(--azure-deep); border: 1px solid rgba(72,168,216,.25);
  }
  .pill .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--azure); }
  .sec-title { font-size: 36px; font-weight: 900; line-height: 1.3; letter-spacing: .01em; }
  .sec-title .grad { background: linear-gradient(100deg, var(--azure-deep), var(--azure-bright)); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .sec-sub { color: var(--ink-soft); font-size: 16px; max-width: 600px; margin-top: var(--s2); }
  .sec-head { margin-bottom: var(--s6); }
  .btn {
    display: inline-flex; align-items: center; gap: var(--s1);
    padding: 14px 30px; border-radius: 999px; font-size: 15px; font-weight: 700; transition: all .25s;
  }
  .btn-primary { background: linear-gradient(120deg, var(--azure-deep), var(--azure)); color: #fff; box-shadow: 0 10px 26px rgba(72,168,216,.35); }
  .btn-primary:hover { transform: translateY(-3px) scale(1.02); box-shadow: 0 16px 36px rgba(72,168,216,.45); }
  .btn-outline { border: 1.5px solid var(--line); color: var(--navy); background: #fff; }
  .btn-outline:hover { border-color: var(--azure); color: var(--azure-deep); transform: translateY(-3px); }
  .reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s cubic-bezier(.2,.7,.3,1), transform .8s cubic-bezier(.2,.7,.3,1); }
  .reveal.in { opacity: 1; transform: none; }

  /* ---------- 导航（胶囊浮动） ---------- */
  .navdock { position: fixed; top: var(--s2); left: 50%; transform: translateX(-50%); z-index: 100; width: min(1120px, calc(100% - 32px)); }
  .navdock-inner {
    display: flex; align-items: center; justify-content: space-between; height: 64px;
    background: rgba(255,255,255,.8); backdrop-filter: blur(16px);
    border: 1px solid rgba(217,233,243,.9); border-radius: 999px; padding: 0 10px 0 20px;
    box-shadow: 0 8px 32px rgba(16,48,80,.08); transition: box-shadow .3s;
  }
  .navdock.scrolled .navdock-inner { box-shadow: 0 12px 40px rgba(16,48,80,.14); }
  .brand img { height: 38px; width: auto; }
  .nav-links { display: flex; gap: 4px; list-style: none; }
  .nav-links a { font-size: 14px; font-weight: 500; color: var(--ink); padding: 8px 16px; border-radius: 999px; transition: background .2s, color .2s; }
  .nav-links a:hover { background: rgba(72,168,216,.1); color: var(--azure-deep); }
  .nav-cta { background: var(--navy-dark); color: #fff; font-size: 14px; font-weight: 700; padding: 11px 24px; border-radius: 999px; transition: background .25s, transform .25s; }
  .nav-cta:hover { background: var(--navy); transform: translateY(-1px); }

  /* ---------- Hero（浅色流体） ---------- */
  .hero { position: relative; padding: 180px 0 var(--s7); overflow: hidden; }
  .hero .blob { position: absolute; border-radius: 50%; filter: blur(60px); opacity: .55; pointer-events: none; }
  .blob-1 { width: 560px; height: 560px; background: radial-gradient(circle, rgba(80,192,240,.45), transparent 70%); top: -160px; right: -80px; animation: drift 14s ease-in-out infinite; }
  .blob-2 { width: 420px; height: 420px; background: radial-gradient(circle, rgba(72,168,216,.3), transparent 70%); bottom: -120px; left: -100px; animation: drift 18s ease-in-out 4s infinite; }
  @keyframes drift { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(30px,20px) scale(1.08); } }
  .hero-grid { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: var(--s6); align-items: center; }
  .hero h1 { font-size: 54px; font-weight: 900; line-height: 1.22; margin: var(--s3) 0; }
  .hero h1 .grad { background: linear-gradient(100deg, var(--azure-deep) 10%, var(--azure-bright) 90%); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .hero p { color: var(--ink-soft); font-size: 17px; max-width: 500px; }
  .hero-actions { display: flex; gap: var(--s2); margin-top: var(--s4); }
  .hero-note { display: flex; gap: var(--s2); margin-top: var(--s4); color: var(--ink-soft); font-size: 13px; flex-wrap: wrap; }
  .hero-note span { display: inline-flex; align-items: center; gap: 6px; }
  .hero-note svg { flex: none; }
  .hero-contact { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s4); margin-top: var(--s2); }
  .hero-contact span { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--ink-soft); }
  .hero-contact svg { flex: none; }

  .hero-visual { position: relative; }
  .hero-photo {
    border-radius: 28% 72% 56% 44% / 42% 38% 62% 58%;
    overflow: hidden; box-shadow: 0 40px 90px rgba(32,80,120,.22);
    border: 8px solid #fff; animation: morph 12s ease-in-out infinite;
  }
  @keyframes morph {
    0%,100% { border-radius: 28% 72% 56% 44% / 42% 38% 62% 58%; }
    50% { border-radius: 62% 38% 40% 60% / 55% 60% 40% 45%; }
  }
  .hero-photo img { width: 100%; height: 480px; object-fit: cover; }
  .hero-chip {
    position: absolute; background: #fff; border-radius: var(--r-md); padding: 14px 20px;
    box-shadow: 0 16px 40px rgba(16,48,80,.14); display: flex; flex-direction: column; gap: 2px;
  }
  .hero-chip b { font-family: var(--font-num); font-size: 22px; font-weight: 700; color: var(--azure-deep); }
  .hero-chip span { font-size: 12px; color: var(--ink-soft); }
  .hc-1 { top: 40px; left: -36px; animation: bob 5s ease-in-out infinite; }
  .hc-2 { bottom: 60px; right: -24px; animation: bob 5s ease-in-out 2.5s infinite; }
  @keyframes bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }

  /* 波浪分隔 */
  .wave { display: block; width: 100%; height: 90px; margin-bottom: -1px; }

  /* ---------- 跑马灯 ---------- */
  .marquee { background: var(--navy-dark); color: #fff; padding: var(--s2) 0; overflow: hidden; }
  .marquee-track { display: flex; gap: var(--s5); width: max-content; animation: scrollx 30s linear infinite; }
  .marquee-track span { font-size: 14px; font-weight: 600; letter-spacing: .2em; color: rgba(226,240,250,.85); display: inline-flex; align-items: center; gap: var(--s3); white-space: nowrap; }
  .marquee-track span::after { content: "◆"; font-size: 8px; color: var(--azure); }
  @keyframes scrollx { to { transform: translateX(-50%); } }

  /* ---------- 关于（bento） ---------- */
  .section { padding: var(--s8) 0; }
  .section.tint { background: linear-gradient(180deg, var(--mist) 0%, #fff 100%); }
  .bento-about { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--s2); }
  .b-about-main { grid-column: span 7; background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--s5); box-shadow: 0 12px 36px rgba(16,48,80,.06); }
  .b-about-main p { color: var(--ink-soft); font-size: 15px; margin-top: var(--s2); }
  .b-about-main p strong { color: var(--ink); }
  .b-stat { grid-column: span 5; display: grid; grid-template-columns: 1fr 1fr; gap: var(--s2); }
  .stat-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--s3); display: flex; flex-direction: column; justify-content: center; transition: transform .25s, box-shadow .25s; }
  .stat-card:hover { transform: translateY(-4px); box-shadow: 0 16px 32px rgba(16,48,80,.1); }
  .stat-card .num { font-family: var(--font-num); font-size: 32px; font-weight: 700; line-height: 1.1; background: linear-gradient(120deg, var(--navy), var(--azure-deep)); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .stat-card .num em { font-style: normal; font-size: 15px; }
  .stat-card .label { font-size: 13px; color: var(--ink-soft); margin-top: 4px; }
  .b-cert { grid-column: span 12; display: grid; grid-template-columns: 1fr 1fr; gap: var(--s2); }
  .cert-tile { display: flex; gap: var(--s2); align-items: center; background: linear-gradient(120deg, rgba(72,168,216,.08), rgba(80,192,240,.14)); border: 1px solid rgba(72,168,216,.25); border-radius: var(--r-md); padding: var(--s3) var(--s4); }
  .cert-tile b { display: block; font-size: 16px; }
  .cert-tile span { font-size: 13px; color: var(--ink-soft); }

  /* ---------- 核心竞争力（横向大卡） ---------- */
  .edge-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s2); }
  .edge-big {
    grid-column: span 2; display: grid; grid-template-columns: 1fr 420px; border-radius: var(--r-lg);
    overflow: hidden; background: linear-gradient(120deg, var(--navy-dark) 0%, #1A5E8E 100%); color: #fff;
    box-shadow: 0 28px 60px rgba(16,48,80,.28);
  }
  .edge-big .txt { padding: var(--s5); }
  .edge-big .kicker { font-family: var(--font-num); font-size: 13px; letter-spacing: .3em; color: var(--azure-bright); font-weight: 600; }
  .edge-big h3 { font-size: 26px; font-weight: 900; margin: var(--s2) 0; }
  .edge-big p { color: rgba(226,240,250,.75); font-size: 15px; }
  .edge-big .pic { position: relative; }
  .edge-big .pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .edge-big .pic::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #1A5E8E, transparent 45%); }
  .edge-tile { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--s4); transition: transform .25s, box-shadow .25s; position: relative; overflow: hidden; }
  .edge-tile:hover { transform: translateY(-6px); box-shadow: 0 20px 44px rgba(16,48,80,.12); }
  .edge-tile .num { font-family: var(--font-num); position: absolute; top: 18px; right: 24px; font-size: 44px; font-weight: 700; color: rgba(72,168,216,.14); line-height: 1; }
  .edge-tile h3 { font-size: 19px; font-weight: 700; margin: var(--s2) 0 10px; }
  .edge-tile p { font-size: 14px; color: var(--ink-soft); }
  .edge-tile .ico { width: 50px; height: 50px; border-radius: 14px; background: linear-gradient(135deg, rgba(72,168,216,.14), rgba(80,192,240,.28)); display: grid; place-items: center; }
  .edge-tile.wide { grid-column: span 2; }

  /* ---------- 产品（自动滚动轨） ---------- */
  .rail-outer { display: flex; align-items: stretch; gap: var(--s2); }
  .rail-viewport { flex: 1; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
  .rail-viewport::-webkit-scrollbar { display: none; }
  .rail { display: flex; width: max-content; padding: var(--s1) 0 var(--s3); }
  .rail > .prod-tile { width: 340px; flex: none; margin-right: var(--s3); }
  .rail-btn {
    flex: none; align-self: center; width: 46px; height: 46px; border-radius: 50%;
    border: 1.5px solid var(--line); background: #fff; color: var(--azure-deep);
    display: grid; place-items: center; cursor: pointer;
    transition: border-color .25s, background .25s, transform .25s, box-shadow .25s;
    box-shadow: 0 6px 18px rgba(16,48,80,.08);
  }
  .rail-btn:hover { border-color: var(--azure); background: rgba(72,168,216,.08); box-shadow: 0 10px 24px rgba(16,48,80,.14); }
  .rail-btn.prev:hover { transform: translateX(-2px); }
  .rail-btn.next:hover { transform: translateX(2px); }
  .rail-btn svg { width: 20px; height: 20px; }
  .prod-tile { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; transition: transform .25s, box-shadow .25s; }
  .prod-tile:hover { transform: translateY(-6px); box-shadow: 0 24px 48px rgba(16,48,80,.14); }
  .prod-tile .pic { position: relative; aspect-ratio: 4/3; overflow: hidden; }
  .prod-tile.cert .pic { aspect-ratio: auto; background: var(--mist); display: flex; align-items: center; justify-content: center; }
  .prod-tile.cert .pic img { width: 100%; height: 300px; object-fit: contain; }
  .prod-tile .pic img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
  .prod-tile:hover .pic img { transform: scale(1.06); }
  .prod-tile .tag { position: absolute; top: 14px; left: 14px; padding: 5px 14px; border-radius: 999px; background: rgba(255,255,255,.92); color: var(--azure-deep); font-size: 12px; font-weight: 700; border: 1px solid rgba(72,168,216,.3); }
  .prod-tile .body { padding: var(--s3); }
  .prod-tile h3 { font-size: 18px; font-weight: 700; }
  .prod-tile p { font-size: 13.5px; color: var(--ink-soft); margin: 8px 0 12px; }
  .spec-chips { display: flex; flex-wrap: wrap; gap: 6px; }
  .chip { font-size: 11.5px; font-weight: 600; color: var(--azure-deep); background: rgba(72,168,216,.09); padding: 3px 10px; border-radius: 999px; font-family: var(--font-num); }

  /* ---------- 液冷全链条 ---------- */
  .chain { position: relative; background: linear-gradient(165deg, #F3FAFE 0%, #E3F2FA 55%, #D8EEF9 100%); overflow: hidden; }
  .chain .liquid { position: absolute; left: -10%; right: -10%; height: 340px; background: radial-gradient(50% 60% at 50% 50%, rgba(72,168,216,.18), transparent 75%); top: 20%; filter: blur(10px); }
  .chain-inner { position: relative; }
  .chain-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s2); margin-bottom: var(--s5); }
  .chain-card { background: rgba(255,255,255,.75); backdrop-filter: blur(6px); border: 1px solid rgba(72,168,216,.22); border-radius: var(--r-md); padding: var(--s3) var(--s4); display: flex; align-items: center; gap: var(--s2); }
  .chain-card .n { font-family: var(--font-num); font-size: 14px; font-weight: 700; color: #fff; width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg, var(--azure-deep), var(--azure-bright)); display: grid; place-items: center; flex: none; }
  .chain-card b { font-size: 16px; }
  .pipe { display: flex; align-items: center; gap: 0; margin-bottom: var(--s6); flex-wrap: wrap; row-gap: var(--s3); }
  .pipe-node { flex: 1; min-width: 150px; text-align: center; position: relative; }
  .pipe-node .cap {
    margin: 0 auto var(--s2); width: 72px; height: 72px; border-radius: 22px;
    background: #fff; border: 1.5px solid rgba(72,168,216,.35); box-shadow: 0 10px 26px rgba(32,80,120,.12);
    display: grid; place-items: center; font-size: 26px; transition: transform .3s, box-shadow .3s; position: relative; z-index: 2;
  }
  .pipe-node:hover .cap { transform: translateY(-6px) rotate(-3deg); box-shadow: 0 18px 36px rgba(32,80,120,.2); }
  .pipe-node:not(:last-child)::after { content: ""; position: absolute; top: 36px; left: calc(50% + 44px); right: calc(-50% + 44px); height: 2.5px; background: linear-gradient(90deg, var(--azure), var(--azure-bright)); border-radius: 2px; }
  .pipe-node b { display: block; font-size: 14px; }
  .pipe-node span { font-size: 12px; color: var(--ink-soft); }
  .matrix { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s2); }
  .mx-tile { background: #fff; border-radius: var(--r-md); padding: var(--s3); border: 1px solid rgba(72,168,216,.2); transition: transform .25s, box-shadow .25s; }
  .mx-tile:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(32,80,120,.14); }
  .mx-tile h4 { font-size: 15.5px; font-weight: 700; color: var(--navy); display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
  .mx-tile h4::before { content: ""; width: 8px; height: 8px; border-radius: 3px; background: linear-gradient(135deg, var(--azure-deep), var(--azure-bright)); }
  .mx-tile p { font-size: 13px; color: var(--ink-soft); }

  /* ---------- 生产能力 ---------- */
  .cap-band { display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--s2); margin-bottom: var(--s4); }
  .cap-tile { position: relative; border-radius: var(--r-md); padding: var(--s4) var(--s2) var(--s3); text-align: center; color: #fff; overflow: hidden; }
  .cap-tile:nth-child(odd) { background: linear-gradient(150deg, #1A5E8E, var(--navy)); }
  .cap-tile:nth-child(even) { background: linear-gradient(150deg, #2E8FC4, #48A8D8); }
  .cap-tile .num { font-family: var(--font-num); font-size: 30px; font-weight: 700; }
  .cap-tile .num em { font-style: normal; font-size: 14px; opacity: .85; }
  .cap-tile .name { font-size: 13px; opacity: .85; margin-top: 4px; }
  .cap-tile::after { content: ""; position: absolute; right: -30px; bottom: -30px; width: 90px; height: 90px; border-radius: 50%; background: rgba(255,255,255,.1); }
  .cap-photos { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: var(--s2); }
  .cap-photos figure { border-radius: var(--r-md); overflow: hidden; position: relative; }
  .cap-photos img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
  .cap-photos figure:hover img { transform: scale(1.05); }
  .cap-photos figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 44px 16px 14px; font-size: 13px; color: #fff; background: linear-gradient(transparent, rgba(16,48,80,.85)); }

  /* ---------- 案例（时间轴） ---------- */
  .tl { position: relative; padding-left: 36px; }
  .tl::before { content: ""; position: absolute; left: 10px; top: 8px; bottom: 8px; width: 3px; border-radius: 3px; background: linear-gradient(180deg, var(--azure-bright), var(--azure-deep), rgba(72,168,216,.15)); }
  .tl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s2) var(--s5); }
  .tl-item { position: relative; background: #fff; border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--s3); display: flex; gap: var(--s3); align-items: flex-start; transition: transform .25s, box-shadow .25s; }
  .tl-item:hover { transform: translateX(6px); box-shadow: 0 14px 32px rgba(16,48,80,.1); }
  .tl-item::before { content: ""; position: absolute; left: -31px; top: 26px; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--azure); box-shadow: 0 0 0 4px rgba(72,168,216,.15); }
  .tl-item .yr { font-family: var(--font-num); font-size: 24px; font-weight: 700; color: var(--azure-deep); line-height: 1.2; min-width: 64px; }
  .tl-item h4 { font-size: 15px; font-weight: 700; line-height: 1.5; }
  .tl-item .ind { display: inline-block; margin-top: 6px; font-size: 12px; font-weight: 600; color: var(--azure-deep); background: rgba(72,168,216,.1); border-radius: 999px; padding: 2px 12px; }

  /* ---------- 服务 ---------- */
  .svc-bento { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s2); margin-bottom: var(--s4); }
  .svc-tile { border-radius: var(--r-lg); padding: var(--s4); position: relative; overflow: hidden; transition: transform .25s; }
  .svc-tile:hover { transform: translateY(-5px); }
  .svc-tile.t1 { background: linear-gradient(140deg, #48A8D8, #2E8FC4); color: #fff; }
  .svc-tile.t2 { background: linear-gradient(140deg, #205078, #103050); color: #fff; }
  .svc-tile.t3 { background: #fff; border: 1px solid var(--line); }
  .svc-tile .big { margin-bottom: var(--s2); }
  .svc-tile .big svg { width: 40px; height: 40px; }
  .svc-tile h3 { font-size: 20px; font-weight: 900; margin-bottom: 8px; }
  .svc-tile.t3 h3 { color: var(--navy); }
  .svc-tile p { font-size: 14px; color: rgba(255,255,255,.85); }
  .svc-tile.t3 p { color: var(--ink-soft); }
  .svc-tile .en { font-family: var(--font-num); font-size: 11px; letter-spacing: .35em; opacity: .65; font-weight: 600; }
  .svc-detail { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s4); }
  .step-list { list-style: none; display: grid; gap: var(--s2); }
  .step-list li { display: flex; gap: var(--s2); background: #fff; border: 1px solid var(--line); border-radius: var(--r-sm); padding: var(--s2) var(--s3); align-items: center; transition: border-color .2s; }
  .step-list li:hover { border-color: var(--azure); }
  .step-list .no { flex: none; width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg, var(--azure-deep), var(--azure-bright)); color: #fff; font-family: var(--font-num); font-weight: 700; display: grid; place-items: center; font-size: 15px; }
  .step-list b { display: block; font-size: 15px; }
  .step-list span { font-size: 13px; color: var(--ink-soft); }
  .resp-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--s4); box-shadow: 0 12px 32px rgba(16,48,80,.06); }
  .resp-card h3 { font-size: 18px; font-weight: 900; margin-bottom: var(--s3); display: flex; align-items: center; gap: 10px; }
  .resp-row { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; border-bottom: 1px dashed var(--line); font-size: 14px; }
  .resp-row:last-child { border-bottom: none; }
  .resp-row .v { font-family: var(--font-num); font-weight: 700; color: var(--azure-deep); white-space: nowrap; }

  /* ---------- 联系 ---------- */
  .cta { position: relative; background: linear-gradient(150deg, #0B2440, var(--navy-dark) 55%, #16405F); color: #fff; border-radius: var(--r-lg); padding: var(--s7) var(--s6); overflow: hidden; }
  .cta .ripple { position: absolute; border: 1px solid rgba(80,192,240,.25); border-radius: 50%; animation: ripple 6s ease-out infinite; }
  .ripple.r1 { width: 300px; height: 300px; right: -60px; top: -80px; }
  .ripple.r2 { width: 300px; height: 300px; right: -60px; top: -80px; animation-delay: 2s; }
  .ripple.r3 { width: 300px; height: 300px; right: -60px; top: -80px; animation-delay: 4s; }
  @keyframes ripple { 0% { transform: scale(.6); opacity: 1; } 100% { transform: scale(1.8); opacity: 0; } }
  .cta-grid { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; gap: var(--s6); align-items: center; z-index: 1; }
  .cta h2 { font-size: 38px; font-weight: 900; line-height: 1.35; margin-bottom: var(--s2); }
  .cta h2 .grad { background: linear-gradient(100deg, var(--azure-bright), var(--azure)); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .cta p { color: rgba(226,240,250,.72); margin-bottom: var(--s4); max-width: 480px; }
  .cta-items { display: grid; gap: var(--s2); }
  .cta-item { display: flex; align-items: center; gap: var(--s2); background: rgba(255,255,255,.06); border: 1px solid rgba(80,192,240,.25); border-radius: var(--r-sm); padding: var(--s2) var(--s3); }
  .cta-item .ico { flex: none; width: 40px; height: 40px; border-radius: 50%; background: rgba(80,192,240,.14); display: grid; place-items: center; }
  .cta-item b { display: block; font-size: 11px; letter-spacing: .2em; color: var(--azure-bright); font-weight: 600; }
  .cta-item span { font-size: 14.5px; }

  /* ---------- 页脚 ---------- */
  footer { padding: var(--s6) 0 var(--s5); }
  .foot-row { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--s2); }
  footer p { font-size: 13px; color: var(--ink-soft); }
  footer .slogan { font-weight: 700; color: var(--azure-deep); letter-spacing: .25em; }

  /* ---------- 响应式 ---------- */
  @media (max-width: 1024px) {
    .hero-grid { grid-template-columns: 1fr; }
    .hero h1 { font-size: 40px; }
    .hero-photo img { height: 380px; }
    .edge-big { grid-template-columns: 1fr; }
    .edge-big .pic { min-height: 240px; }
    .edge-row { grid-template-columns: 1fr; }
    .edge-row > .edge-big, .edge-row > .wide { grid-column: auto; }
    .chain-cards, .matrix, .svc-bento, .svc-detail, .tl-grid, .cta-grid { grid-template-columns: 1fr 1fr; }
    .cap-band { grid-template-columns: repeat(3, 1fr); }
    .b-about-main, .b-stat { grid-column: span 12; }
  }
  @media (max-width: 640px) {
    .nav-links { display: none; }
    .rail-btn { display: none; }  /* 手机靠手势滑动，箭头让位给卡片 */
    .hero { padding-top: 140px; }
    .hero h1 { font-size: 32px; }
    .sec-title { font-size: 27px; }
    .chain-cards, .matrix, .svc-bento, .svc-detail, .tl-grid, .cta-grid, .b-cert, .cap-band, .cap-photos { grid-template-columns: 1fr; }
    .tl { padding-left: 28px; }
    .tl-item::before { left: -23px; }
    .pipe-node:not(:last-child)::after { display: none; }
    .section { padding: var(--s6) 0; }
  }