* { margin: 0; padding: 0; box-sizing: border-box; }
  body { font-family: 'Helvetica Neue', Arial, sans-serif; color: #3d3a38; background: #fff; line-height: 1.7; }
  .container { max-width: 1000px; margin: 0 auto; padding: 0 20px; }
  img { max-width: 100%; height: auto; display: block; }
  section { padding: 48px 0; }
  .hero { background: linear-gradient(135deg, #eef4fd 0%, #f3eefb 100%); text-align: center; }
  .hero h1 { font-size: 30px; font-weight: 700; color: #6d7fd4; margin: 24px 0 10px; letter-spacing: 0.5px; }
  .hero p { font-size: 16px; color: #6b6562; max-width: 720px; margin: 0 auto; }
  .hero img { border-radius: 12px; }
  .sec-title { font-size: 24px; font-weight: 700; color: #6d7fd4; text-align: center; margin-bottom: 8px; }
  .sec-sub { text-align: center; color: #8a8280; font-size: 14px; margin-bottom: 32px; }
  .two-col { display: flex; gap: 32px; align-items: center; flex-wrap: wrap; }
  .two-col .img { flex: 1 1 40%; }
  .two-col .txt { flex: 1 1 50%; }
  .txt h3 { font-size: 20px; color: #4a4442; margin-bottom: 12px; }
  .txt p { margin-bottom: 12px; color: #5f5a57; }
  .txt ul { list-style: none; }
  .txt ul li { padding: 6px 0 6px 22px; position: relative; color: #5f5a57; }
  .txt ul li::before { content: "鉁?; color: #8b9ae0; position: absolute; left: 0; top: 6px; font-size: 13px; }
  .craft-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 24px; }
  .craft-card { border: 1px solid #dfe4f8; border-radius: 10px; padding: 20px; background: #fafbff; }
  .craft-card h4 { color: #6d7fd4; font-size: 16px; margin-bottom: 6px; }
  .craft-card p { font-size: 13px; color: #6b6562; }
  table.spec { width: 100%; border-collapse: collapse; margin-top: 20px; background: #fff; }
  table.spec th, table.spec td { border: 1px solid #dfe4f8; padding: 12px 16px; text-align: left; font-size: 14px; }
  table.spec th { background: #f2f4fd; color: #6d7fd4; font-weight: 600; width: 35%; }
  table.spec td { color: #5f5a57; }
  .app-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-top: 24px; }
  .app-item { text-align: center; }
  .app-item img { border-radius: 10px; margin-bottom: 10px; }
  .app-item h4 { font-size: 15px; color: #4a4442; }
  .app-item p { font-size: 13px; color: #8a8280; }
  .why-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 24px; }
  .why-card { background: #f8fafd; border: 1px solid #dce6f2; border-radius: 10px; padding: 20px; text-align: center; }
  .why-card .num { font-size: 28px; font-weight: 700; color: #7a8bd8; }
  .why-card h4 { font-size: 14px; color: #4a4442; margin: 6px 0 4px; }
  .why-card p { font-size: 13px; color: #6b6562; }
  .cta { background: linear-gradient(135deg, #6d7fd4 0%, #9b8bd8 100%); color: #fff; text-align: center; border-radius: 10px; padding: 36px 20px; margin-top: 40px; }
  .cta h3 { font-size: 22px; margin-bottom: 8px; }
  .cta p { font-size: 14px; opacity: 0.95; }
  .faq-wrap { max-width: 760px; margin: 0 auto; }
  details { border: 1px solid #dfe4f8; border-radius: 8px; margin-bottom: 10px; background: #fff; overflow: hidden; }
  summary { cursor: pointer; padding: 14px 18px; font-weight: 600; font-size: 15px; color: #4a4442; list-style: none; position: relative; padding-right: 40px; }
  summary::-webkit-details-marker { display: none; }
  summary::after { content: "+"; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-size: 20px; color: #7a8bd8; }
  details[open] summary::after { content: "鈭?; }
  details .ans { padding: 0 18px 16px; font-size: 14px; color: #5f5a57; }
  .footer { text-align: center; padding: 28px 0; font-size: 13px; color: #a89f9c; border-top: 1px solid #f0e9e7; }
  @media (max-width: 640px) { .hero h1 { font-size: 22px; } .sec-title { font-size: 20px; } }