:root {
      --green: #b6ef38;
      --green-deep: #75bd22;
      --green-dark: #193b27;
      --ink: #16221b;
      --muted: #667269;
      --paper: #f7faf5;
      --white: #ffffff;
      --line: #dbe7d8;
      --soft: #edf6e7;
      --orange: #ff9f43;
      --shadow: 0 18px 50px rgba(34, 75, 34, .09);
      --container: min(1180px, calc(100% - 40px));
    }
    * { 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", "Microsoft YaHei", 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: var(--container); margin: 0 auto; }
    .topbar {
      background: var(--green-dark);
      color: #eaf8df;
      font-size: 13px;
      padding: 8px 0;
    }
    .topbar-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
    .topbar a { color: var(--green); }
    header {
      position: sticky;
      top: 0;
      z-index: 20;
      background: rgba(247,250,245,.94);
      border-bottom: 1px solid rgba(219,231,216,.9);
      backdrop-filter: blur(14px);
    }
    .nav {
      min-height: 76px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 26px;
    }
    .brand { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
    .ai-page-logo { width: 138px; }
    .brand-mark {
      width: 34px;
      height: 34px;
      border-radius: 9px;
      display: grid;
      place-items: center;
      background: var(--green);
      color: var(--green-dark);
      font-weight: 800;
      font-size: 14px;
    }
    .nav-links {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 0;
      flex-wrap: wrap;
      color: #47584a;
      font-size: 14px;
    }
    .nav-links a { padding: 8px 9px; transition: color .2s ease, background .2s ease; }
    .nav-links a:hover { color: var(--green-dark); background: var(--soft); }
    .nav-cta, .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      border: 1px solid transparent;
      border-radius: 7px;
      padding: 11px 18px;
      font-weight: 700;
      cursor: pointer;
      transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
    }
    .nav-cta, .btn-primary { background: var(--green); color: var(--green-dark); box-shadow: 0 8px 18px rgba(123,190,35,.2); }
    .btn-secondary { background: var(--white); color: var(--green-dark); border-color: var(--line); }
    .btn:hover, .nav-cta:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(63,105,46,.16); }
    .menu-toggle { display: none; border: 1px solid var(--line); background: var(--white); color: var(--green-dark); border-radius: 7px; padding: 8px 11px; }
    .hero {
      position: relative;
      overflow: hidden;
      background:
        linear-gradient(135deg, rgba(246,252,239,.98), rgba(231,248,213,.92)),
        repeating-linear-gradient(90deg, transparent 0, transparent 79px, rgba(117,189,34,.08) 80px);
      padding: 92px 0 78px;
    }
    .hero:after {
      content: "";
      position: absolute;
      right: -120px;
      top: 30px;
      width: 360px;
      height: 360px;
      border: 1px solid rgba(117,189,34,.2);
      border-radius: 50%;
      box-shadow: 0 0 0 32px rgba(117,189,34,.05), 0 0 0 64px rgba(117,189,34,.035);
    }
    .hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px; align-items: center; }
    .eyebrow { color: var(--green-deep); font-size: 13px; letter-spacing: 2px; font-weight: 800; text-transform: uppercase; }
    h1, h2, h3, p { margin-top: 0; }
    h1 { max-width: 680px; margin-bottom: 22px; font-size: clamp(38px, 5vw, 68px); line-height: 1.1; letter-spacing: 0; }
    h1 span { color: var(--green-deep); }
    .hero-copy { max-width: 650px; color: #526155; font-size: 18px; }
    .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 30px 0 34px; }
    .hero-note { color: var(--muted); font-size: 13px; }
    .hero-panel {
      position: relative;
      padding: 26px;
      background: rgba(255,255,255,.76);
      border: 1px solid rgba(117,189,34,.25);
      border-radius: 14px;
      box-shadow: var(--shadow);
      animation: rise .8s ease both;
    }
    .panel-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
    .panel-head strong { font-size: 18px; }
    .status { color: #4d851e; font-size: 12px; font-weight: 700; }
    .signal { display: grid; gap: 14px; }
    .signal-row { display: grid; grid-template-columns: 90px 1fr auto; gap: 12px; align-items: center; font-size: 13px; }
    .signal-bar { height: 8px; background: #dbead5; border-radius: 10px; overflow: hidden; }
    .signal-bar i { display: block; height: 100%; background: var(--green-deep); border-radius: inherit; }
    .signal-row b { color: var(--green-dark); }
    .metric-strip { margin-top: 38px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
    .metric { padding: 17px; border-left: 3px solid var(--green); background: rgba(255,255,255,.62); }
    .metric strong { display: block; font-size: 25px; color: var(--green-dark); line-height: 1.1; }
    .metric small { color: var(--muted); }
    section { padding: 92px 0; }
    .section-head { max-width: 700px; margin-bottom: 38px; }
    .section-head h2 { margin: 8px 0 12px; font-size: clamp(28px, 4vw, 42px); line-height: 1.2; }
    .section-head p { color: var(--muted); }
    .section-tint { background: #eef7e9; }
    .intro-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 50px; align-items: start; }
    .intro-lead { font-size: 23px; line-height: 1.5; color: var(--green-dark); }
    .intro-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
    .intro-item { padding: 18px; border-top: 2px solid var(--green); background: var(--white); }
    .intro-item strong { display: block; margin-bottom: 5px; }
    .intro-item p { color: var(--muted); font-size: 14px; margin-bottom: 0; }
    .service-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
    .service-card, .review-card, .case-card, .article-card, .network-card {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: 10px;
      padding: 22px;
      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    }
    .service-card:hover, .review-card:hover, .case-card:hover, .article-card:hover, .network-card:hover { transform: translateY(-5px); border-color: #b6d89b; box-shadow: var(--shadow); }
    .service-icon { width: 42px; height: 42px; border-radius: 10px; display: grid; place-items: center; background: var(--soft); color: var(--green-deep); font-weight: 800; margin-bottom: 18px; }
    .service-card h3 { margin-bottom: 8px; font-size: 18px; }
    .service-card p { margin-bottom: 0; color: var(--muted); font-size: 14px; }
    .tag-list { display: flex; flex-wrap: wrap; gap: 9px; }
    .tag { padding: 7px 11px; border: 1px solid #cfe3c6; background: #fbfefa; color: #416344; border-radius: 5px; font-size: 13px; }
    .making { background: var(--green-dark); color: #f2faec; }
    .making .section-head p { color: #bbd0bb; }
    .steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; border-top: 1px solid rgba(182,239,56,.35); }
    .step { position: relative; padding: 28px 20px 10px 0; }
    .step:not(:last-child):after { content: ""; position: absolute; top: 45px; right: 0; width: 1px; height: 42px; background: rgba(182,239,56,.35); }
    .step-no { color: var(--green); font-size: 13px; font-weight: 800; }
    .step h3 { color: #fff; font-size: 17px; margin: 9px 0; }
    .step p { color: #b8cbb7; font-size: 14px; margin-bottom: 0; }
    .industry-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .industry-card { padding: 24px; background: var(--white); border-top: 4px solid var(--green); }
    .industry-card h3 { margin-bottom: 8px; }
    .industry-card p { color: var(--muted); margin-bottom: 0; font-size: 14px; }
    .network-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
    .network-card h3 { margin-bottom: 10px; }
    .network-card p { color: var(--muted); }
    .platforms { display: flex; flex-wrap: wrap; gap: 8px; }
    .platforms span { padding: 7px 10px; background: var(--soft); color: var(--green-dark); border-radius: 5px; font-size: 13px; }
    .case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
    .case-media { overflow: hidden; margin: -22px -22px 19px; aspect-ratio: 16 / 8; background: #e6f1df; }
    .case-media img { width: 100%; height: 100%; object-fit: cover; }
    .case-card h3 { margin-bottom: 7px; }
    .case-card p { color: var(--muted); font-size: 14px; margin-bottom: 0; }
    .compare-wrap { display: grid; grid-template-columns: .75fr 1.25fr; gap: 24px; align-items: stretch; }
    .score-box { background: var(--green-dark); color: #fff; padding: 32px; border-radius: 10px; display: flex; flex-direction: column; justify-content: center; }
    .score-box .stars { color: var(--green); font-size: 23px; letter-spacing: 4px; }
    .score { font-size: 64px; line-height: 1; margin: 13px 0 5px; color: var(--green); font-weight: 800; }
    .score-box p { color: #bed1bd; margin-bottom: 0; }
    .table-wrap { overflow-x: auto; background: var(--white); border: 1px solid var(--line); border-radius: 10px; }
    table { width: 100%; min-width: 630px; border-collapse: collapse; }
    th, td { text-align: left; padding: 15px 17px; border-bottom: 1px solid var(--line); font-size: 14px; }
    th { background: #edf7e8; color: var(--green-dark); }
    tr:last-child td { border-bottom: 0; }
    td:last-child { color: #4d8c1e; font-weight: 700; }
    .timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
    .timeline-item { padding: 20px; background: var(--white); border-bottom: 3px solid var(--green); }
    .timeline-item b { color: var(--green-deep); font-size: 13px; }
    .timeline-item h3 { margin: 8px 0; font-size: 17px; }
    .timeline-item p { color: var(--muted); font-size: 14px; margin: 0; }
    .reviews { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .review-card { position: relative; }
    .review-card:before { content: "“"; color: var(--green-deep); font-size: 48px; line-height: 1; position: absolute; top: 12px; right: 18px; }
    .review-card p { color: #4f5e52; font-size: 14px; min-height: 76px; }
    .reviewer { display: flex; align-items: center; gap: 10px; border-top: 1px solid var(--line); padding-top: 13px; }
    .avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--green); color: var(--green-dark); display: grid; place-items: center; font-weight: 800; }
    .reviewer strong { display: block; font-size: 14px; }
    .reviewer small { color: var(--muted); }
    .article-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
    .article-card { padding: 17px; }
    .article-card b { display: block; color: var(--green-deep); font-size: 12px; margin-bottom: 7px; }
    .article-card h3 { font-size: 15px; line-height: 1.45; margin-bottom: 0; }
    .match-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 40px; align-items: start; }
    .match-copy { padding-top: 12px; }
    .match-copy h2 { font-size: 38px; line-height: 1.2; }
    .match-copy p { color: var(--muted); }
    .form-panel { background: var(--white); padding: 28px; border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow); }
    .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
    .field { display: grid; gap: 6px; }
    .field.full { grid-column: 1 / -1; }
    label { color: #435447; font-size: 13px; font-weight: 700; }
    input, select, textarea { width: 100%; border: 1px solid #cfe0ca; border-radius: 5px; padding: 11px 12px; color: var(--ink); background: #fcfefb; outline: none; }
    input:focus, select:focus, textarea:focus { border-color: var(--green-deep); box-shadow: 0 0 0 3px rgba(117,189,34,.14); }
    textarea { min-height: 120px; resize: vertical; }
    .form-panel .btn { margin-top: 18px; width: 100%; }
    .faq-list { display: grid; gap: 10px; max-width: 900px; }
    details { background: var(--white); border: 1px solid var(--line); border-radius: 7px; padding: 0 19px; }
    summary { cursor: pointer; list-style: none; padding: 17px 26px 17px 0; font-weight: 700; position: relative; }
    summary::-webkit-details-marker { display: none; }
    summary:after { content: "+"; position: absolute; right: 0; color: var(--green-deep); font-size: 20px; top: 13px; }
    details[open] summary:after { content: "−"; }
    details p { margin: 0; padding: 0 0 17px; color: var(--muted); font-size: 14px; }
    .knowledge { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
    .knowledge-card { padding: 28px; background: var(--green); color: var(--green-dark); }
    .knowledge-card:nth-child(2) { background: var(--green-dark); color: #fff; }
    .knowledge-card p { color: inherit; opacity: .78; }
    .knowledge-card .btn-secondary { border-color: transparent; }
    .contact-band { background: #e5f5d6; }
    .contact-grid { display: grid; grid-template-columns: 1fr .8fr .8fr; gap: 24px; align-items: center; }
    .contact-grid h2 { margin-bottom: 10px; font-size: 31px; }
    .contact-grid p { color: var(--muted); }
    .contact-item { padding-left: 18px; border-left: 3px solid var(--green-deep); }
    .contact-item strong { display: block; margin-bottom: 4px; }
    .contact-item span { color: var(--muted); font-size: 14px; }
    .qr img { width: 110px; border-radius: 6px; border: 5px solid #fff; }
    footer { background: var(--green-dark); color: #d7e7d1; padding: 45px 0 22px; }
    .footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 30px; padding-bottom: 30px; }
    footer h3 { color: #fff; font-size: 16px; margin-bottom: 13px; }
    footer p, footer a { color: #b8cbb7; font-size: 13px; }
    footer a:hover { color: var(--green); }
    .footer-links { display: grid; gap: 7px; }
    .friend-links { display: flex; flex-wrap: wrap; gap: 8px 14px; }
    .copyright { border-top: 1px solid rgba(255,255,255,.14); padding-top: 17px; color: #9eb69d; font-size: 12px; }
    .float-contact, .to-top { position: fixed; right: 20px; z-index: 15; border: 0; cursor: pointer; box-shadow: 0 10px 25px rgba(24,61,36,.2); }
    .float-contact { bottom: 74px; width: 50px; height: 50px; border-radius: 50%; background: var(--green); color: var(--green-dark); font-weight: 800; }
    .to-top { bottom: 18px; width: 38px; height: 38px; border-radius: 6px; background: var(--green-dark); color: var(--green); display: none; }
    .reveal { opacity: 0; transform: translateY(18px); transition: opacity .65s ease, transform .65s ease; }
    .reveal.visible { opacity: 1; transform: translateY(0); }
    @keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
    @media (max-width: 1050px) {
      .nav-links { display: none; position: absolute; left: 20px; right: 20px; top: 70px; padding: 12px; background: var(--white); border: 1px solid var(--line); box-shadow: var(--shadow); }
      .nav-links.open { display: grid; grid-template-columns: repeat(3, 1fr); }
      .nav-links a { text-align: center; }
      .menu-toggle { display: block; }
      .hero-grid, .intro-grid, .compare-wrap, .match-grid { grid-template-columns: 1fr; }
      .service-grid { grid-template-columns: repeat(2, 1fr); }
      .article-grid { grid-template-columns: repeat(3, 1fr); }
      .contact-grid { grid-template-columns: 1fr 1fr; }
      .contact-grid > :first-child { grid-column: 1 / -1; }
    }
    @media (max-width: 680px) {
      :root { --container: min(100% - 28px, 1180px); }
      .topbar-inner { align-items: flex-start; flex-direction: column; gap: 2px; }
      .nav { min-height: 66px; }
      .ai-page-logo { width: 116px; }
      .nav-cta { display: none; }
      .nav-links.open { grid-template-columns: repeat(2, 1fr); }
      .hero { padding: 64px 0 52px; }
      h1 { font-size: 40px; }
      .hero-copy { font-size: 16px; }
      .metric-strip, .service-grid, .intro-list, .industry-grid, .case-grid, .reviews, .timeline, .knowledge, .footer-grid, .contact-grid { grid-template-columns: 1fr; }
      .metric-strip { gap: 8px; }
      section { padding: 65px 0; }
      .steps { grid-template-columns: 1fr; }
      .step { border-bottom: 1px solid rgba(182,239,56,.25); padding: 20px 0; }
      .step:not(:last-child):after { display: none; }
      .article-grid { grid-template-columns: 1fr 1fr; }
      .form-grid { grid-template-columns: 1fr; }
      .field.full { grid-column: auto; }
      .contact-grid > :first-child { grid-column: auto; }
      .qr img { width: 96px; }
    }