﻿    :root {
      color-scheme: light;
      --ink: #142448;
      --ink-soft: #314365;
      --muted: #6b7b98;
      --blue: #2467e8;
      --blue-deep: #1748bb;
      --cyan: #28b9b4;
      --violet: #7758e8;
      --pink: #e755aa;
      --accent: #cb7046;
      --paper: #f7faff;
      --white: #fff;
      --line: #dce6f4;
      --pale: #eaf2ff;
      --page: 1200px;
      font-family: Inter, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
      font-synthesis: none;
      text-rendering: optimizeLegibility;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body { margin: 0; color: var(--ink); background: var(--paper); }
    a { color: inherit; text-decoration: none; }
    button { color: inherit; font: inherit; }
    button:focus-visible, a:focus-visible { outline: 3px solid #ef9a52; outline-offset: 3px; }
    img { display: block; max-width: 100%; }
    .shell { width: min(var(--page), calc(100% - 56px)); margin-inline: auto; }

    .site-header {
      height: 78px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 28px;
      position: relative;
      z-index: 10;
      border-bottom: 1px solid var(--line);
      background: rgb(247 250 255 / 93%);
    }
    .brand { display: inline-flex; align-items: center; gap: 11px; flex: 0 0 auto; }
    .brand img { width: 48px; height: 48px; object-fit: contain; }
    .brand-copy { display: grid; gap: 3px; }
    .brand-copy strong { font-size: 17px; line-height: 1.2; }
    .brand-copy span { color: var(--muted); font-size: 10px; font-weight: 650; letter-spacing: .01em; }
    .nav { display: flex; align-items: center; gap: 31px; color: var(--ink-soft); font-size: 13px; }
    .nav a { transition: color .2s ease; }
    .nav a:hover { color: var(--blue); }
    .header-cta, .button-primary {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      min-height: 43px;
      padding: 0 17px;
      border: 0;
      border-radius: 7px;
      color: white;
      background: var(--blue);
      font-size: 13px;
      font-weight: 700;
      transition: background .2s ease, transform .2s ease;
    }
    .header-cta:hover, .button-primary:hover { background: var(--blue-deep); transform: translateY(-1px); }
    .menu-toggle { display: none; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 7px; background: var(--white); }
    .menu-toggle svg { width: 19px; height: 19px; }

    .hero-wrap {
      position: relative;
      overflow: hidden;
      background-color: #eff5ff;
      background-image: linear-gradient(rgb(50 103 185 / 4%) 1px, transparent 1px), linear-gradient(90deg, rgb(50 103 185 / 4%) 1px, transparent 1px);
      background-size: 48px 48px;
      border-bottom: 1px solid #d8e5f7;
    }
    .hero-wrap::after {
      content: "";
      position: absolute;
      width: 57%;
      height: 130px;
      left: 25%;
      bottom: -88px;
      border: 1px solid #8bb6f1;
      border-radius: 50%;
      box-shadow: 0 -11px 0 -10px #7a9eed, 0 -24px 0 -23px #8fcce5;
      transform: rotate(-4deg);
      pointer-events: none;
    }
    .hero { min-height: 574px; display: grid; grid-template-columns: .94fr 1.06fr; gap: 44px; align-items: center; padding-block: 68px 82px; position: relative; z-index: 1; }
    .hero-copy { max-width: 530px; }
    .eyebrow { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 19px; color: var(--blue-deep); font-size: 12px; font-weight: 750; }
    .eyebrow::before { content: ""; width: 22px; height: 2px; background: var(--cyan); }
    h1 { margin: 0; font-size: 60px; line-height: 1.24; letter-spacing: 0; font-weight: 780; }
    h1 span { color: var(--blue); }
    .hero-description { max-width: 490px; margin: 20px 0 0; color: var(--muted); font-size: 15px; line-height: 1.95; }
    .hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 28px; }
    .button-primary { min-height: 48px; padding-inline: 20px; }
    .button-primary svg, .button-quiet svg { width: 16px; height: 16px; }
    .button-quiet { display: inline-flex; align-items: center; gap: 7px; color: var(--ink); font-size: 13px; font-weight: 700; }
    .button-quiet:hover { color: var(--blue); }
    .hero-capabilities { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
    .hero-capabilities span { padding: 7px 10px; border: 1px solid #cfdcf0; border-radius: 5px; color: #486082; background: rgb(255 255 255 / 75%); font-size: 11px; }

    .hero-visual { min-width: 0; position: relative; padding: 21px 0 22px 16px; }
    .visual-orbit { position: absolute; z-index: -1; inset: 4% 0 2% 8%; border: 1px solid rgb(64 125 226 / 22%); border-radius: 50%; transform: rotate(-12deg); }
    .visual-orbit::before, .visual-orbit::after { content: ""; position: absolute; inset: 12% -5%; border: 1px solid rgb(76 181 194 / 26%); border-radius: 50%; transform: rotate(25deg); }
    .visual-orbit::after { inset: 24% 0; border-color: rgb(132 103 224 / 19%); transform: rotate(-37deg); }
    .console {
      position: relative;
      overflow: hidden;
      border: 1px solid #cbdaf0;
      border-radius: 11px;
      background: rgb(255 255 255 / 95%);
      box-shadow: 0 27px 65px rgb(42 81 145 / 15%);
      transform: perspective(1200px) rotateY(-5deg) rotateX(2deg);
    }
    .console-top { height: 45px; display: flex; align-items: center; gap: 12px; padding: 0 16px; border-bottom: 1px solid #e5edf7; color: var(--ink-soft); font-size: 10px; }
    .console-brand { display: flex; align-items: center; gap: 7px; margin-right: auto; font-size: 10px; font-weight: 750; }
    .console-brand img { width: 20px; height: 20px; }
    .console-status { display: inline-flex; align-items: center; gap: 5px; color: #4e7b72; }
    .console-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); }
    .console-body { min-height: 332px; display: grid; grid-template-columns: 132px 1fr; }
    .console-side { display: grid; align-content: start; gap: 7px; padding: 17px 10px; border-right: 1px solid #e7edf6; background: #f9fbff; }
    .console-side span { padding: 9px 9px; border-radius: 5px; color: #7a89a3; font-size: 9px; }
    .console-side .current { color: var(--blue-deep); background: #e9f1ff; font-weight: 700; }
    .console-main { min-width: 0; padding: 18px 17px 15px; }
    .console-heading { display: flex; align-items: start; justify-content: space-between; gap: 10px; }
    .console-heading strong { display: block; font-size: 14px; }
    .console-heading span { display: block; margin-top: 4px; color: #8a98ad; font-size: 9px; }
    .console-date { padding: 6px 8px; border: 1px solid #e2eaf5; border-radius: 5px; color: #74849e; font-size: 8px; white-space: nowrap; }
    .console-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-top: 16px; }
    .console-kpi { padding: 11px 10px; border: 1px solid #e6edf7; border-radius: 6px; background: white; }
    .console-kpi span { display: block; color: #7888a2; font-size: 8px; }
    .console-kpi strong { display: block; margin-top: 7px; color: var(--ink); font-size: 19px; font-weight: 730; }
    .console-kpi small { display: inline-block; margin-left: 4px; color: #3b9b88; font-size: 8px; }
    .console-kpi:nth-child(2) strong { color: #6854cc; }
    .console-kpi:nth-child(3) strong { color: #258c9b; }
    .chart-panel { margin-top: 11px; padding: 12px 12px 9px; border: 1px solid #e6edf7; border-radius: 6px; }
    .chart-title { display: flex; justify-content: space-between; color: #596a87; font-size: 9px; }
    .chart-title span:last-child { color: #99a6b8; font-size: 8px; }
    .chart { height: 94px; display: flex; align-items: end; gap: 8px; padding: 12px 5px 4px; border-bottom: 1px solid #edf1f7; background: repeating-linear-gradient(to bottom, transparent 0 22px, #eef3fa 23px 24px); }
    .chart i { flex: 1; min-width: 5px; height: var(--bar); border-radius: 3px 3px 0 0; background: linear-gradient(180deg, #64baf0, #3b78ea); }
    .chart i:nth-child(3n) { background: linear-gradient(180deg, #a88aef, #7557df); }
    .console-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
    .console-note { display: flex; align-items: center; gap: 8px; padding: 9px; border-radius: 5px; background: #f5f8fd; color: #647590; font-size: 8px; }
    .console-note b { color: var(--blue-deep); font-size: 10px; }
    .float-label { position: absolute; display: flex; align-items: center; gap: 9px; padding: 10px 13px; border: 1px solid #d6e2f3; border-radius: 7px; background: white; box-shadow: 0 10px 30px rgb(41 72 128 / 11%); }
    .float-label strong { display: block; font-size: 10px; }
    .float-label span { display: block; margin-top: 3px; color: var(--muted); font-size: 8px; }
    .float-icon { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 6px; color: white; background: var(--violet); font-size: 11px; font-weight: 800; }
    .float-label.ai { right: -20px; top: 3px; }
    .float-label.ai .float-icon { background: var(--violet); }
    .float-label.wechat { left: -18px; bottom: 9px; }
    .float-label.wechat .float-icon { background: var(--cyan); }

    .capability-strip { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(3, 1fr); margin-top: -36px; border: 1px solid #d8e3f2; border-radius: 8px; background: white; box-shadow: 0 12px 35px rgb(33 72 135 / 7%); }
    .capability { min-height: 84px; display: flex; align-items: center; gap: 13px; padding: 17px 22px; border-right: 1px solid #e5ebf4; }
    .capability:last-child { border-right: 0; }
    .capability-mark { width: 36px; height: 36px; flex: 0 0 36px; display: grid; place-items: center; border-radius: 8px; color: var(--blue); background: #ecf3ff; }
    .capability-mark svg { width: 18px; height: 18px; }
    .capability:nth-child(2) .capability-mark { color: var(--violet); background: #f1edff; }
    .capability:nth-child(3) .capability-mark { color: #168e8d; background: #e7f8f6; }
    .capability strong { display: block; font-size: 12px; }
    .capability span { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }

    .section { padding-block: 105px; }
    .section-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 38px; }
    .section-label { margin: 0 0 10px; color: var(--blue); font-size: 11px; font-weight: 750; }
    h2 { max-width: 680px; margin: 0; font-size: 36px; line-height: 1.35; letter-spacing: 0; }
    .section-head > p { max-width: 390px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.9; }

    .product-section { padding-top: 88px; }
    .product-switch { display: inline-grid; grid-template-columns: repeat(2, minmax(140px, 1fr)); gap: 4px; margin-bottom: 21px; padding: 4px; border: 1px solid var(--line); border-radius: 7px; background: white; }
    .product-switch button { min-height: 37px; padding: 0 12px; border: 0; border-radius: 4px; color: var(--muted); background: transparent; font-size: 11px; font-weight: 650; cursor: pointer; }
    .product-switch button[aria-pressed="true"] { color: white; background: var(--blue); }
    .product-panel { display: grid; grid-template-columns: .92fr 1.08fr; min-height: 405px; overflow: hidden; border: 1px solid #d8e4f4; border-radius: 10px; background: #fff; box-shadow: 0 14px 38px rgb(38 78 135 / 6%); }
    .product-panel[hidden] { display: none; }
    .product-copy { display: flex; flex-direction: column; align-items: start; justify-content: center; padding: 44px 48px; }
    .product-brand { display: inline-flex; align-items: center; gap: 8px; color: var(--blue-deep); font-size: 11px; font-weight: 750; }
    .product-brand i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
    .product-copy h3 { margin: 15px 0 0; font-size: 29px; line-height: 1.4; }
    .product-copy > p { max-width: 430px; margin: 11px 0 0; color: var(--muted); font-size: 12px; line-height: 1.9; }
    .product-points { display: grid; gap: 10px; margin: 23px 0 25px; padding: 0; list-style: none; }
    .product-points li { display: flex; align-items: start; gap: 9px; color: #425473; font-size: 11px; line-height: 1.6; }
    .check { width: 16px; height: 16px; flex: 0 0 16px; display: grid; place-items: center; margin-top: 1px; border-radius: 50%; color: white; background: var(--cyan); font-size: 10px; }
    .product-link { display: inline-flex; align-items: center; gap: 8px; color: var(--blue); font-size: 11px; font-weight: 750; }
    .product-link:hover { color: var(--blue-deep); }
    .product-link svg { width: 14px; height: 14px; }
    .product-art { min-width: 0; display: grid; align-items: center; padding: 35px; background: #eef4ff; }
    .product-art-wrap { width: 100%; }
    .mockup-caption { margin: 11px 2px 0; color: #72829a; font-size: 9px; line-height: 1.7; }
    .geo-art { background: linear-gradient(135deg, #edf5ff 0%, #eef0ff 55%, #effbfa 100%); }
    .mini-app { overflow: hidden; border: 1px solid #d8e3f1; border-radius: 8px; background: white; box-shadow: 0 17px 36px rgb(45 73 122 / 12%); }
    .mini-app-head { display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-bottom: 1px solid #e7edf5; }
    .mini-app-head img { width: 22px; height: 22px; }
    .mini-app-head strong { font-size: 10px; }
    .mini-app-head span { margin-left: auto; color: #8392a7; font-size: 8px; }
    .geo-dashboard { display: grid; grid-template-columns: 112px 1fr; min-height: 253px; }
    .mini-sidebar { display: grid; align-content: start; gap: 7px; padding: 15px 9px; border-right: 1px solid #e8edf5; background: #f9fbfe; }
    .mini-sidebar span { padding: 7px 8px; border-radius: 4px; color: #8391a6; font-size: 8px; }
    .mini-sidebar .is-active { color: var(--blue); background: #eaf2ff; font-weight: 700; }
    .geo-content { padding: 14px; }
    .geo-content h4 { margin: 0; font-size: 12px; }
    .geo-content > p { margin: 4px 0 13px; color: #8391a6; font-size: 8px; }
    .geo-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
    .geo-stat { min-height: 58px; padding: 9px 8px; border: 1px solid #e6edf6; border-radius: 5px; }
    .geo-stat span { display: block; color: #8492a6; font-size: 7px; }
    .geo-stat strong { display: block; margin-top: 6px; font-size: 14px; }
    .geo-stat:nth-child(2) strong { color: var(--violet); }
    .geo-stat:nth-child(3) strong { color: #1e9691; }
    .geo-lower { display: grid; grid-template-columns: 1.2fr .8fr; gap: 8px; margin-top: 8px; }
    .geo-chart, .geo-summary { min-height: 100px; padding: 10px; border: 1px solid #e6edf6; border-radius: 5px; }
    .geo-chart strong, .geo-summary strong { display: block; color: #576987; font-size: 8px; }
    .geo-bars { height: 55px; display: flex; align-items: end; gap: 5px; margin-top: 7px; padding: 4px; background: repeating-linear-gradient(to bottom, transparent 0 17px, #edf2f8 18px 19px); }
    .geo-bars i { flex: 1; height: var(--h); border-radius: 2px 2px 0 0; background: #4281ec; }
    .geo-bars i:nth-child(even) { background: #8c70e7; }
    .source-list { display: grid; gap: 7px; margin-top: 10px; }
    .source-list span { height: 5px; border-radius: 4px; background: #e9eff7; }
    .source-list span:nth-child(2) { width: 78%; background: #c8dcff; }
    .source-list span:nth-child(3) { width: 58%; background: #d8f2ef; }

    .aigc-art { background: linear-gradient(135deg, #f0f3ff 0%, #f5f1ff 55%, #eff8ff 100%); }
    .aigc-app { display: grid; grid-template-columns: 108px 1fr; min-height: 290px; }
    .aigc-sidebar { display: grid; align-content: start; gap: 6px; padding: 13px 8px; border-right: 1px solid #e7ebf4; background: #fafbff; }
    .aigc-sidebar strong { margin: 0 5px 7px; font-size: 9px; }
    .aigc-sidebar span { padding: 7px; border-radius: 4px; color: #8190a8; font-size: 8px; }
    .aigc-sidebar .is-active { color: #6247c8; background: #f0edff; }
    .aigc-main { min-width: 0; padding: 14px; }
    .aigc-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
    .aigc-toolbar strong { font-size: 11px; }
    .aigc-toolbar span { padding: 6px 9px; border-radius: 4px; color: white; background: #7559dc; font-size: 7px; }
    .creation-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
    .creation-card { min-height: 77px; display: flex; flex-direction: column; justify-content: end; gap: 7px; padding: 9px; overflow: hidden; border-radius: 5px; color: #fff; background: linear-gradient(145deg, #49a2ec, #3764d7); }
    .creation-card:nth-child(2), .creation-card:nth-child(5) { background: linear-gradient(145deg, #a76be8, #6556d7); }
    .creation-card:nth-child(3), .creation-card:nth-child(6) { background: linear-gradient(145deg, #e776b9, #8354d6); }
    .creation-card i { width: 22px; height: 22px; display: grid; place-items: center; border: 1px solid rgb(255 255 255 / 48%); border-radius: 6px; font-style: normal; font-size: 10px; }
    .creation-card b { font-size: 8px; }
    .task-list { display: grid; gap: 7px; margin-top: 12px; }
    .task-row { display: flex; align-items: center; gap: 7px; padding: 8px; border: 1px solid #e9edf4; border-radius: 4px; color: #65748c; font-size: 8px; }
    .task-row i { width: 6px; height: 6px; border-radius: 50%; background: #50b6a9; }
    .task-row span:last-child { margin-left: auto; color: #9aa6b8; }

    .service-section { background: #fff; border-block: 1px solid var(--line); }
    .service-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
    .service-card { min-height: 245px; padding: 27px 27px 29px 0; border-right: 1px solid var(--line); }
    .service-card + .service-card { padding-left: 27px; }
    .service-card:last-child { padding-right: 0; border-right: 0; }
    .service-icon { width: 39px; height: 39px; display: grid; place-items: center; margin-bottom: 20px; border-radius: 8px; color: var(--blue); background: #edf4ff; }
    .service-icon svg { width: 19px; height: 19px; }
    .service-card:nth-child(2) .service-icon { color: var(--violet); background: #f2efff; }
    .service-card:nth-child(3) .service-icon { color: #148e8c; background: #e9f8f5; }
    .service-card h3 { margin: 0; font-size: 18px; }
    .service-card p { max-width: 340px; margin: 10px 0 0; color: var(--muted); font-size: 11px; line-height: 1.9; }
    .service-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 18px; }
    .service-tags span { padding: 5px 7px; border: 1px solid #e3eaf4; border-radius: 4px; color: #72819a; font-size: 9px; }

    .geo-process { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
    .process-step { position: relative; min-height: 177px; padding: 24px 23px 26px 0; border-right: 1px solid var(--line); }
    .process-step + .process-step { padding-left: 23px; }
    .process-step:last-child { padding-right: 0; border-right: 0; }
    .process-step small { color: var(--blue); font-size: 10px; font-weight: 750; }
    .process-step h3 { margin: 14px 0 0; font-size: 16px; }
    .process-step p { max-width: 235px; margin: 8px 0 0; color: var(--muted); font-size: 10px; line-height: 1.85; }
    .process-step:not(:last-child)::after { content: ""; position: absolute; top: 31px; right: 18px; width: 18px; height: 1px; background: #9db6dc; }
    .process-step:not(:last-child)::before { content: ""; position: absolute; top: 27px; right: 17px; width: 7px; height: 7px; border-top: 1px solid #7597cc; border-right: 1px solid #7597cc; transform: rotate(45deg); }
    .process-note { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 19px; padding: 15px 17px; border: 1px solid #dbe7f7; border-radius: 6px; background: #edf4ff; }
    .process-note strong { font-size: 11px; }
    .process-note span { color: #617491; font-size: 10px; }

    .aigc-flow-wrap { padding: 31px; border: 1px solid #dce5f2; border-radius: 9px; background: #fff; }
    .aigc-flow { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
    .flow-node { min-height: 116px; display: grid; align-content: center; justify-items: center; gap: 8px; padding: 12px; border: 1px solid #e1e8f3; border-radius: 6px; background: #fafcff; text-align: center; }
    .flow-node .flow-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; color: #634dc7; background: #f0edff; font-size: 12px; font-weight: 750; }
    .flow-node strong { font-size: 10px; }
    .flow-node span { color: var(--muted); font-size: 8px; line-height: 1.5; }
    .flow-node:nth-child(3n + 1) .flow-icon { color: var(--blue); background: #edf4ff; }
    .flow-node:nth-child(3n) .flow-icon { color: #168f8d; background: #e9f8f5; }
    .flow-foot { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 21px; padding-top: 18px; border-top: 1px solid #e7edf5; }
    .flow-foot strong { font-size: 12px; }
    .flow-foot span { max-width: 480px; color: var(--muted); font-size: 10px; line-height: 1.8; text-align: right; }

    .scenarios { display: grid; grid-template-columns: 1.15fr .85fr .85fr; gap: 13px; }
    .scenario { min-height: 215px; display: flex; flex-direction: column; align-items: start; justify-content: space-between; padding: 23px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
    .scenario.primary { color: white; border-color: #1b55c4; background: #1e55bd; }
    .scenario:nth-child(2) { background: #eff8f6; border-color: #d3ebe5; }
    .scenario:nth-child(3) { background: #f2f1ff; border-color: #e0def8; }
    .scenario .scenario-type { color: var(--blue); font-size: 10px; font-weight: 750; }
    .scenario.primary .scenario-type { color: #b9dbff; }
    .scenario h3 { max-width: 350px; margin: 13px 0 0; font-size: 20px; line-height: 1.45; }
    .scenario p { max-width: 390px; margin: 9px 0 0; color: var(--muted); font-size: 10px; line-height: 1.8; }
    .scenario.primary p { color: #d7e5ff; }
    .scenario-bottom { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 19px; padding-top: 13px; border-top: 1px solid rgb(114 143 186 / 24%); color: #63728c; font-size: 9px; }
    .scenario.primary .scenario-bottom { color: #d4e3ff; border-color: rgb(255 255 255 / 24%); }
    .scenario-bottom b { color: inherit; font-weight: 650; }

    .cooperation { padding-top: 10px; }
    .cooperation-box { display: grid; grid-template-columns: .82fr 1.18fr; gap: 45px; align-items: center; padding: 41px; border: 1px solid #dce5f2; border-radius: 9px; background: #eef4ff; }
    .cooperation-box h2 { font-size: 28px; }
    .cooperation-box p { max-width: 390px; margin: 12px 0 0; color: var(--muted); font-size: 11px; line-height: 1.9; }
    .cooperation-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; }
    .cooperation-item { min-height: 74px; display: flex; align-items: center; gap: 11px; padding: 13px; border: 1px solid #dbe5f3; border-radius: 6px; background: #fff; }
    .cooperation-item b { width: 27px; height: 27px; flex: 0 0 27px; display: grid; place-items: center; border-radius: 6px; color: var(--blue); background: #eaf2ff; font-size: 10px; }
    .cooperation-item strong { display: block; font-size: 10px; }
    .cooperation-item span { display: block; margin-top: 4px; color: var(--muted); font-size: 8px; }

    .contact-band { position: relative; overflow: hidden; color: white; background: #122650; }
    .contact-band::before { content: ""; position: absolute; width: 340px; height: 100px; top: 10px; right: 5%; border: 1px solid rgb(114 160 226 / 24%); border-radius: 50%; transform: rotate(-18deg); box-shadow: 0 15px 0 -14px rgb(114 160 226 / 45%), 0 31px 0 -30px rgb(114 160 226 / 35%); }
    .contact-row { min-height: 214px; display: flex; align-items: center; justify-content: space-between; gap: 26px; position: relative; z-index: 1; padding-block: 48px; }
    .contact-row h2 { font-size: 28px; }
    .contact-row p { max-width: 520px; margin: 10px 0 0; color: #b8c8e5; font-size: 11px; line-height: 1.9; }
    .contact-row .button-primary { flex: 0 0 auto; color: var(--ink); background: #fff; }
    .contact-row .button-primary:hover { background: #e9f2ff; }
    footer { padding-block: 19px; color: #8090aa; font-size: 9px; }
    .footer-row { display: flex; justify-content: space-between; gap: 16px; }

    .section-dark { color: #f5f8ff; background: #152b50; }
    .section-dark .section-label { color: #77c9d0; }
    .section-dark .section-head > p { color: #b4c2d8; }
    .capability-matrix { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgb(255 255 255 / 16%); border-bottom: 1px solid rgb(255 255 255 / 16%); }
    .matrix-item { min-height: 210px; padding: 24px 25px 26px 0; border-right: 1px solid rgb(255 255 255 / 16%); }
    .matrix-item + .matrix-item { padding-left: 25px; }
    .matrix-item:last-child { padding-right: 0; border-right: 0; }
    .matrix-index { color: #e7a277; font-size: 10px; font-weight: 750; }
    .matrix-item h3 { margin: 19px 0 0; font-size: 18px; }
    .matrix-item p { max-width: 310px; margin: 10px 0 0; color: #b6c4da; font-size: 11px; line-height: 1.9; }
    .matrix-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 17px; }
    .matrix-tags span { padding: 6px 8px; border: 1px solid rgb(255 255 255 / 18%); border-radius: 4px; color: #d0dced; font-size: 9px; }

    .proof-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: 62px; align-items: start; }
    .proof-intro h2 { font-size: 34px; }
    .proof-intro p { max-width: 360px; margin: 14px 0 0; color: var(--muted); font-size: 12px; line-height: 1.95; }
    .proof-list { border-top: 1px solid var(--line); }
    .proof-row { display: grid; grid-template-columns: 44px 1fr; gap: 15px; padding: 20px 0; border-bottom: 1px solid var(--line); }
    .proof-row small { color: var(--accent); font-size: 10px; font-weight: 750; }
    .proof-row strong { display: block; font-size: 14px; }
    .proof-row p { margin: 6px 0 0; color: var(--muted); font-size: 10px; line-height: 1.8; }

    .faq-section { background: #fff; border-block: 1px solid var(--line); }
    .faq-layout { display: grid; grid-template-columns: .65fr 1.35fr; gap: 60px; }
    .faq-list { border-top: 1px solid var(--line); }
    .faq-item { padding: 18px 0; border-bottom: 1px solid var(--line); }
    .faq-item h3 { margin: 0; font-size: 13px; }
    .faq-item p { max-width: 690px; margin: 8px 0 0; color: var(--muted); font-size: 11px; line-height: 1.9; }

    .company-band { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 35px; padding: 34px 0; border-top: 1px solid var(--line); }
    .company-band h2 { font-size: 25px; }
    .company-band p { max-width: 650px; margin: 9px 0 0; color: var(--muted); font-size: 11px; line-height: 1.9; }
    .company-credentials { display: flex; flex-wrap: wrap; justify-content: end; gap: 8px; }
    .company-credentials span { padding: 7px 9px; border: 1px solid var(--line); border-radius: 4px; color: #526684; font-size: 9px; }

    @media (max-width: 980px) {
      .hero { grid-template-columns: 1fr 1fr; gap: 25px; }
      h1 { font-size: 47px; }
      .console-body { grid-template-columns: 104px 1fr; }
      .console-side { padding-inline: 7px; }
      .float-label.ai { right: -4px; }
      .product-copy { padding: 36px; }
      .product-art { padding: 24px; }
      .aigc-flow { grid-template-columns: repeat(3, 1fr); }
      .cooperation-box { gap: 25px; padding: 30px; }
      .proof-layout, .faq-layout { grid-template-columns: 1fr; gap: 28px; }
    }
    @media (max-width: 720px) {
      .shell { width: min(var(--page), calc(100% - 36px)); }
      .site-header { height: 68px; gap: 12px; }
      .brand img { width: 40px; height: 40px; }
      .brand-copy strong { font-size: 15px; }
      .brand-copy span { font-size: 8px; }
      .nav { display: none; position: absolute; top: 67px; left: -18px; right: -18px; align-items: stretch; gap: 0; padding: 8px 18px 13px; border-bottom: 1px solid var(--line); background: var(--paper); box-shadow: 0 12px 22px rgb(30 56 100 / 8%); }
      .nav.is-open { display: grid; }
      .nav a { padding: 12px 3px; border-bottom: 1px solid #e7edf5; }
      .header-cta { min-height: 38px; margin-left: auto; padding-inline: 11px; font-size: 11px; }
      .menu-toggle { display: grid; place-items: center; }
      .hero { grid-template-columns: 1fr; gap: 24px; padding-block: 54px 65px; }
      .hero-copy { max-width: 580px; }
      h1 { max-width: 520px; font-size: 45px; }
      .hero-description { max-width: 540px; font-size: 13px; }
      .hero-visual { width: min(100%, 560px); margin: 0 auto; padding: 15px 0; }
      .console { transform: none; }
      .console-body { min-height: 280px; grid-template-columns: 94px 1fr; }
      .console-main { padding: 13px 11px; }
      .console-kpi strong { font-size: 15px; }
      .chart { height: 72px; }
      .float-label.ai { top: -2px; right: -7px; }
      .float-label.wechat { left: -7px; bottom: -1px; }
      .capability-strip { grid-template-columns: 1fr; margin-top: -26px; }
      .capability { min-height: 70px; padding: 12px 16px; border-right: 0; border-bottom: 1px solid #e5ebf4; }
      .capability:last-child { border-bottom: 0; }
      .section { padding-block: 75px; }
      .section-head { display: block; margin-bottom: 27px; }
      h2 { font-size: 30px; }
      .section-head > p { margin-top: 12px; }
      .product-section { padding-top: 65px; }
      .product-panel { grid-template-columns: 1fr; }
      .product-copy { padding: 26px 22px 29px; }
      .product-copy h3 { font-size: 25px; }
      .product-art { padding: 18px; }
      .geo-dashboard { grid-template-columns: 85px 1fr; min-height: 225px; }
      .mini-sidebar { padding: 12px 5px; }
      .geo-content { padding: 11px 9px; }
      .geo-stat { padding: 7px 5px; }
      .geo-stat strong { font-size: 12px; }
      .geo-lower { grid-template-columns: 1fr .75fr; }
      .aigc-app { grid-template-columns: 83px 1fr; min-height: 260px; }
      .aigc-sidebar { padding-inline: 5px; }
      .aigc-main { padding: 11px 8px; }
      .creation-grid { gap: 5px; }
      .creation-card { min-height: 67px; padding: 6px; }
      .service-grid { grid-template-columns: 1fr; border-bottom: 0; }
      .service-card, .service-card + .service-card { min-height: 0; padding: 22px 0; border-right: 0; border-bottom: 1px solid var(--line); }
      .service-icon { margin-bottom: 14px; }
      .geo-process { grid-template-columns: repeat(2, 1fr); }
      .process-step { min-height: 150px; padding: 19px 16px 19px 0; border-bottom: 1px solid var(--line); }
      .process-step + .process-step { padding-left: 16px; }
      .process-step:nth-child(2) { border-right: 0; }
      .process-step:nth-child(3) { padding-left: 0; border-bottom: 0; }
      .process-step:nth-child(4) { border-right: 0; border-bottom: 0; }
      .process-step::before, .process-step::after { display: none; }
      .process-note { align-items: start; flex-direction: column; gap: 7px; }
      .aigc-flow-wrap { padding: 18px; }
      .aigc-flow { grid-template-columns: repeat(2, 1fr); }
      .flow-node { min-height: 98px; }
      .flow-foot { align-items: start; flex-direction: column; gap: 8px; }
      .flow-foot span { text-align: left; }
      .scenarios { grid-template-columns: 1fr; }
      .scenario { min-height: 190px; padding: 20px; }
      .cooperation-box { grid-template-columns: 1fr; padding: 25px 19px; }
      .cooperation-box h2 { font-size: 24px; }
      .contact-row { align-items: start; flex-direction: column; justify-content: center; padding-block: 38px; }
      .contact-row h2 { font-size: 25px; }
      .footer-row { align-items: start; flex-direction: column; gap: 6px; }
      .capability-matrix { grid-template-columns: 1fr; }
      .matrix-item, .matrix-item + .matrix-item { min-height: 0; padding: 21px 0; border-right: 0; border-bottom: 1px solid rgb(255 255 255 / 16%); }
      .matrix-item:last-child { border-bottom: 0; }
      .company-band { grid-template-columns: 1fr; align-items: start; gap: 18px; }
      .company-credentials { justify-content: start; }
    }
    @media (max-width: 370px) {
      .header-cta { display: none; }
      h1 { font-size: 39px; }
      .console-body { grid-template-columns: 74px 1fr; }
      .console-side span { padding-inline: 5px; font-size: 8px; }
      .console-kpis { gap: 5px; }
      .console-kpi { padding: 8px 5px; }
      .console-kpi strong { font-size: 13px; }
    }
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
    }

    /* Keep the homepage light while retaining blue as the product accent. */
    .hero-wrap { color: #172b49; background-color: #f1f6fd; background-image: linear-gradient(rgb(59 108 181 / 3.5%) 1px, transparent 1px), linear-gradient(90deg, rgb(59 108 181 / 3.5%) 1px, transparent 1px); background-size: 48px 48px; border-color: #dce6f3; }
    .hero-wrap::after { width: 65%; height: 160px; left: 17%; bottom: -113px; border-color: rgb(84 117 230 / 20%); box-shadow: 0 -13px 0 -12px rgb(70 132 208 / 22%), 0 -29px 0 -28px rgb(92 107 202 / 14%); }
    .eyebrow { color: #2869bf; }
    .hero-description { color: #62738c; }
    .hero h1 span { color: #2869bf; }
    .button-quiet { color: #314965; }
    .hero-capabilities span { color: #50627b; border-color: #d5e0ee; background: #fff; }
    .hero-visual { isolation: isolate; }
    .visual-orbit { border-color: rgb(54 111 190 / 23%); }
    .visual-orbit::before { border-color: rgb(35 151 152 / 20%); }
    .visual-orbit::after { border-color: rgb(91 124 206 / 17%); }
    .capability-strip { margin-top: -30px; border-color: #dce5f0; background: #fff; box-shadow: 0 14px 40px rgb(38 68 108 / 9%); }
    .capability { border-color: #e4eaf2; }
    .capability strong { color: #1f3554; }
    .capability span { color: #71819a; }
    .product-matrix { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
    .matrix-product { min-height: 250px; display: flex; flex-direction: column; align-items: start; padding: 25px; border: 1px solid #dce5f0; border-radius: 7px; background: #fff; }
    .matrix-product.featured { color: #1c3557; border-color: #bfd2ec; background: #edf4fd; }
    .matrix-product small { color: #6483bd; font-size: 10px; font-weight: 750; }
    .matrix-product.featured small { color: #2869bf; }
    .matrix-product h3 { margin: 11px 0 0; font-size: 20px; }
    .matrix-product p { max-width: 525px; margin: 9px 0 18px; color: #6b7b98; font-size: 11px; line-height: 1.9; }
    .matrix-product.featured p { color: #62748d; }
    .matrix-product .product-link { margin-top: auto; }
    .matrix-product.featured .product-link { color: #2869bf; }
    .matrix-product-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 15px; }
    .matrix-product-tags span { padding: 5px 7px; border: 1px solid #e1e8f1; border-radius: 4px; color: #63748e; font-size: 9px; }
    .matrix-product.featured .matrix-product-tags span { color: #526984; border-color: #d0deef; }
    .section-dark { color: #1c304e; background: #f2f6fc; }
    .section-dark .section-label { color: #2869bf; }
    .section-dark .section-head > p { color: #6b7b98; }
    .section-dark .capability-matrix { border-color: #dce6f4; }
    .section-dark .matrix-item { border-color: #dce6f4; }
    .section-dark .matrix-index { color: #bd7144; }
    .section-dark .matrix-item h3 { color: #203653; }
    .section-dark .matrix-item p { color: #6b7b98; }
    .section-dark .matrix-tags span { color: #61738e; border-color: #d6e0ee; background: #e8eef7; }
    .service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .service-card { min-height: 218px; }
    .delivery-scenarios { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
    .delivery-scenario { min-height: 195px; display: flex; flex-direction: column; padding: 20px; border: 1px solid #dce5f0; border-radius: 6px; background: white; }
    .delivery-scenario small { color: #2e71c7; font-size: 9px; font-weight: 750; }
    .delivery-scenario h3 { margin: 10px 0 0; font-size: 15px; }
    .delivery-scenario p { margin: 8px 0 16px; color: #6b7b98; font-size: 10px; line-height: 1.85; }
    .delivery-scenario span { margin-top: auto; color: #9a6a4c; font-size: 8px; }
    .home-contact { color: #1c304e; background: #eef4fc; }
    .home-contact .contact-row p { color: #657791; }
    .home-contact::before { border-color: rgb(61 112 187 / 12%); box-shadow: 0 0 0 18px rgb(61 112 187 / 4%), 0 0 0 37px rgb(61 112 187 / 3%); }
    .home-contact .button-primary { color: #fff; background: #2869bf; }
    @media (max-width: 720px) {
      .capability-strip { margin-top: -22px; }
      .product-matrix, .delivery-scenarios { grid-template-columns: 1fr; }
      .matrix-product { min-height: 0; padding: 21px; }
      .service-grid { grid-template-columns: 1fr; }
    }
  </style>