:root{
    --bg:#08050f;
    --text:#f4efff;
    --muted:#b6acc9;
    --muted-2:#918aa6;
    --pink:#ff4fd8;
    --pink-soft:#ff8ee6;
    --violet:#8b5cf6;
    --line:rgba(255,255,255,.10);
    --panel:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth; scroll-padding-top:88px;}
  body{
    margin:0;
    background:#08050f;
    color:var(--text);
    font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
    font-size:15px;
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
  }
  body::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:
      radial-gradient(900px 520px at 12% -6%, rgba(255,63,200,.24), transparent 62%),
      radial-gradient(760px 520px at 92% 6%, rgba(139,92,246,.26), transparent 64%),
      radial-gradient(820px 620px at 50% 106%, rgba(56,232,255,.12), transparent 66%),
      linear-gradient(180deg,#0a0616 0%,#08050f 42%,#0a0614 100%);
  }
  a{color:var(--pink-soft); text-decoration:none;}
  .container{
    width:100%;
    max-width:1180px;
    margin:0 auto;
    padding:0 20px;
  }
  section{padding:70px 0; position:relative;}
  h2{
    font-size:clamp(22px,3.2vw,30px);
    line-height:1.35;
    margin:12px 0;
    color:#fff;
    letter-spacing:.01em;
  }
  h3{color:#fff;}
  .sec-head{margin-bottom:32px; max-width:800px;}
  .sec-kicker{
    display:inline-block;
    font-size:12px;
    letter-spacing:.16em;
    color:var(--pink-soft);
    padding:4px 12px;
    border:1px solid rgba(255,79,216,.35);
    border-radius:999px;
    background:rgba(255,79,216,.08);
  }
  .sec-desc{color:var(--muted); font-size:15px; margin:0; max-width:780px;}

  /* ===== 导航 ===== */
  .site-nav{
    position:sticky;
    top:0;
    z-index:60;
    background:rgba(8,5,15,.86);
    -webkit-backdrop-filter:blur(14px);
    backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);
  }
  .nav-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    min-height:66px;
    position:relative;
  }
  .brand{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
  }
  .brand-logo{
    height:34px;
    display:flex;
    align-items:center;
    max-width:150px;
    overflow:hidden;
  }
  .brand-logo img{max-height:34px;}
  .brand-name{
    font-size:15px;
    font-weight:700;
    color:#fff;
    letter-spacing:.04em;
    white-space:nowrap;
  }
  .nav-links{
    display:flex;
    align-items:center;
    gap:0;
    flex-wrap:wrap;
    justify-content:flex-end;
  }
  .nav-links a{
    display:block;
    padding:8px 10px;
    font-size:13.5px;
    color:#d9d1ea;
    border-radius:8px;
    transition:color .25s ease, background .25s ease;
    white-space:nowrap;
  }
  .nav-links a:hover,
  .nav-links a:focus{
    color:#fff;
    background:rgba(255,79,216,.16);
  }
  .nav-right{display:flex; align-items:center; gap:10px;}
  .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:13px 24px;
    border-radius:999px;
    font-size:15px;
    font-weight:600;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .25s ease, box-shadow .25s ease, filter .25s ease, background .25s ease;
  }
  .btn-primary{
    background:linear-gradient(90deg,#ff3fc8,#8b5cf6);
    color:#fff;
    box-shadow:0 10px 28px rgba(255,63,200,.28);
  }
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 14px 36px rgba(255,63,200,.42); filter:brightness(1.06);}
  .btn-ghost{
    background:rgba(255,255,255,.05);
    color:#ffd9f6;
    border-color:rgba(255,79,216,.45);
  }
  .btn-ghost:hover{background:rgba(255,79,216,.16); transform:translateY(-2px);}
  .btn-sm{padding:9px 18px; font-size:13.5px;}
  .nav-toggle{
    display:none;
    align-items:center;
    justify-content:center;
    width:40px;
    height:36px;
    border-radius:10px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.06);
    color:#fff;
    font-size:16px;
    cursor:pointer;
  }

  /* ===== Hero ===== */
  .hero{padding:64px 0 60px; overflow:hidden;}
  .hero-grid{
    display:grid;
    grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
    gap:36px;
    align-items:center;
    position:relative;
    z-index:1;
  }
  .hero-copy > *{animation:fadeUp .7s both;}
  .hero-copy > *:nth-child(1){animation-delay:.05s;}
  .hero-copy > *:nth-child(2){animation-delay:.14s;}
  .hero-copy > *:nth-child(3){animation-delay:.23s;}
  .hero-copy > *:nth-child(4){animation-delay:.32s;}
  .hero-copy > *:nth-child(5){animation-delay:.41s;}
  h1{
    font-size:clamp(28px,4.8vw,46px);
    line-height:1.24;
    margin:16px 0 16px;
    color:#fff;
    letter-spacing:-.01em;
  }
  h1 .hl{color:#ff5fd8;}
  .hero-sub{color:#c2b9d6; font-size:16px; margin:0 0 26px; max-width:610px;}
  .hero-actions{display:flex; flex-wrap:wrap; gap:12px;}
  .hero-note{margin:18px 0 0; font-size:13px; color:var(--muted-2); letter-spacing:.04em;}
  .hero-panel{
    background:linear-gradient(165deg,rgba(255,79,216,.18),rgba(139,92,246,.12) 55%,rgba(255,255,255,.03));
    border:1px solid rgba(255,255,255,.13);
    border-radius:20px;
    padding:22px;
    box-shadow:0 24px 60px rgba(0,0,0,.45);
    animation:fadeUp .8s .2s both;
  }
  .panel-head{font-size:13px; color:#ffd9f6; letter-spacing:.08em; margin-bottom:14px;}
  .chip-grid{display:flex; flex-wrap:wrap; gap:8px;}
  .chip{
    font-size:12.5px;
    padding:6px 11px;
    border-radius:999px;
    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.13);
    color:#eae4f7;
    transition:background .25s ease, transform .25s ease;
  }
  .chip:hover{background:rgba(255,79,216,.22); transform:translateY(-2px);}
  .panel-foot{
    margin-top:16px;
    padding-top:14px;
    border-top:1px dashed rgba(255,255,255,.14);
    font-size:12.5px;
    color:#a79dc0;
  }
  .stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin-top:44px;
    position:relative;
    z-index:1;
  }
  .stat{
    background:rgba(255,255,255,.05);
    border:1px solid var(--line);
    border-radius:14px;
    padding:16px 18px;
    transition:transform .3s ease, border-color .3s ease;
  }
  .stat:hover{transform:translateY(-3px); border-color:rgba(255,79,216,.45);}
  .stat-num{font-size:23px; font-weight:700; color:#fff; line-height:1.3;}
  .stat-label{font-size:12.5px; color:#a79dc0; margin-top:4px;}

  @keyframes fadeUp{
    from{opacity:0; transform:translateY(18px);}
    to{opacity:1; transform:none;}
  }

  /* ===== 通用网格与卡片 ===== */
  .grid{display:grid; gap:16px;}
  .g2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .g3{grid-template-columns:repeat(3,minmax(0,1fr));}
  .g4{grid-template-columns:repeat(4,minmax(0,1fr));}
  .card{
    background:var(--panel);
    border:1px solid rgba(255,255,255,.09);
    border-radius:16px;
    padding:22px;
    transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  }
  .card:hover{
    transform:translateY(-4px);
    border-color:rgba(255,79,216,.42);
    box-shadow:0 18px 40px rgba(0,0,0,.45);
  }
  .card h3{font-size:17px; margin:0 0 8px;}
  .card p{margin:0; color:var(--muted); font-size:14px; line-height:1.75;}

  /* ===== 标签云 ===== */
  .tag-cloud{display:flex; flex-wrap:wrap; gap:9px; margin-top:24px;}
  .tag-cloud span{
    font-size:12.5px;
    padding:6px 12px;
    border-radius:8px;
    color:#ded7ee;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.1);
    transition:color .25s ease, border-color .25s ease, background .25s ease;
  }
  .tag-cloud span:hover{color:#fff; border-color:rgba(255,79,216,.5); background:rgba(255,79,216,.16);}

  /* ===== 流程时间线 ===== */
  .steps{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:28px;}
  .step{
    background:var(--panel);
    border:1px solid rgba(255,255,255,.09);
    border-radius:16px;
    padding:20px;
    position:relative;
    transition:transform .3s ease, border-color .3s ease;
  }
  .step:hover{transform:translateY(-4px); border-color:rgba(139,92,246,.5);}
  .step-no{
    display:inline-block;
    font-size:12px;
    letter-spacing:.12em;
    color:#ff8ee6;
    border:1px solid rgba(255,79,216,.35);
    border-radius:999px;
    padding:2px 10px;
    margin-bottom:12px;
  }
  .step h3{font-size:16px; margin:0 0 8px;}
  .step p{margin:0; font-size:13.5px; color:var(--muted);}

  /* ===== 媒体区 ===== */
  .media{
    border-radius:14px;
    overflow:hidden;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.09);
    aspect-ratio:16/10;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:8px;
  }
  .media img{width:100%; height:100%; object-fit:contain; display:block;}
  .media.square{aspect-ratio:1/1;}
  .case-card{padding:0; overflow:hidden;}
  .case-card .media{border:0; border-radius:0; border-bottom:1px solid rgba(255,255,255,.08);}
  .case-body{padding:18px 20px 22px;}
  .case-body h3{font-size:16px; margin:0 0 6px;}
  .case-body p{margin:0; font-size:13.5px; color:var(--muted);}

  /* ===== 评论 ===== */
  .quote-card{display:flex; flex-direction:column; justify-content:space-between; gap:16px;}
  .quote-text{margin:0; font-size:14px; color:#ded7ee; line-height:1.8;}
  .quote-meta{display:flex; align-items:center; gap:10px; border-top:1px dashed rgba(255,255,255,.12); padding-top:12px;}
  .quote-avatar{
    width:36px; height:36px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:14px; font-weight:700; color:#fff;
    background:linear-gradient(135deg,#ff3fc8,#8b5cf6);
    flex:0 0 auto;
  }
  .quote-meta strong{display:block; font-size:14px; color:#fff;}
  .quote-meta span{display:block; font-size:12.5px; color:#a79dc0;}

  /* ===== 表格 ===== */
  .table-wrap{
    overflow-x:auto;
    border:1px solid rgba(255,255,255,.1);
    border-radius:16px;
    background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.015));
    -webkit-overflow-scrolling:touch;
  }
  table{width:100%; border-collapse:collapse; min-width:640px; font-size:14px;}
  thead th{
    text-align:left;
    padding:14px 16px;
    background:rgba(255,79,216,.14);
    color:#fff;
    font-weight:600;
    white-space:nowrap;
    border-bottom:1px solid rgba(255,255,255,.12);
  }
  tbody td{
    padding:13px 16px;
    color:#cfc7e0;
    border-bottom:1px solid rgba(255,255,255,.07);
    vertical-align:top;
  }
  tbody tr:last-child td{border-bottom:0;}
  tbody td:first-child{color:#fff; font-weight:600;}
  tbody tr:hover td{background:rgba(255,79,216,.06);}

  /* ===== 评测 ===== */
  .review-layout{display:grid; grid-template-columns:290px minmax(0,1fr); gap:18px; align-items:start;}
  .score-card{
    background:linear-gradient(160deg,rgba(255,63,200,.24),rgba(139,92,246,.16));
    border:1px solid rgba(255,79,216,.36);
    border-radius:18px;
    padding:24px;
    box-shadow:0 18px 44px rgba(0,0,0,.35);
  }
  .score-label{font-size:12.5px; letter-spacing:.14em; color:#ffd0f2;}
  .score-value{font-size:50px; font-weight:800; color:#fff; line-height:1.1; margin-top:8px;}
  .score-value span{font-size:16px; font-weight:600; color:#ffc7f0; margin-left:4px;}
  .stars{color:#ffd166; font-size:18px; letter-spacing:5px; margin:8px 0 4px;}
  .score-desc{margin:6px 0 0; font-size:13.5px; color:#ffe4f8;}
  .score-list{margin:16px 0 0; padding:0; list-style:none;}
  .score-list li{font-size:13px; color:#ffe9fa; padding:5px 0 5px 16px; position:relative;}
  .score-list li::before{
    content:"";
    position:absolute;
    left:0; top:14px;
    width:6px; height:6px;
    border-radius:50%;
    background:#ffb8ee;
  }

  /* ===== 表单 ===== */
  .match-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:22px; align-items:start;}
  .point-list{list-style:none; margin:20px 0 0; padding:0; display:grid; gap:12px;}
  .point-list li{
    background:rgba(255,255,255,.045);
    border:1px solid rgba(255,255,255,.09);
    border-left:3px solid rgba(255,79,216,.55);
    border-radius:12px;
    padding:14px 16px;
    font-size:13.5px;
    color:var(--muted);
  }
  .point-list strong{display:block; color:#fff; font-size:14.5px; margin-bottom:2px;}
  .form-card{
    background:linear-gradient(165deg,rgba(255,79,216,.12),rgba(139,92,246,.08) 60%,rgba(255,255,255,.025));
    border:1px solid rgba(255,255,255,.12);
    border-radius:18px;
    padding:24px;
  }
  .form-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px;}
  .field{display:flex; flex-direction:column; gap:6px;}
  .field.full{grid-column:1/-1;}
  .field label{font-size:13px; color:#ded7ee;}
  .field input,
  .field select,
  .field textarea{
    width:100%;
    padding:11px 13px;
    font-size:14px;
    font-family:inherit;
    color:#f4efff;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.14);
    border-radius:10px;
    outline:none;
    transition:border-color .25s ease, box-shadow .25s ease, background .25s ease;
  }
  .field textarea{min-height:104px; resize:vertical;}
  .field input::placeholder,
  .field textarea::placeholder{color:rgba(244,239,255,.38);}
  .field input:focus,
  .field select:focus,
  .field textarea:focus{
    border-color:rgba(255,79,216,.65);
    box-shadow:0 0 0 3px rgba(255,79,216,.16);
    background:rgba(255,255,255,.09);
  }
  .field select option{background:#150c26; color:#f4efff;}
  .form-tip{margin:12px 0 0; font-size:12.5px; color:#a79dc0;}

  /* ===== 列表与链接 ===== */
  .link-list{list-style:none; margin:12px 0 0; padding:0;}
  .link-list li{border-bottom:1px dashed rgba(255,255,255,.1);}
  .link-list li:last-child{border-bottom:0;}
  .link-list a{
    display:block;
    padding:12px 0;
    font-size:14px;
    color:#ded7ee;
    transition:color .25s ease, padding-left .25s ease;
  }
  .link-list a:hover{color:#ff8ee6; padding-left:4px;}

  /* ===== 联系 ===== */
  .contact-grid{display:grid; grid-template-columns:280px minmax(0,1fr); gap:22px; align-items:start;}
  .qr-box{
    background:#fff;
    border-radius:14px;
    padding:10px;
    width:100%;
    max-width:200px;
  }
  .qr-box img{display:block; width:100%; height:auto;}
  .qr-caption{margin:12px 0 0; font-size:13px; color:var(--muted);}
  .contact-list{list-style:none; margin:0; padding:0; display:grid; gap:12px;}
  .contact-list li{
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    gap:10px;
    padding:14px 16px;
    background:rgba(255,255,255,.045);
    border:1px solid rgba(255,255,255,.09);
    border-radius:12px;
    font-size:14px;
    color:#ded7ee;
  }
  .contact-list .k{color:#a79dc0; font-size:12.5px; letter-spacing:.06em; min-width:76px;}
  .contact-list .v{color:#fff; font-weight:600;}

  /* ===== 页脚 ===== */
  .site-footer{
    position:relative;
    z-index:1;
    margin-top:0;
    background:rgba(255,255,255,.035);
    border-top:1px solid rgba(255,255,255,.1);
    padding:44px 0 22px;
  }
  .footer-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:28px;}
  .footer-brand p{color:#b6acc9; font-size:13.5px; margin:12px 0 0; max-width:340px;}
  .footer-title{font-size:14px; color:#fff; margin:0 0 10px; font-weight:700;}
  .footer-links{list-style:none; margin:0; padding:0; display:grid; gap:8px;}
  .footer-links a{font-size:13.5px; color:#c9c1dd; transition:color .25s ease;}
  .footer-links a:hover{color:#ff8ee6;}
  .footer-bottom{
    margin-top:30px;
    padding-top:16px;
    border-top:1px solid rgba(255,255,255,.09);
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    justify-content:space-between;
    align-items:center;
    font-size:12.5px;
    color:#a79dc0;
  }
  .footer-bottom a{color:#c9c1dd;}
  .footer-bottom a:hover{color:#ff8ee6;}

  /* ===== 浮动工具 ===== */
  .float-tools{
    position:fixed;
    right:16px;
    bottom:18px;
    z-index:70;
    display:flex;
    flex-direction:column;
    gap:10px;
  }
  .float-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:60px;
    padding:10px 14px;
    border-radius:999px;
    font-size:13px;
    font-weight:600;
    color:#fff;
    background:linear-gradient(135deg,#ff3fc8,#8b5cf6);
    border:1px solid rgba(255,255,255,.2);
    box-shadow:0 10px 24px rgba(255,63,200,.32);
    cursor:pointer;
    transition:transform .25s ease, filter .25s ease, opacity .25s ease;
  }
  .float-btn:hover{transform:translateY(-2px); filter:brightness(1.08);}
  .float-top{
    background:rgba(20,12,34,.9);
    border:1px solid rgba(255,255,255,.18);
    box-shadow:0 8px 20px rgba(0,0,0,.4);
    opacity:0;
    pointer-events:none;
  }
  .float-top.show{opacity:1; pointer-events:auto;}

  /* ===== 滚动渐入 ===== */
  html.js .reveal{opacity:0; transform:translateY(20px); transition:opacity .6s ease, transform .6s ease;}
  html.js .reveal.in{opacity:1; transform:none;}

  /* ===== 响应式 ===== */
  @media (max-width:1080px){
    .nav-toggle{display:inline-flex;}
    .nav-links{
      display:none;
      position:absolute;
      top:100%;
      left:0;
      right:0;
      flex-direction:column;
      align-items:stretch;
      gap:0;
      padding:10px 20px 18px;
      background:rgba(10,6,20,.98);
      border-bottom:1px solid var(--line);
      box-shadow:0 20px 40px rgba(0,0,0,.5);
    }
    .nav-links.open{display:flex;}
    .nav-links a{padding:12px 6px; font-size:14px; border-bottom:1px solid rgba(255,255,255,.06); border-radius:0;}
    .nav-cta{display:none;}
  }
  @media (max-width:980px){
    .g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr));}
    .steps{grid-template-columns:repeat(2,minmax(0,1fr));}
    .review-layout{grid-template-columns:minmax(0,1fr);}
    .match-grid{grid-template-columns:minmax(0,1fr);}
    .contact-grid{grid-template-columns:minmax(0,1fr);}
    .hero-grid{grid-template-columns:minmax(0,1fr); gap:26px;}
    .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  }
  @media (max-width:768px){
    section{padding:48px 0;}
    .hero{padding:40px 0 46px;}
    .stats{grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:32px;}
    .sec-head{margin-bottom:24px;}
  }
  @media (max-width:640px){
    .g2,.g3,.g4{grid-template-columns:minmax(0,1fr);}
    .steps{grid-template-columns:minmax(0,1fr);}
    .form-grid{grid-template-columns:minmax(0,1fr);}
    .footer-grid{grid-template-columns:minmax(0,1fr);}
    .brand-name{display:none;}
    .hero-actions .btn{flex:1 1 100%;}
    .card{padding:18px;}
    .form-card{padding:18px;}
  }
  @media (prefers-reduced-motion:reduce){
    *{animation-duration:.001ms !important; transition-duration:.001ms !important;}
    html{scroll-behavior:auto;}
  }

.faq-item{padding:0; overflow:hidden;}
  .faq-q{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:16px 20px;
    font-size:15px;
    font-weight:600;
    color:#fff;
    background:transparent;
    border:0;
    text-align:left;
    font-family:inherit;
    cursor:pointer;
    transition:color .25s ease;
  }
  .faq-q:hover{color:#ff8ee6;}
  .faq-icon{
    flex:0 0 auto;
    width:24px;
    height:24px;
    border-radius:50%;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    color:#ffd9f6;
    border:1px solid rgba(255,79,216,.5);
    background:rgba(255,79,216,.12);
    transition:transform .3s ease, background .3s ease;
  }
  .faq-item.open .faq-icon{transform:rotate(45deg); background:rgba(255,79,216,.3);}
  .faq-a{
    max-height:0;
    overflow:hidden;
    transition:max-height .35s ease;
  }
  .faq-item.open .faq-a{max-height:320px;}
  .faq-a p{
    margin:0;
    padding:0 20px 18px;
    font-size:13.5px;
    color:var(--muted);
    line-height:1.8;
    border-top:1px dashed rgba(255,255,255,.1);
    padding-top:14px;
  }
  @media (max-width:640px){
    .faq-q{font-size:14px; padding:14px 16px;}
    .faq-a p{padding-left:16px; padding-right:16px;}
  }