:root {
      --ink:#17212b;
      --muted:#5d6b78;
      --blue:#145df5;
      --cyan:#00b7c7;
      --lime:#c7f249;
      --orange:#ff7a45;
      --paper:#f6fafc;
      --line:#dce7ed;
      --white:#ffffff;
      --navy:#10293c;
      --shadow:0 18px 50px rgba(18,50,74,.1);
      --radius:14px;
    }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body {
      margin:0;
      color:var(--ink);
      background:var(--paper);
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
      line-height:1.7;
    }
    a { color:inherit; text-decoration:none; }
    img { max-width:100%; height:auto; display:block; }
    button,input,select,textarea { font:inherit; }
    .container { width:min(1180px, calc(100% - 40px)); margin:0 auto; }
    .topbar {
      position:sticky;
      top:0;
      z-index:20;
      background:rgba(255,255,255,.94);
      border-bottom:1px solid rgba(220,231,237,.9);
      backdrop-filter:blur(14px);
    }
    .nav {
      min-height:76px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
    }
    .brand { display:flex; align-items:center; flex:none; }
    .ai-page-logo { width:142px; }
    .nav-links {
      display:flex;
      align-items:center;
      justify-content:flex-end;
      gap:0;
      flex-wrap:wrap;
      color:#40515e;
      font-size:14px;
    }
    .nav-links a { padding:8px 10px; transition:.2s ease; }
    .nav-links a:hover { color:var(--blue); }
    .nav-cta,.primary-btn,.secondary-btn {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border:0;
      cursor:pointer;
      border-radius:8px;
      font-weight:700;
      transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
    }
    .nav-cta { padding:10px 17px; background:var(--blue); color:#fff; white-space:nowrap; }
    .primary-btn { padding:14px 23px; background:var(--blue); color:#fff; box-shadow:0 10px 24px rgba(20,93,245,.22); }
    .secondary-btn { padding:13px 22px; color:var(--blue); border:1px solid #a9c1ff; background:#fff; }
    .nav-cta:hover,.primary-btn:hover,.secondary-btn:hover { transform:translateY(-2px); box-shadow:0 12px 28px rgba(20,93,245,.2); }
    .menu-toggle { display:none; border:1px solid var(--line); background:#fff; padding:8px 11px; border-radius:7px; color:var(--ink); }
    .hero {
      position:relative;
      overflow:hidden;
      background:#eafffb;
      border-bottom:1px solid #cfe9ea;
      padding:92px 0 76px;
    }
    .hero:before,.hero:after {
      content:"";
      position:absolute;
      border-radius:50%;
      pointer-events:none;
      opacity:.7;
    }
    .hero:before { width:390px;height:390px;right:-170px;top:-130px;background:#c7f249; }
    .hero:after { width:250px;height:250px;left:-130px;bottom:-130px;background:#8de9ee; }
    .hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); gap:64px; align-items:center; }
    .eyebrow { color:var(--blue); font-size:13px; font-weight:800; letter-spacing:1px; margin:0 0 16px; }
    h1,h2,h3,p { margin-top:0; }
    h1 { max-width:700px; margin-bottom:20px; font-size:clamp(38px,5vw,68px); line-height:1.12; letter-spacing:0; }
    h2 { font-size:clamp(28px,4vw,42px); line-height:1.2; margin-bottom:16px; }
    h3 { line-height:1.35; margin-bottom:10px; }
    .hero-copy { max-width:650px; color:#405664; font-size:18px; }
    .hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin:30px 0 27px; }
    .hero-note { font-size:13px; color:#56717c; }
    .hero-panel { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .metric { padding:20px; background:#fff; border:1px solid rgba(20,93,245,.13); box-shadow:var(--shadow); border-radius:12px; animation:rise .7s both; }
    .metric:nth-child(2){margin-top:22px;animation-delay:.1s}.metric:nth-child(3){animation-delay:.2s}.metric:nth-child(4){margin-top:22px;animation-delay:.3s}
    .metric strong { display:block; color:var(--blue); font-size:30px; line-height:1.1; }
    .metric span { color:var(--muted); font-size:13px; }
    section { padding:84px 0; }
    .section-head { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:34px; }
    .section-head p { max-width:600px; color:var(--muted); margin-bottom:3px; }
    .soft-band { background:#eef8fa; }
    .intro-grid { display:grid; grid-template-columns:1fr 1.35fr; gap:50px; align-items:start; }
    .intro-lead { font-size:21px; color:#294858; }
    .check-list { list-style:none; padding:0; margin:25px 0 0; display:grid; gap:12px; }
    .check-list li { position:relative; padding-left:28px; }
    .check-list li:before { content:"✓"; position:absolute; left:0; top:0; color:#1aa796; font-weight:800; }
    .feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
    .feature { padding:24px; border:1px solid var(--line); background:#fff; border-radius:var(--radius); transition:.25s ease; }
    .feature:hover,.review:hover,.case:hover { transform:translateY(-5px); box-shadow:var(--shadow); border-color:#a8d6dc; }
    .feature-mark { width:38px; height:38px; display:grid; place-items:center; background:var(--lime); border-radius:9px; color:#183322; font-weight:900; margin-bottom:17px; }
    .feature p,.case p,.review p { color:var(--muted); font-size:14px; margin-bottom:0; }
    .service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
    .service { min-height:176px; padding:22px; background:#fff; border-top:3px solid var(--cyan); border-radius:10px; box-shadow:0 8px 24px rgba(18,50,74,.05); }
    .service:nth-child(4n+2){border-top-color:var(--blue)}.service:nth-child(4n+3){border-top-color:var(--orange)}.service:nth-child(4n+4){border-top-color:#96cf27}
    .service p { color:var(--muted); font-size:14px; margin-bottom:0; }
    .steps { display:grid; grid-template-columns:repeat(4,1fr); gap:0; border:1px solid var(--line); background:#fff; }
    .step { padding:27px 23px; position:relative; border-right:1px solid var(--line); }
    .step:last-child { border-right:0; }
    .step-no { display:inline-grid; place-items:center; width:34px; height:34px; border-radius:50%; color:#fff; background:var(--blue); font-weight:800; margin-bottom:18px; }
    .step p { color:var(--muted); font-size:14px; margin-bottom:0; }
    .solution-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
    .solution { padding:24px; background:#10293c; color:#fff; border-radius:12px; }
    .solution:nth-child(2){background:#145df5}.solution:nth-child(3){background:#087e82}
    .solution p { color:rgba(255,255,255,.82); font-size:14px; }
    .network { display:flex; flex-wrap:wrap; gap:10px; }
    .tag { padding:9px 13px; background:#fff; border:1px solid #cce3e6; border-radius:5px; color:#2e5967; font-size:14px; }
    .tag:nth-child(3n){background:#edffd0}.tag:nth-child(4n){background:#e1f3ff}
    .table-wrap { overflow-x:auto; background:#fff; border:1px solid var(--line); }
    table { width:100%; min-width:760px; border-collapse:collapse; }
    th,td { padding:16px 18px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top; }
    th { background:#e8f5f6; color:#214a55; font-size:14px; }
    td { font-size:14px; color:#475b66; }
    tr:last-child td { border-bottom:0; }
    .rating { display:flex; align-items:center; gap:20px; margin-bottom:22px; }
    .rating strong { color:var(--orange); font-size:42px; }
    .stars { color:#ff9a27; letter-spacing:3px; font-size:22px; }
    .case-grid,.review-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
    .case,.review { background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; transition:.25s ease; }
    .case-media { background:#dff7f4; padding:0; aspect-ratio:16/9; overflow:hidden; }
    .case-media img { width:100%; height:100%; object-fit:cover; }
    .case-body,.review { padding:22px; }
    .review { position:relative; }
    .review:before { content:"“"; position:absolute; top:8px; right:19px; color:#bfe9e5; font-size:54px; line-height:1; }
    .review-name { margin-top:18px; color:#1d6570; font-weight:700; font-size:14px; }
    .article-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:22px; }
    .article-list { display:grid; gap:10px; }
    .article-link { display:flex; justify-content:space-between; gap:15px; padding:17px 18px; background:#fff; border:1px solid var(--line); border-radius:8px; color:#2d4b58; font-size:14px; transition:.2s; }
    .article-link:hover { border-color:var(--cyan); color:var(--blue); }
    .price-panel { background:#10293c; color:#fff; padding:34px; border-radius:14px; }
    .price-panel p { color:#c9dce1; }
    .price-points { display:grid; gap:12px; margin:23px 0 0; }
    .price-points div { display:flex; justify-content:space-between; border-bottom:1px solid rgba(255,255,255,.16); padding-bottom:10px; font-size:14px; }
    .price-points b { color:var(--lime); }
    .faq-list { display:grid; gap:10px; max-width:900px; }
    details { background:#fff; border:1px solid var(--line); border-radius:8px; padding:0 20px; }
    summary { cursor:pointer; list-style:none; padding:18px 28px 18px 0; font-weight:700; position:relative; }
    summary::-webkit-details-marker { display:none; }
    summary:after { content:"+"; position:absolute; right:0; color:var(--blue); font-size:22px; }
    details[open] summary:after { content:"−"; }
    details p { color:var(--muted); font-size:14px; padding:0 0 18px; margin-bottom:0; }
    .form-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:34px; align-items:start; }
    .contact-panel { background:#e5fbf6; padding:28px; border-radius:12px; }
    .contact-row { display:flex; gap:12px; margin:17px 0; align-items:center; color:#365865; font-size:14px; }
    .qr { width:112px; border-radius:8px; margin-top:15px; }
    form { background:#fff; padding:30px; border:1px solid var(--line); border-radius:12px; display:grid; gap:16px; }
    .form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
    label { display:grid; gap:7px; color:#405664; font-weight:700; font-size:14px; }
    input,select,textarea { width:100%; border:1px solid #cbdbe1; border-radius:6px; padding:12px 13px; color:var(--ink); background:#fbfdfe; outline:none; }
    input:focus,select:focus,textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(20,93,245,.1); }
    textarea { min-height:128px; resize:vertical; }
    .footer { background:#10293c; color:#dcebef; padding:48px 0 22px; }
    .footer-grid { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:35px; }
    .footer h3 { color:#fff; font-size:16px; }
    .footer p,.footer a { color:#b8d0d7; font-size:14px; }
    .footer-links { display:grid; gap:6px; }
    .footer-bottom { margin-top:30px; padding-top:18px; border-top:1px solid rgba(255,255,255,.15); color:#9db8c0; font-size:13px; }
    .floating { position:fixed; right:18px; bottom:20px; z-index:15; display:grid; gap:8px; }
    .float-btn { width:48px; height:48px; display:grid; place-items:center; border-radius:50%; background:var(--blue); color:#fff; box-shadow:0 9px 22px rgba(20,93,245,.28); font-weight:800; }
    .float-btn:hover { transform:translateY(-2px); }
    .reveal { opacity:0; transform:translateY(18px); transition:opacity .65s ease,transform .65s ease; }
    .reveal.show { opacity:1; transform:none; }
    @keyframes rise { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
    @media (max-width:960px) {
      .nav-links { display:none; position:absolute; left:20px; right:20px; top:70px; padding:12px; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow); flex-direction:column; align-items:stretch; }
      .nav-links.open { display:flex; }
      .nav-links a { padding:10px 12px; }
      .menu-toggle { display:block; }
      .nav-cta { display:none; }
      .hero-grid,.intro-grid,.form-layout,.article-grid { grid-template-columns:1fr; }
      .hero-panel { max-width:600px; }
      .service-grid { grid-template-columns:repeat(2,1fr); }
      .steps { grid-template-columns:repeat(2,1fr); }
      .step:nth-child(2) { border-right:0; }.step:nth-child(-n+2){border-bottom:1px solid var(--line)}
    }
    @media (max-width:640px) {
      .container { width:min(100% - 28px,1180px); }
      section { padding:60px 0; }
      .hero { padding:68px 0 58px; }
      h1 { font-size:40px; }
      .section-head { display:block; }
      .section-head p { margin-top:12px; }
      .feature-grid,.solution-grid,.case-grid,.review-grid,.service-grid { grid-template-columns:1fr; }
      .hero-panel { grid-template-columns:1fr 1fr; }
      .metric { padding:16px; }
      .metric strong { font-size:25px; }
      .steps { display:block; }
      .step { border-right:0; border-bottom:1px solid var(--line); }
      .step:last-child { border-bottom:0; }
      .form-row,.footer-grid { grid-template-columns:1fr; }
      .footer-grid { gap:20px; }
      .rating { align-items:flex-start; flex-direction:column; gap:0; }
    }