* { margin:0; padding:0; box-sizing:border-box; }
  :root {
    --ink:#1d1b3a;
    --ink-soft:#4a4766;
    --muted:#6f6c86;
    --bg:#fbf9f4;
    --card:#ffffff;
    --line:#e8e3f3;
    --violet:#6c4cff;
    --violet-deep:#4a2fd6;
    --coral:#ff6b6b;
    --amber:#ffb547;
    --teal:#2bb6a3;
    --sky:#3d8bfd;
    --radius:18px;
    --shadow:0 10px 30px rgba(74,47,214,.10);
    --shadow-lift:0 18px 44px rgba(74,47,214,.18);
  }
  html { scroll-behavior:smooth; }
  body {
    font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
    background:var(--bg);
    color:var(--ink);
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  .container {
    width:100%;
    max-width:1200px;
    margin:0 auto;
    padding:0 20px;
  }
  a { color:inherit; text-decoration:none; }
  img { max-width:100%; height:auto; display:block; }
  ul { list-style:none; }
  section { padding:72px 0; position:relative; }
  .section-head { margin-bottom:44px; max-width:760px; }
  .eyebrow {
    display:inline-block;
    font-size:13px;
    letter-spacing:.14em;
    font-weight:700;
    padding:6px 14px;
    border-radius:999px;
    background:linear-gradient(120deg,#efe9ff,#ffe9ef);
    color:var(--violet-deep);
    margin-bottom:16px;
  }
  h1,h2,h3,h4 { line-height:1.3; color:var(--ink); }
  h2 { font-size:clamp(24px,3.4vw,36px); letter-spacing:-.01em; }
  h3 { font-size:19px; }
  .lead { color:var(--ink-soft); margin-top:12px; font-size:16px; }

  /* Buttons */
  .btn {
    display:inline-flex; align-items:center; justify-content:center;
    gap:8px; padding:13px 26px; border-radius:999px;
    font-weight:700; font-size:15px; border:1.5px solid transparent;
    cursor:pointer; transition:transform .2s ease, box-shadow .25s ease, background .2s ease, color .2s ease;
    will-change:transform;
  }
  .btn-primary {
    background:linear-gradient(120deg,var(--violet),var(--violet-deep) 70%,#7a52ff);
    color:#fff;
    box-shadow:0 10px 24px rgba(108,76,255,.30);
  }
  .btn-primary:hover { transform:translateY(-2px); box-shadow:0 16px 34px rgba(108,76,255,.40); }
  .btn-primary:active { transform:translateY(0); }
  .btn-ghost {
    background:#fff; color:var(--violet-deep); border-color:#ddd5ff;
  }
  .btn-ghost:hover { background:#f3efff; transform:translateY(-2px); box-shadow:var(--shadow); }
  .btn-amber {
    background:linear-gradient(120deg,#ffca6b,var(--amber));
    color:#402b00; box-shadow:0 10px 24px rgba(255,181,71,.32);
  }
  .btn-amber:hover { transform:translateY(-2px); box-shadow:0 16px 34px rgba(255,181,71,.42); }

  /* Header */
  .site-header {
    position:sticky; top:0; z-index:100;
    background:rgba(251,249,244,.86);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);
  }
  .nav-inner {
    display:flex; align-items:center; justify-content:space-between;
    gap:20px; min-height:70px; padding-top:10px; padding-bottom:10px;
  }
  .brand { display:flex; align-items:center; gap:10px; flex-shrink:0; }
  .brand .ai-page-logo { max-height:40px; width:auto; }
  .brand-name { font-weight:800; font-size:18px; letter-spacing:.02em; color:var(--ink); white-space:nowrap; }
  .nav-links { display:flex; align-items:center; gap:0; flex-wrap:wrap; }
  .nav-links a {
    font-size:14.5px; font-weight:600; color:var(--ink-soft);
    padding:9px 12px; border-radius:10px; transition:color .2s ease, background .2s ease;
    white-space:nowrap;
  }
  .nav-links a:hover { color:var(--violet-deep); background:#f1ecff; }
  .nav-actions { display:flex; align-items:center; gap:10px; flex-shrink:0; }
  .nav-actions .btn { padding:9px 18px; font-size:14px; }
  .menu-toggle {
    display:none; flex-direction:column; gap:5px; width:44px; height:44px;
    align-items:center; justify-content:center; border:1px solid var(--line);
    border-radius:12px; background:#fff; cursor:pointer;
  }
  .menu-toggle span { display:block; width:20px; height:2px; background:var(--ink); border-radius:2px; transition:.25s; }
  .mobile-panel {
    display:none; border-top:1px solid var(--line); background:#fff;
    padding:12px 20px 20px;
  }
  .mobile-panel.open { display:block; animation:fadeDown .3s ease; }
  .mobile-panel a {
    display:block; padding:11px 8px; font-weight:600; color:var(--ink-soft);
    border-bottom:1px dashed #efebf8; font-size:15px;
  }
  .mobile-panel a:last-child { border-bottom:none; }
  .mobile-panel .btn { width:100%; margin-top:12px; }
  @keyframes fadeDown { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }

  /* Hero */
  .hero {
    position:relative;
    padding:76px 0 84px;
    overflow:hidden;
    background:
      radial-gradient(900px 480px at 88% -8%, rgba(255,107,107,.16), transparent 62%),
      radial-gradient(820px 520px at 6% 18%, rgba(108,76,255,.18), transparent 62%),
      radial-gradient(700px 460px at 50% 110%, rgba(43,182,163,.14), transparent 66%),
      linear-gradient(180deg,#fdfbff 0%, #fbf9f4 100%);
  }
  .hero-grid-lines {
    position:absolute; inset:0; pointer-events:none;
    background-image:linear-gradient(rgba(108,76,255,.06) 1px, transparent 1px),
                     linear-gradient(90deg, rgba(108,76,255,.06) 1px, transparent 1px);
    background-size:56px 56px;
    mask-image:radial-gradient(ellipse at 50% 40%, #000 20%, transparent 78%);
    -webkit-mask-image:radial-gradient(ellipse at 50% 40%, #000 20%, transparent 78%);
  }
  .hero-blob {
    position:absolute; border-radius:50%; filter:blur(46px); opacity:.5; pointer-events:none;
    animation:floatBlob 14s ease-in-out infinite alternate;
  }
  .blob-1 { width:320px; height:320px; background:rgba(108,76,255,.32); top:-90px; right:-60px; }
  .blob-2 { width:260px; height:260px; background:rgba(255,181,71,.34); bottom:-70px; left:-50px; animation-delay:-5s; }
  .blob-3 { width:200px; height:200px; background:rgba(43,182,163,.28); top:40%; left:44%; animation-delay:-9s; }
  @keyframes floatBlob { from{transform:translate3d(0,0,0) scale(1)} to{transform:translate3d(24px,-28px,0) scale(1.08)} }
  .hero-inner { position:relative; z-index:2; display:grid; grid-template-columns:1.2fr .8fr; gap:44px; align-items:center; }
  .hero-badge {
    display:inline-flex; align-items:center; gap:8px;
    background:#fff; border:1px solid #e9e2ff; color:var(--violet-deep);
    font-size:13.5px; font-weight:700; padding:7px 16px; border-radius:999px;
    box-shadow:0 6px 18px rgba(108,76,255,.12); margin-bottom:22px;
    animation:riseIn .7s ease both;
  }
  .hero-badge .dot { width:8px; height:8px; border-radius:50%; background:var(--teal); box-shadow:0 0 0 4px rgba(43,182,163,.20); }
  .hero h1 {
    font-size:clamp(30px,4.6vw,50px);
    line-height:1.18;
    letter-spacing:-.02em;
    font-weight:800;
    animation:riseIn .7s .08s ease both;
  }
  .hero h1 .grad {
    background:linear-gradient(100deg,var(--violet) 0%, var(--coral) 55%, var(--amber) 100%);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:var(--violet-deep);
  }
  .hero-desc {
    margin-top:20px; font-size:16.5px; color:var(--ink-soft); max-width:560px;
    animation:riseIn .7s .16s ease both;
  }
  .hero-cta { display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; animation:riseIn .7s .24s ease both; }
  .hero-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:26px; animation:riseIn .7s .32s ease both; }
  .hero-tags span {
    font-size:12.5px; font-weight:600; padding:6px 13px; border-radius:999px;
    background:#fff; border:1px solid #ece7fa; color:var(--ink-soft);
    transition:transform .2s ease, border-color .2s ease, color .2s ease;
  }
  .hero-tags span:hover { transform:translateY(-2px); border-color:#d4c7ff; color:var(--violet-deep); }
  .hero-stats { display:grid; grid-template-columns:1fr 1fr; gap:14px; animation:riseIn .8s .2s ease both; }
  .hstat {
    background:rgba(255,255,255,.78);
    border:1px solid #ece7fa;
    border-radius:16px;
    padding:20px 18px;
    backdrop-filter:blur(8px);
    box-shadow:0 8px 24px rgba(74,47,214,.07);
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .hstat:hover { transform:translateY(-4px); box-shadow:var(--shadow-lift); }
  .hstat strong { display:block; font-size:24px; font-weight:800; color:var(--violet-deep); letter-spacing:-.01em; }
  .hstat span { font-size:13px; color:var(--muted); font-weight:600; }
  .hstat.wide { grid-column:1 / -1; background:linear-gradient(120deg,#6c4cff,#8b5cff); border-color:transparent; }
  .hstat.wide strong { color:#fff; font-size:20px; }
  .hstat.wide span { color:rgba(255,255,255,.88); }
  @keyframes riseIn { from{opacity:0; transform:translateY(20px)} to{opacity:1; transform:translateY(0)} }

  /* Section variants */
  .band-a { background:linear-gradient(180deg,#fffdf8 0%, #fbf9f4 100%); }
  .band-b { background:linear-gradient(180deg,#faf7ff 0%, #f7f3ff 100%); }
  .band-c { background:linear-gradient(180deg,#fbf9f4 0%, #fff7f2 100%); }

  /* Cards generic */
  .card {
    background:var(--card);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:26px;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lift); border-color:#dcd3fb; }

  /* About */
  .about-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:start; }
  .about-card {
    background:linear-gradient(160deg,#fff,#fbf8ff);
    border:1px solid var(--line);
    border-radius:22px;
    padding:32px;
    box-shadow:var(--shadow);
  }
  .about-list { display:grid; gap:16px; margin-top:24px; }
  .about-list li { display:flex; gap:14px; align-items:flex-start; }
  .about-list .ic {
    flex:0 0 38px; width:38px; height:38px; border-radius:12px;
    display:flex; align-items:center; justify-content:center;
    font-weight:800; font-size:15px; color:#fff;
    background:linear-gradient(135deg,var(--violet),#9b7bff);
    box-shadow:0 8px 18px rgba(108,76,255,.28);
  }
  .about-list li:nth-child(2) .ic { background:linear-gradient(135deg,var(--teal),#5ad6c4); box-shadow:0 8px 18px rgba(43,182,163,.28); }
  .about-list li:nth-child(3) .ic { background:linear-gradient(135deg,var(--coral),#ff9a8b); box-shadow:0 8px 18px rgba(255,107,107,.28); }
  .about-list li:nth-child(4) .ic { background:linear-gradient(135deg,var(--amber),#ffd27a); box-shadow:0 8px 18px rgba(255,181,71,.30); }
  .about-list li:nth-child(5) .ic { background:linear-gradient(135deg,var(--sky),#7ab6ff); box-shadow:0 8px 18px rgba(61,139,253,.28); }
  .about-list strong { display:block; font-size:15.5px; margin-bottom:2px; }
  .about-list p { font-size:14px; color:var(--muted); }
  .platform-panel {
    background:linear-gradient(150deg,#2b1d5c,#4a2fd6 55%,#6c4cff);
    border-radius:22px; padding:34px; color:#fff;
    box-shadow:0 22px 48px rgba(74,47,214,.30);
    position:relative; overflow:hidden;
  }
  .platform-panel::after {
    content:""; position:absolute; width:220px; height:220px; border-radius:50%;
    background:rgba(255,255,255,.10); right:-70px; top:-70px;
  }
  .platform-panel h3 { color:#fff; font-size:22px; margin-bottom:10px; position:relative; }
  .platform-panel p { color:rgba(255,255,255,.82); font-size:14.5px; position:relative; }
  .platform-chips { display:flex; flex-wrap:wrap; gap:9px; margin-top:22px; position:relative; }
  .platform-chips span {
    font-size:12.5px; font-weight:600; padding:6px 13px; border-radius:999px;
    background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.24); color:#fff;
    transition:background .2s ease, transform .2s ease;
  }
  .platform-chips span:hover { background:rgba(255,255,255,.26); transform:translateY(-2px); }

  /* Service cards */
  .service-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .svc {
    background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px;
    position:relative; overflow:hidden;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .svc::before {
    content:""; position:absolute; left:0; top:0; height:4px; width:100%;
    background:linear-gradient(90deg,var(--violet),var(--coral),var(--amber),var(--teal));
    opacity:0; transition:opacity .3s ease;
  }
  .svc:hover { transform:translateY(-5px); box-shadow:var(--shadow-lift); border-color:#ddd5ff; }
  .svc:hover::before { opacity:1; }
  .svc-tag {
    display:inline-block; font-size:12px; font-weight:700; padding:4px 11px;
    border-radius:8px; margin-bottom:12px; background:#f1ecff; color:var(--violet-deep);
  }
  .svc:nth-child(3n+2) .svc-tag { background:#e7f8f5; color:#178a7a; }
  .svc:nth-child(3n+3) .svc-tag { background:#fff0ec; color:#d4503f; }
  .svc h3 { margin-bottom:8px; }
  .svc p { font-size:14px; color:var(--muted); }

  /* Flow */
  .flow { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; counter-reset:step; }
  .flow-step {
    background:#fff; border:1px solid var(--line); border-radius:16px;
    padding:26px 20px; position:relative;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .flow-step:hover { transform:translateY(-5px); box-shadow:var(--shadow-lift); }
  .flow-num {
    width:42px; height:42px; border-radius:12px; display:flex; align-items:center; justify-content:center;
    font-weight:800; color:#fff; font-size:16px;
    background:linear-gradient(135deg,var(--violet),#9b7bff);
    box-shadow:0 8px 18px rgba(108,76,255,.26); margin-bottom:16px;
  }
  .flow-step:nth-child(2) .flow-num { background:linear-gradient(135deg,#4a8aff,#7ab6ff); box-shadow:0 8px 18px rgba(74,138,255,.26); }
  .flow-step:nth-child(3) .flow-num { background:linear-gradient(135deg,var(--teal),#5ad6c4); box-shadow:0 8px 18px rgba(43,182,163,.26); }
  .flow-step:nth-child(4) .flow-num { background:linear-gradient(135deg,var(--amber),#ffd27a); box-shadow:0 8px 18px rgba(255,181,71,.28); }
  .flow-step:nth-child(5) .flow-num { background:linear-gradient(135deg,var(--coral),#ff9a8b); box-shadow:0 8px 18px rgba(255,107,107,.26); }
  .flow-step h3 { font-size:16px; margin-bottom:6px; }
  .flow-step p { font-size:13.5px; color:var(--muted); }

  /* Industry / scenarios */
  .scenario-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
  .scenario {
    background:#fff; border:1px solid var(--line); border-radius:14px;
    padding:20px; transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
  }
  .scenario:hover { transform:translateY(-4px); box-shadow:var(--shadow); background:#faf8ff; }
  .scenario h3 { font-size:15.5px; margin-bottom:6px; }
  .scenario p { font-size:13px; color:var(--muted); }

  /* Network */
  .network-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .net-card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px; transition:transform .25s ease, box-shadow .25s ease; }
  .net-card:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
  .net-card .net-flag { font-size:12px; font-weight:700; color:var(--teal); background:#e7f8f5; padding:3px 10px; border-radius:8px; display:inline-block; margin-bottom:12px; }
  .net-card h3 { font-size:17px; margin-bottom:8px; }
  .net-card p { font-size:14px; color:var(--muted); }

  /* Cases */
  .case-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .case-card {
    background:#fff; border:1px solid var(--line); border-radius:18px; overflow:hidden;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .case-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lift); }
  .case-thumb { aspect-ratio:16/10; background:linear-gradient(135deg,#f1ecff,#ffe9ef); position:relative; overflow:hidden; }
  .case-thumb img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
  .case-card:hover .case-thumb img { transform:scale(1.05); }
  .case-body { padding:20px 22px 24px; }
  .case-body span { font-size:12px; font-weight:700; color:var(--violet-deep); background:#f1ecff; padding:3px 10px; border-radius:8px; }
  .case-body h3 { font-size:16.5px; margin:10px 0 6px; }
  .case-body p { font-size:13.5px; color:var(--muted); }

  /* Compare */
  .compare-wrap {
    background:#fff; border:1px solid var(--line); border-radius:22px; overflow:hidden;
    box-shadow:var(--shadow);
  }
  .compare-head { padding:28px 30px; background:linear-gradient(120deg,#f6f1ff,#fff4f0); border-bottom:1px solid var(--line); }
  .compare-head h2 { font-size:26px; }
  .compare-head p { color:var(--ink-soft); font-size:14.5px; margin-top:8px; }
  .rating-bar { display:flex; flex-wrap:wrap; align-items:center; gap:22px; margin-top:18px; }
  .stars { display:flex; gap:4px; color:#ffb547; font-size:20px; letter-spacing:2px; }
  .score { font-size:30px; font-weight:800; color:var(--violet-deep); }
  .score small { font-size:14px; color:var(--muted); font-weight:600; margin-left:4px; }
  .table-scroll { overflow-x:auto; }
  table.cmp { width:100%; border-collapse:collapse; min-width:680px; }
  table.cmp th, table.cmp td { padding:16px 20px; text-align:left; font-size:14.5px; border-bottom:1px solid #f2eefb; }
  table.cmp thead th { background:#faf7ff; font-size:13.5px; font-weight:800; color:var(--violet-deep); white-space:nowrap; }
  table.cmp tbody tr:hover { background:#fbf9ff; }
  table.cmp td:first-child { font-weight:700; color:var(--ink); white-space:nowrap; }
  .yes { color:#178a7a; font-weight:700; }
  .partial { color:#b57a00; font-weight:700; }
  .cmp-note { padding:18px 30px 26px; font-size:13.5px; color:var(--muted); }

  /* Token price */
  .price-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .price-card {
    background:#fff; border:1px solid var(--line); border-radius:20px; padding:28px;
    display:flex; flex-direction:column; gap:14px;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .price-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lift); }
  .price-card.featured { border-color:#c9b8ff; box-shadow:0 16px 40px rgba(108,76,255,.16); background:linear-gradient(180deg,#fff,#faf7ff); }
  .price-name { font-size:15px; font-weight:800; color:var(--violet-deep); }
  .price-value { font-size:30px; font-weight:800; color:var(--ink); letter-spacing:-.01em; }
  .price-value small { font-size:13px; color:var(--muted); font-weight:600; }
  .price-card ul { display:grid; gap:9px; }
  .price-card li { font-size:14px; color:var(--ink-soft); padding-left:20px; position:relative; }
  .price-card li::before {
    content:""; position:absolute; left:0; top:8px; width:8px; height:8px; border-radius:50%;
    background:linear-gradient(135deg,var(--violet),var(--coral));
  }
  .price-card .btn { margin-top:auto; width:100%; }

  /* Reviews */
  .review-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .review {
    background:#fff; border:1px solid var(--line); border-radius:18px; padding:26px;
    display:flex; flex-direction:column; gap:14px;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .review:hover { transform:translateY(-5px); box-shadow:var(--shadow-lift); }
  .review-top { display:flex; align-items:center; gap:12px; }
  .avatar {
    width:44px; height:44px; border-radius:50%; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    font-weight:800; color:#fff; font-size:16px;
    background:linear-gradient(135deg,var(--violet),#9b7bff);
  }
  .review:nth-child(2) .avatar { background:linear-gradient(135deg,var(--teal),#5ad6c4); }
  .review:nth-child(3) .avatar { background:linear-gradient(135deg,var(--coral),#ff9a8b); }
  .review:nth-child(4) .avatar { background:linear-gradient(135deg,var(--amber),#ffd27a); color:#4a3200; }
  .review:nth-child(5) .avatar { background:linear-gradient(135deg,var(--sky),#7ab6ff); }
  .review:nth-child(6) .avatar { background:linear-gradient(135deg,#8b5cff,#c0a8ff); }
  .review-top strong { display:block; font-size:14.5px; }
  .review-top span { font-size:12.5px; color:var(--muted); }
  .review p { font-size:14px; color:var(--ink-soft); }
  .review .rw { font-size:12.5px; color:var(--violet-deep); font-weight:700; }

  /* Articles */
  .article-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:24px; align-items:start; }
  .article-feature {
    background:#fff; border:1px solid var(--line); border-radius:20px; overflow:hidden;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .article-feature:hover { transform:translateY(-4px); box-shadow:var(--shadow-lift); }
  .article-feature .thumb { aspect-ratio:16/9; overflow:hidden; background:#f1ecff; }
  .article-feature .thumb img { width:100%; height:100%; object-fit:cover; }
  .article-feature .ab { padding:24px; }
  .article-feature h3 { font-size:19px; margin-bottom:8px; }
  .article-feature p { font-size:14px; color:var(--muted); }
  .article-list { display:grid; gap:12px; }
  .article-item {
    background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px 20px;
    display:flex; align-items:center; gap:14px;
    transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }
  .article-item:hover { transform:translateX(4px); box-shadow:var(--shadow); border-color:#ddd5ff; }
  .article-item .idx {
    flex:0 0 34px; width:34px; height:34px; border-radius:10px;
    display:flex; align-items:center; justify-content:center;
    background:#f1ecff; color:var(--violet-deep); font-weight:800; font-size:14px;
  }
  .article-item strong { display:block; font-size:14.5px; }
  .article-item span { font-size:12.5px; color:var(--muted); }

  /* Form */
  .form-grid { display:grid; grid-template-columns:1fr 1fr; gap:26px; align-items:start; }
  .form-box {
    background:#fff; border:1px solid var(--line); border-radius:22px; padding:32px;
    box-shadow:var(--shadow);
  }
  .form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
  .form-field label { display:block; font-size:13.5px; font-weight:700; margin-bottom:7px; color:var(--ink); }
  .form-field input, .form-field select, .form-field textarea {
    width:100%; padding:12px 14px; border:1.5px solid #e8e3f3; border-radius:12px;
    font-size:14.5px; font-family:inherit; color:var(--ink); background:#fdfcff;
    transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
  }
  .form-field input:focus, .form-field select:focus, .form-field textarea:focus {
    outline:none; border-color:var(--violet); background:#fff;
    box-shadow:0 0 0 4px rgba(108,76,255,.12);
  }
  .form-field textarea { resize:vertical; min-height:110px; }
  .form-field.full { grid-column:1 / -1; }
  .form-box .btn { width:100%; margin-top:6px; }
  .contact-side { display:grid; gap:16px; }
  .contact-card {
    background:#fff; border:1px solid var(--line); border-radius:18px; padding:24px;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .contact-card:hover { transform:translateY(-3px); box-shadow:var(--shadow); }
  .contact-card h3 { font-size:16px; margin-bottom:8px; }
  .contact-card p { font-size:14px; color:var(--ink-soft); }
  .contact-card a { color:var(--violet-deep); font-weight:700; }
  .kefu-wrap { margin-top:14px; width:150px; border-radius:12px; overflow:hidden; border:1px solid var(--line); }
  .kefu-wrap img { width:100%; height:auto; }

  /* Banner images strip */
  .media-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
  .media-strip .m-item {
    border-radius:14px; overflow:hidden; border:1px solid var(--line); background:#fff;
    aspect-ratio:4/3; transition:transform .25s ease, box-shadow .25s ease;
  }
  .media-strip .m-item:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
  .media-strip .m-item img { width:100%; height:100%; object-fit:cover; }

  /* Tags */
  .tagcloud { display:flex; flex-wrap:wrap; gap:10px; }
  .tagcloud span {
    font-size:13px; font-weight:600; padding:8px 15px; border-radius:999px;
    background:#fff; border:1px solid var(--line); color:var(--ink-soft);
    transition:transform .2s ease, color .2s ease, border-color .2s ease, background .2s ease;
  }
  .tagcloud span:hover { transform:translateY(-2px); color:var(--violet-deep); border-color:#c9b8ff; background:#faf7ff; }

  /* FAQ */
  .faq-grid { display:grid; gap:12px; max-width:900px; margin:0 auto; }
  .faq-item { background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; transition:box-shadow .25s ease, border-color .25s ease; }
  .faq-item:hover { border-color:#d4c7ff; }
  .faq-q {
    width:100%; text-align:left; background:none; border:none; cursor:pointer;
    display:flex; align-items:center; justify-content:space-between; gap:16px;
    padding:18px 22px; font-size:15.5px; font-weight:700; color:var(--ink);
    font-family:inherit; line-height:1.5;
  }
  .faq-q .plus { flex:0 0 22px; width:22px; height:22px; position:relative; }
  .faq-q .plus::before, .faq-q .plus::after {
    content:""; position:absolute; background:var(--violet-deep); border-radius:2px; transition:transform .3s ease;
  }
  .faq-q .plus::before { width:14px; height:2px; top:10px; left:4px; }
  .faq-q .plus::after { width:2px; height:14px; top:4px; left:10px; }
  .faq-item.open .faq-q .plus::after { transform:rotate(90deg); }
  .faq-a { max-height:0; overflow:hidden; transition:max-height .35s ease; }
  .faq-a p { padding:0 22px 20px; font-size:14.2px; color:var(--ink-soft); }

  /* Footer */
  .site-footer {
    background:#221a3d; color:#d8d2ee; padding:56px 0 0;
  }
  .footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:32px; padding-bottom:36px; }
  .site-footer h4 { color:#fff; font-size:15px; margin-bottom:14px; }
  .site-footer p { font-size:13.5px; color:#b7b0d2; line-height:1.8; }
  .site-footer a { color:#c9c2e6; font-size:13.5px; transition:color .2s ease; }
  .site-footer a:hover { color:#fff; }
  .footer-links { display:grid; gap:9px; }
  .friend-links { display:flex; flex-wrap:wrap; gap:8px 14px; }
  .footer-bottom {
    border-top:1px solid rgba(255,255,255,.12); padding:18px 0;
    display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px;
    font-size:12.8px; color:#a49dc4;
  }
  .footer-bottom a { color:#c9c2e6; }

  /* Float customer */
  .float-service {
    position:fixed; right:18px; bottom:86px; z-index:120;
    display:flex; flex-direction:column; gap:10px;
  }
  .float-btn {
    width:52px; height:52px; border-radius:50%; border:none; cursor:pointer;
    background:linear-gradient(135deg,var(--violet),var(--violet-deep));
    color:#fff; font-size:12px; font-weight:800; line-height:1.1;
    display:flex; align-items:center; justify-content:center; text-align:center;
    box-shadow:0 10px 26px rgba(74,47,214,.34);
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .float-btn:hover { transform:translateY(-3px) scale(1.05); box-shadow:0 16px 32px rgba(74,47,214,.44); }
  .float-pop {
    position:fixed; right:18px; bottom:150px; z-index:130;
    width:220px; background:#fff; border:1px solid var(--line); border-radius:16px;
    padding:16px; box-shadow:0 18px 44px rgba(34,26,61,.22);
    display:none;
  }
  .float-pop.open { display:block; animation:fadeDown .28s ease; }
  .float-pop h4 { font-size:14px; margin-bottom:8px; }
  .float-pop p { font-size:12.8px; color:var(--muted); margin-bottom:10px; }
  .float-pop img { width:100%; border-radius:10px; }
  .back-top {
    position:fixed; right:18px; bottom:22px; z-index:120;
    width:46px; height:46px; border-radius:50%; border:1px solid var(--line);
    background:#fff; color:var(--violet-deep); font-size:18px; font-weight:800;
    cursor:pointer; box-shadow:0 8px 22px rgba(34,26,61,.14);
    display:flex; align-items:center; justify-content:center;
    opacity:0; visibility:hidden; transform:translateY(10px);
    transition:opacity .25s ease, transform .25s ease, visibility .25s ease;
  }
  .back-top.show { opacity:1; visibility:visible; transform:translateY(0); }

  /* Reveal */
  .reveal { opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
  .reveal.in { opacity:1; transform:translateY(0); }

  /* Responsive */
  @media (max-width:1024px) {
    .nav-links { display:none; }
    .menu-toggle { display:flex; }
    .nav-actions .btn-ghost { display:none; }
    .hero-inner { grid-template-columns:1fr; gap:36px; }
    .hero-stats { grid-template-columns:1fr 1fr 1fr; }
    .hstat.wide { grid-column:1 / -1; }
    .service-grid { grid-template-columns:repeat(2,1fr); }
    .flow { grid-template-columns:repeat(3,1fr); }
    .scenario-grid { grid-template-columns:repeat(3,1fr); }
    .review-grid { grid-template-columns:repeat(2,1fr); }
    .price-grid { grid-template-columns:repeat(2,1fr); }
    .case-grid { grid-template-columns:repeat(2,1fr); }
    .network-grid { grid-template-columns:repeat(2,1fr); }
    .article-grid { grid-template-columns:1fr; }
    .form-grid { grid-template-columns:1fr; }
    .about-grid { grid-template-columns:1fr; }
    .footer-grid { grid-template-columns:1fr 1fr; }
    .media-strip { grid-template-columns:repeat(2,1fr); }
  }
  @media (max-width:640px) {
    section { padding:52px 0; }
    .hero { padding:52px 0 60px; }
    .hero-stats { grid-template-columns:1fr 1fr; }
    .service-grid, .flow, .scenario-grid, .review-grid, .price-grid, .case-grid, .network-grid, .form-row { grid-template-columns:1fr; }
    .footer-grid { grid-template-columns:1fr; gap:26px; }
    .footer-bottom { flex-direction:column; }
    .compare-head { padding:22px 20px; }
    table.cmp th, table.cmp td { padding:13px 14px; font-size:13.5px; }
    .form-box { padding:22px; }
    .float-pop { width:190px; }
  }
  @media (prefers-reduced-motion: reduce) {
    * { animation:none !important; transition:none !important; }
    .reveal { opacity:1; transform:none; }
  }