:root{
      --bg0:#070612;
      --bg1:#0b0a1d;
      --panel:rgba(255,255,255,.06);
      --panel2:rgba(255,255,255,.085);
      --stroke:rgba(255,255,255,.12);
      --stroke2:rgba(255,255,255,.18);
      --text:#e9e6ff;
      --muted:rgba(233,230,255,.72);
      --muted2:rgba(233,230,255,.55);
      --brand1:#ff49c7;
      --brand2:#9b5cff;
      --brand3:#44d6ff;
      --good:#48f2b6;
      --warn:#ffd36e;
      --danger:#ff6b8b;
      --shadow: 0 18px 60px rgba(0,0,0,.45);
      --shadow2: 0 10px 30px rgba(0,0,0,.35);
      --radius:18px;
      --radius2:14px;
      --container:1120px;
      --padX:18px;
      --focus: 0 0 0 3px rgba(255,73,199,.25), 0 0 0 1px rgba(255,73,199,.35);
    }

    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC", Arial, "Apple Color Emoji","Segoe UI Emoji";
      color:var(--text);
      background:
        radial-gradient(900px 480px at 15% 0%, rgba(155,92,255,.35), transparent 55%),
        radial-gradient(720px 420px at 75% 10%, rgba(255,73,199,.28), transparent 55%),
        radial-gradient(620px 360px at 50% 40%, rgba(68,214,255,.18), transparent 58%),
        linear-gradient(180deg, var(--bg0), var(--bg1));
      overflow-x:hidden;
    }

    .container{
      max-width:var(--container);
      margin:0 auto;
      padding:0 var(--padX);
    }

    a{color:inherit; text-decoration:none}
    a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
      outline:none;
      box-shadow: var(--focus);
      border-color: rgba(255,73,199,.5) !important;
    }

    .topbar{
      position:sticky;
      top:0;
      z-index:40;
      backdrop-filter: blur(10px);
      background: linear-gradient(180deg, rgba(10,9,26,.86), rgba(10,9,26,.56));
      border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .topbar-inner{
      height:72px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
    }

    .brand{
      display:flex;
      align-items:center;
      gap:12px;
      min-width: 210px;
    }
    .logo-wrap{
      width:40px;height:40px;
      display:flex;align-items:center;justify-content:center;
      border-radius:12px;
      background: linear-gradient(135deg, rgba(255,73,199,.22), rgba(155,92,255,.18));
      border:1px solid rgba(255,255,255,.12);
      box-shadow: 0 10px 24px rgba(0,0,0,.22);
    }
    .ai-page-logo{max-width:100%; height:auto; display:block}
    .brand-title{
      display:flex; flex-direction:column; line-height:1.1;
    }
    .brand-title strong{
      font-size:14px; letter-spacing:.2px;
    }
    .brand-title span{
      font-size:12px;
      color:var(--muted2);
      margin-top:4px;
      white-space:nowrap;
    }

    .nav{
      display:flex;
      align-items:center;
      gap:14px;
      flex-wrap:wrap;
      justify-content:flex-end;
    }
    .nav a{
      font-size:13px;
      color:var(--muted);
      padding:10px 10px;
      border-radius:12px;
      border:1px solid transparent;
      transition: transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
      user-select:none;
    }
    .nav a:hover{
      color:var(--text);
      background: rgba(255,255,255,.06);
      border-color: rgba(255,255,255,.14);
      transform: translateY(-1px);
    }
    .nav-cta{
      display:flex;align-items:center;gap:10px;
    }

    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:10px;
      padding:12px 14px;
      border-radius:14px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(255,255,255,.06);
      color:var(--text);
      font-weight:650;
      font-size:13px;
      letter-spacing:.2px;
      transition: transform .15s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
      user-select:none;
      white-space:nowrap;
    }
    .btn:hover{
      transform: translateY(-1px);
      box-shadow: 0 16px 40px rgba(0,0,0,.35);
      border-color: rgba(255,255,255,.22);
      background: rgba(255,255,255,.085);
    }
    .btn:active{transform: translateY(0px) scale(.99)}
    .btn-primary{
      border-color: rgba(255,73,199,.35);
      background: linear-gradient(135deg, rgba(255,73,199,.22), rgba(155,92,255,.18));
    }
    .btn-primary .spark{
      width:10px;height:10px;border-radius:50%;
      background: radial-gradient(circle at 30% 30%, #fff, rgba(255,255,255,.3) 35%, rgba(255,73,199,.85) 60%, rgba(155,92,255,.6));
      box-shadow: 0 0 0 6px rgba(255,73,199,.08), 0 0 34px rgba(255,73,199,.25);
    }
    .btn-ghost{
      background: rgba(255,255,255,.035);
    }

    .hamburger{
      display:none;
      width:44px;height:44px;
      align-items:center;justify-content:center;
      border-radius:14px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(255,255,255,.06);
      cursor:pointer;
      transition: transform .15s ease, background .15s ease;
    }
    .hamburger:hover{transform: translateY(-1px); background: rgba(255,255,255,.085)}
    .hamburger i{
      width:18px;height:2px;background:rgba(255,255,255,.86); display:block; position:relative; border-radius:2px;
    }
    .hamburger i:before,.hamburger i:after{
      content:""; position:absolute; left:0; right:0; height:2px; background:rgba(255,255,255,.86);
      border-radius:2px;
    }
    .hamburger i:before{top:-6px}
    .hamburger i:after{top:6px}

    .mobile-nav{
      display:none;
      padding:14px 0 18px;
      border-top: 1px solid rgba(255,255,255,.08);
    }
    .mobile-nav .mgrid{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:10px;
      padding-top:12px;
    }
    .mobile-nav a{
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.04);
      border-radius:14px;
      padding:12px 10px;
      font-size:13px;
      color:var(--muted);
      transition: background .15s ease, border-color .15s ease, transform .15s ease, color .15s ease;
    }
    .mobile-nav a:hover{
      color:var(--text);
      background: rgba(255,255,255,.075);
      border-color: rgba(255,255,255,.18);
      transform: translateY(-1px);
    }

    .hero{
      position:relative;
      padding:56px 0 26px;
    }

    .hero-grid{
      display:grid;
      grid-template-columns: 1.12fr .88fr;
      gap:22px;
      align-items:stretch;
    }

    .hero-card{
      border-radius:26px;
      border:1px solid rgba(255,255,255,.12);
      background:
        radial-gradient(900px 400px at 20% 0%, rgba(255,73,199,.22), transparent 55%),
        radial-gradient(700px 350px at 70% 10%, rgba(155,92,255,.22), transparent 52%),
        linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
      box-shadow: var(--shadow);
      padding:26px;
      position:relative;
      overflow:hidden;
    }

    .hero-card:before{
      content:"";
      position:absolute;
      inset:-2px;
      background:
        radial-gradient(240px 160px at 16% 30%, rgba(255,73,199,.26), transparent 62%),
        radial-gradient(260px 180px at 60% 10%, rgba(155,92,255,.22), transparent 60%),
        radial-gradient(220px 160px at 86% 42%, rgba(68,214,255,.14), transparent 58%);
      opacity:.95;
      pointer-events:none;
    }
    .hero-card > *{position:relative; z-index:1}

    .badge{
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding:9px 12px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(255,255,255,.04);
      color:var(--muted);
      font-size:12px;
      letter-spacing:.2px;
    }
    .badge .dot{
      width:8px;height:8px;border-radius:50%;
      background: linear-gradient(135deg, var(--brand1), var(--brand2));
      box-shadow: 0 0 0 6px rgba(255,73,199,.08);
    }

    .hero h1{
      margin:14px 0 10px;
      font-size:34px;
      letter-spacing:-.6px;
      line-height:1.15;
    }
    .hero p{
      margin:0;
      color:var(--muted);
      font-size:14.5px;
      line-height:1.8;
      max-width:62ch;
    }

    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      margin-top:18px;
      align-items:center;
    }

    .quick-form-inline{
      margin-top:18px;
      border-radius:18px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.04);
      padding:14px;
      display:flex;
      gap:10px;
      flex-wrap:wrap;
      align-items:center;
    }
    .quick-form-inline label{
      font-size:12px;color:var(--muted2); margin-right:6px;
    }
    .quick-form-inline .field{
      display:flex;align-items:center;gap:10px;flex:1;
      min-width: 210px;
    }
    .quick-form-inline input{
      width:100%;
      background: rgba(0,0,0,.15);
      border:1px solid rgba(255,255,255,.14);
      color:var(--text);
      border-radius:14px;
      padding:12px 12px;
      font-size:13px;
      outline:none;
    }
    .quick-form-inline select{
      width:100%;
      background: rgba(0,0,0,.15);
      border:1px solid rgba(255,255,255,.14);
      color:var(--text);
      border-radius:14px;
      padding:12px 12px;
      font-size:13px;
      outline:none;
      appearance:none;
    }

    .side-stack{
      display:flex;
      flex-direction:column;
      gap:14px;
    }

    .stats{
      border-radius:26px;
      border:1px solid rgba(255,255,255,.12);
      background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
      box-shadow: var(--shadow2);
      padding:18px;
      overflow:hidden;
      position:relative;
    }

    .stats:after{
      content:"";
      position:absolute;
      right:-60px; top:-60px;
      width:220px; height:220px;
      background: radial-gradient(circle at 30% 30%, rgba(255,73,199,.32), transparent 62%);
      filter: blur(0px);
      opacity:.9;
      pointer-events:none;
    }

    .stats .title{
      display:flex;align-items:center;justify-content:space-between;gap:10px;
      margin-bottom:12px;
      position:relative; z-index:1;
    }

    .stats .title strong{font-size:14px}
    .chip{
      font-size:12px;
      color:rgba(255,255,255,.84);
      padding:6px 10px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.16);
      background: rgba(0,0,0,.12);
      white-space:nowrap;
    }

    .metric-grid{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:12px;
      position:relative; z-index:1;
    }
    .metric{
      border-radius:16px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.035);
      padding:12px;
      transition: transform .18s ease, border-color .18s ease, background .18s ease;
    }
    .metric:hover{
      transform: translateY(-2px);
      border-color: rgba(255,255,255,.2);
      background: rgba(255,255,255,.055);
    }
    .metric .k{
      color:var(--muted2);
      font-size:12.5px;
      margin-bottom:6px;
    }
    .metric .v{
      font-size:18px;
      font-weight:820;
      letter-spacing:-.3px;
    }
    .metric .v small{
      font-size:12px;
      color:var(--muted);
      font-weight:700;
      margin-left:6px;
      letter-spacing:0;
    }
    .metric .bar{
      margin-top:10px;
      height:8px;
      border-radius:999px;
      background: rgba(255,255,255,.07);
      overflow:hidden;
      border:1px solid rgba(255,255,255,.1);
    }
    .metric .bar > span{
      display:block;height:100%;
      width:62%;
      border-radius:999px;
      background: linear-gradient(90deg, rgba(255,73,199,.85), rgba(155,92,255,.85));
      box-shadow: 0 0 18px rgba(255,73,199,.22);
      animation: fillPulse 2.3s ease-in-out infinite;
    }
    @keyframes fillPulse{
      0%,100%{transform: translateX(-1%); filter:saturate(1)}
      50%{transform: translateX(3%); filter:saturate(1.15)}
    }

    .side-panel{
      border-radius:26px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.04);
      padding:16px;
      box-shadow: var(--shadow2);
    }
    .side-panel h3{
      margin:0 0 10px;
      font-size:14px;
      color:rgba(255,255,255,.92);
      letter-spacing:.2px;
    }

    .service-bullets{
      list-style:none;
      padding:0;margin:0;
      display:flex;
      flex-direction:column;
      gap:10px;
    }
    .service-bullets li{
      display:flex;gap:10px;align-items:flex-start;
      padding:10px 10px;
      border-radius:16px;
      background: rgba(0,0,0,.10);
      border:1px solid rgba(255,255,255,.10);
      transition: transform .18s ease, border-color .18s ease, background .18s ease;
    }
    .service-bullets li:hover{
      transform: translateY(-1px);
      border-color: rgba(255,255,255,.18);
      background: rgba(255,255,255,.045);
    }
    .icon{
      width:34px;height:34px;border-radius:12px;
      display:flex;align-items:center;justify-content:center;
      border:1px solid rgba(255,255,255,.14);
      background: linear-gradient(135deg, rgba(255,73,199,.20), rgba(155,92,255,.12));
      flex:0 0 auto;
      box-shadow: 0 10px 24px rgba(0,0,0,.22);
    }
    .icon svg{width:18px;height:18px; fill:none; stroke: rgba(255,255,255,.92); stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
    .service-bullets b{font-size:13px}
    .service-bullets span{
      display:block;
      color:var(--muted);
      font-size:12.5px;
      line-height:1.55;
      margin-top:4px;
    }

    .section{
      padding:34px 0;
    }
    .section-header{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:14px;
      margin-bottom:16px;
    }
    .section-header h2{
      margin:0;
      font-size:22px;
      letter-spacing:-.3px;
    }
    .section-header p{
      margin:0;
      color:var(--muted);
      font-size:13.5px;
      line-height:1.7;
      max-width:64ch;
    }
    .hintline{
      display:flex;
      gap:10px;
      align-items:center;
      color:var(--muted2);
      font-size:12.5px;
      white-space:nowrap;
    }
    .hintline .pulse{
      width:10px;height:10px;border-radius:50%;
      background: linear-gradient(135deg, var(--brand1), var(--brand2));
      box-shadow: 0 0 0 7px rgba(255,73,199,.08);
      animation: pulse 2.0s ease-in-out infinite;
    }
    @keyframes pulse{
      0%,100%{transform: scale(1); opacity:.95}
      50%{transform: scale(1.15); opacity:.7}
    }

    .grid-3{
      display:grid;
      grid-template-columns: repeat(3, 1fr);
      gap:14px;
    }
    .grid-4{
      display:grid;
      grid-template-columns: repeat(4, 1fr);
      gap:12px;
    }

    .card{
      border-radius:18px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.04);
      padding:16px;
      box-shadow: 0 12px 34px rgba(0,0,0,.18);
      transition: transform .18s ease, border-color .18s ease, background .18s ease;
      position:relative;
      overflow:hidden;
    }
    .card:hover{
      transform: translateY(-2px);
      border-color: rgba(255,255,255,.2);
      background: rgba(255,255,255,.055);
    }
    .card .card-title{
      display:flex;align-items:center;gap:10px;
      margin-bottom:10px;
    }
    .card .card-title strong{
      font-size:14px;
      letter-spacing:.2px;
    }
    .card p{
      margin:0;
      color:var(--muted);
      font-size:13.3px;
      line-height:1.75;
    }
    .taglist{
      display:flex; flex-wrap:wrap; gap:8px;
      margin-top:12px;
    }
    .tag{
      font-size:12px;
      color:rgba(255,255,255,.86);
      padding:7px 10px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(0,0,0,.12);
    }

    .timeline{
      border-radius:22px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.035);
      padding:18px;
      overflow:hidden;
      position:relative;
    }
    .timeline:before{
      content:"";
      position:absolute;
      left:22px; top:18px; bottom:18px;
      width:2px;
      background: linear-gradient(180deg, rgba(255,73,199,.45), rgba(155,92,255,.15));
      opacity:.7;
    }
    .steps{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:12px;
      position:relative;
      z-index:1;
    }
    .step{
      display:flex; gap:12px; align-items:flex-start;
      padding-left:54px;
      position:relative;
    }
    .step .n{
      position:absolute;
      left:8px; top:2px;
      width:34px;height:34px;border-radius:14px;
      display:flex;align-items:center;justify-content:center;
      border:1px solid rgba(255,255,255,.14);
      background: linear-gradient(135deg, rgba(255,73,199,.18), rgba(155,92,255,.12));
      box-shadow: 0 12px 28px rgba(0,0,0,.25);
      font-weight:850;
      color:rgba(255,255,255,.92);
      font-size:13px;
    }
    .step .h{
      font-size:14px;
      margin:0 0 6px;
      letter-spacing:.2px;
    }
    .step .t{
      color:var(--muted);
      font-size:13.1px;
      line-height:1.7;
      margin:0;
    }

    .compare-wrap{
      border-radius:26px;
      border:1px solid rgba(255,255,255,.12);
      background:
        radial-gradient(700px 260px at 20% 0%, rgba(255,73,199,.18), transparent 52%),
        radial-gradient(650px 260px at 90% 20%, rgba(155,92,255,.16), transparent 55%),
        rgba(255,255,255,.03);
      box-shadow: var(--shadow2);
      padding:16px;
      overflow:hidden;
    }
    .rating-top{
      display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap;
      padding:10px 10px 12px;
    }
    .rating{
      display:flex; gap:12px; align-items:center;
      min-width: 240px;
    }
    .stars{
      width:62px; height:62px; border-radius:20px;
      border:1px solid rgba(255,255,255,.14);
      background: linear-gradient(135deg, rgba(255,73,199,.20), rgba(155,92,255,.14));
      display:flex; align-items:center; justify-content:center;
      box-shadow: 0 14px 40px rgba(0,0,0,.28);
    }
    .stars svg{width:32px;height:32px}
    .rating strong{
      font-size:14px;
      color:rgba(255,255,255,.95);
      display:block;
      margin-bottom:6px;
    }
    .rating .score{
      font-size:20px;
      font-weight:900;
      letter-spacing:-.4px;
    }
    .rating .score small{
      font-size:12px;
      color:var(--muted2);
      font-weight:750;
      margin-left:8px;
    }

    .rating-note{
      color:var(--muted);
      font-size:13.2px;
      line-height:1.7;
      max-width:62ch;
      padding-top:4px;
    }

    .table-wrap{
      border-radius:18px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(0,0,0,.12);
      overflow:auto;
      -webkit-overflow-scrolling: touch;
      margin-top:8px;
    }
    table{
      width:100%;
      border-collapse:separate;
      border-spacing:0;
      min-width: 860px;
      font-size:13.2px;
    }
    thead th{
      position:sticky;
      top:0;
      background: rgba(10,9,26,.96);
      backdrop-filter: blur(10px);
      border-bottom:1px solid rgba(255,255,255,.10);
      color:rgba(255,255,255,.92);
      padding:14px 12px;
      text-align:left;
      white-space:nowrap;
    }
    tbody td{
      padding:12px 12px;
      border-bottom:1px solid rgba(255,255,255,.08);
      color:var(--muted);
      vertical-align:top;
      line-height:1.6;
    }
    tbody tr:hover td{background: rgba(255,255,255,.03); color: rgba(255,255,255,.88)}
    .td-strong{color:rgba(255,255,255,.93); font-weight:750}
    .mark{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:7px 10px;
      border-radius:999px;
      border:1px solid rgba(72,242,182,.3);
      background: rgba(72,242,182,.10);
      color: rgba(225,255,242,.95);
      font-weight:760;
      white-space:nowrap;
    }
    .mark.bad{
      border-color: rgba(255,107,139,.3);
      background: rgba(255,107,139,.10);
      color: rgba(255,218,228,.95);
    }

    .two-col{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:14px;
    }

    .review-card{
      display:flex; flex-direction:column; gap:12px;
    }
    .avatar-row{
      display:flex; align-items:center; justify-content:space-between; gap:10px;
    }
    .avatar{
      display:flex; align-items:center; gap:10px;
    }
    .avatar .face{
      width:44px;height:44px;border-radius:16px;
      border:1px solid rgba(255,255,255,.14);
      background: linear-gradient(135deg, rgba(255,73,199,.20), rgba(155,92,255,.14));
      display:flex;align-items:center;justify-content:center;
      box-shadow: 0 14px 38px rgba(0,0,0,.28);
      font-weight:900;
      letter-spacing:-.4px;
    }
    .avatar b{display:block; font-size:13.5px}
    .avatar span{display:block; color:var(--muted2); font-size:12.5px; margin-top:4px}
    .quote{
      color:var(--muted);
      font-size:13.2px;
      line-height:1.85;
      margin:0;
    }
    .review-footer{
      display:flex; align-items:center; justify-content:space-between; gap:10px;
      padding-top:2px;
      border-top:1px dashed rgba(255,255,255,.12);
      margin-top:auto;
    }
    .small-stars{
      display:flex; gap:4px; align-items:center;
    }
    .small-stars svg{width:14px;height:14px}
    .pill{
      font-size:12px;
      color:rgba(255,255,255,.88);
      padding:7px 10px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(255,255,255,.03);
      white-space:nowrap;
    }

    .solution-grid{
      display:grid;
      grid-template-columns: repeat(3, 1fr);
      gap:14px;
    }
    .scene{
      border-radius:18px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.04);
      padding:16px;
      overflow:hidden;
      position:relative;
    }
    .scene:before{
      content:"";
      position:absolute;
      inset:auto -40px -60px auto;
      width:180px;height:180px;border-radius:50%;
      background: radial-gradient(circle at 30% 30%, rgba(255,73,199,.25), transparent 62%);
      opacity:.9;
      pointer-events:none;
    }
    .scene > *{position:relative; z-index:1}
    .scene h3{
      margin:0 0 8px;
      font-size:14.5px;
      letter-spacing:.2px;
    }
    .scene p{
      margin:0;
      color:var(--muted);
      font-size:13.2px;
      line-height:1.75;
    }
    .scene ul{
      margin:12px 0 0;
      padding:0;
      list-style:none;
      display:flex; flex-wrap:wrap; gap:8px;
    }
    .scene li{
      font-size:12px;
      padding:7px 10px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(0,0,0,.10);
      color:rgba(255,255,255,.88);
    }

    .match-grid{
      display:grid;
      grid-template-columns: .95fr 1.05fr;
      gap:14px;
    }

    .form-card{
      border-radius:26px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.04);
      box-shadow: var(--shadow2);
      padding:18px;
    }
    .form-card h3{
      margin:0 0 8px;
      font-size:16px;
      letter-spacing:.2px;
    }
    .form-card p{
      margin:0 0 14px;
      color:var(--muted);
      font-size:13.2px;
      line-height:1.75;
    }

    form{margin-top:8px}
    .form-grid{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:12px;
    }
    .form-grid .full{grid-column: 1 / -1;}
    .form-field{
      display:flex; flex-direction:column; gap:8px;
    }
    .form-field label{
      color:var(--muted2);
      font-size:12.5px;
    }
    .control{
      width:100%;
      background: rgba(0,0,0,.18);
      border:1px solid rgba(255,255,255,.14);
      color:var(--text);
      border-radius:14px;
      padding:12px 12px;
      font-size:13px;
      outline:none;
      transition: border-color .15s ease, background .15s ease;
    }
    textarea.control{min-height:106px; resize:vertical}
    .form-actions{
      display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap;
      margin-top:12px;
      padding-top:12px;
      border-top:1px dashed rgba(255,255,255,.12);
    }
    .fineprint{
      color:var(--muted2);
      font-size:12.2px;
      line-height:1.6;
      max-width:60ch;
    }

    .price-sim{
      border-radius:26px;
      border:1px solid rgba(255,255,255,.12);
      background:
        radial-gradient(600px 260px at 10% 10%, rgba(68,214,255,.16), transparent 55%),
        radial-gradient(540px 220px at 95% 0%, rgba(255,73,199,.14), transparent 55%),
        rgba(255,255,255,.03);
      padding:18px;
      box-shadow: var(--shadow2);
    }
    .price-sim .row{
      display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap;
      margin-bottom:12px;
    }
    .price-sim h3{margin:0; font-size:16px; letter-spacing:.2px}
    .price-sim .sub{margin:0; color:var(--muted); font-size:13.2px; line-height:1.75; max-width:62ch}
    .seg{
      display:flex; gap:8px; flex-wrap:wrap; margin:12px 0 8px;
    }
    .seg button{
      border-radius:999px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(0,0,0,.12);
      color: rgba(255,255,255,.88);
      padding:9px 12px;
      cursor:pointer;
      font-weight:700;
      font-size:12.5px;
      transition: transform .15s ease, background .15s ease, border-color .15s ease;
    }
    .seg button:hover{transform: translateY(-1px); background: rgba(255,255,255,.05)}
    .seg button[aria-pressed="true"]{
      border-color: rgba(255,73,199,.42);
      background: linear-gradient(135deg, rgba(255,73,199,.18), rgba(155,92,255,.14));
      box-shadow: 0 16px 40px rgba(0,0,0,.25);
    }
    .quote-box{
      border-radius:18px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(0,0,0,.14);
      padding:14px;
    }
    .quote-box .big{
      font-size:26px;
      font-weight:950;
      letter-spacing:-.6px;
      margin:0 0 8px;
    }
    .quote-box .big small{
      font-size:12.5px; color:var(--muted2); font-weight:800; margin-left:8px; letter-spacing:0;
    }
    .quote-box p{margin:0; color:var(--muted); font-size:13.2px; line-height:1.75}
    .kv{
      margin-top:10px;
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:10px;
    }
    .kv .item{
      border-radius:16px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.03);
      padding:12px;
    }
    .kv .item .k{color:var(--muted2); font-size:12.5px; margin-bottom:6px}
    .kv .item .v{font-weight:900; letter-spacing:-.3px}

    .faq-grid{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:12px;
    }
    details{
      border-radius:18px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.04);
      overflow:hidden;
      transition: border-color .18s ease, background .18s ease;
    }
    details[open]{
      border-color: rgba(255,73,199,.35);
      background: rgba(255,255,255,.06);
    }
    summary{
      list-style:none;
      cursor:pointer;
      padding:14px 14px;
      display:flex;
      gap:12px;
      align-items:flex-start;
      justify-content:space-between;
      user-select:none;
    }
    summary::-webkit-details-marker{display:none}
    .q{
      display:flex; gap:12px; align-items:flex-start;
    }
    .q .badgeq{
      width:34px;height:34px;border-radius:14px;
      display:flex;align-items:center;justify-content:center;
      border:1px solid rgba(255,255,255,.14);
      background: linear-gradient(135deg, rgba(255,73,199,.18), rgba(155,92,255,.12));
      flex:0 0 auto;
      color:rgba(255,255,255,.92);
      font-weight:900;
      font-size:13px;
      margin-top:1px;
    }
    .q b{
      font-size:13.8px;
      letter-spacing:.15px;
      color:rgba(255,255,255,.94);
      line-height:1.55;
    }
    .chev{
      width:34px;height:34px;border-radius:14px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(0,0,0,.12);
      display:flex;align-items:center;justify-content:center;
      flex:0 0 auto;
      transition: transform .2s ease;
    }
    details[open] .chev{transform: rotate(180deg)}
    .answer{
      padding:0 14px 14px;
      color:var(--muted);
      font-size:13.2px;
      line-height:1.8;
    }

    .articles{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:14px;
      align-items:stretch;
    }
    .list-card{
      border-radius:26px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.03);
      box-shadow: var(--shadow2);
      padding:16px;
      overflow:hidden;
      position:relative;
    }
    .list-card:before{
      content:"";
      position:absolute;
      left:-50px; top:-50px;
      width:160px; height:160px; border-radius:50%;
      background: radial-gradient(circle at 30% 30%, rgba(155,92,255,.25), transparent 65%);
      opacity:.95;
      pointer-events:none;
    }
    .list-card > *{position:relative; z-index:1}
    .list-card h3{
      margin:0 0 10px;
      font-size:16px;
      letter-spacing:.2px;
    }
    .list{
      list-style:none;
      padding:0;margin:0;
      display:flex; flex-direction:column; gap:10px;
    }
    .list li a{
      display:flex; align-items:flex-start; justify-content:space-between; gap:10px;
      padding:12px 12px;
      border-radius:16px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(0,0,0,.12);
      color: rgba(255,255,255,.92);
      transition: transform .18s ease, border-color .18s ease, background .18s ease;
      user-select:none;
    }
    .list li a:hover{
      transform: translateY(-2px);
      border-color: rgba(255,255,255,.2);
      background: rgba(255,255,255,.05);
    }
    .list .meta{
      color:var(--muted2);
      font-size:12.3px;
      margin-top:4px;
      white-space:nowrap;
    }
    .list .arrow{
      width:34px;height:34px;border-radius:14px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.03);
      display:flex;align-items:center;justify-content:center;
      flex:0 0 auto;
      margin-top:2px;
    }
    .list .arrow svg{width:16px;height:16px; stroke: rgba(255,255,255,.92); stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round}

    .logos-grid{
      display:grid;
      grid-template-columns: repeat(6, 1fr);
      gap:10px;
    }
    .logo-pill{
      border-radius:16px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(0,0,0,.12);
      padding:12px 10px;
      text-align:center;
      color:rgba(255,255,255,.88);
      font-size:12.2px;
      line-height:1.2;
      transition: transform .18s ease, background .18s ease, border-color .18s ease;
      user-select:none;
    }
    .logo-pill:hover{
      transform: translateY(-2px);
      border-color: rgba(255,255,255,.2);
      background: rgba(255,255,255,.05);
    }

    .footer{
      margin-top:10px;
      padding:26px 0 18px;
      border-top: 1px solid rgba(255,255,255,.10);
      background: linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.20));
    }
    .footer-grid{
      display:grid;
      grid-template-columns: 1.2fr .8fr;
      gap:14px;
      align-items:start;
    }
    .footer .foot-title{
      display:flex; align-items:center; gap:12px;
      margin-bottom:10px;
    }
    .footer p{
      margin:0;
      color:var(--muted);
      font-size:13.2px;
      line-height:1.8;
    }
    .footer-right{
      display:flex;
      flex-direction:column;
      gap:12px;
      align-items:flex-end;
    }
    .links-grid{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      justify-content:flex-end;
      max-width:520px;
    }
    .links-grid a{
      font-size:12.6px;
      color: rgba(255,255,255,.9);
      padding:9px 12px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(0,0,0,.12);
      transition: transform .18s ease, border-color .18s ease, background .18s ease;
      user-select:none;
      white-space:nowrap;
    }
    .links-grid a:hover{
      transform: translateY(-2px);
      border-color: rgba(255,255,255,.2);
      background: rgba(255,255,255,.05);
    }
    .copyright{
      margin-top:14px;
      padding-top:12px;
      border-top:1px dashed rgba(255,255,255,.12);
      display:flex;
      justify-content:space-between;
      gap:12px;
      align-items:center;
      flex-wrap:wrap;
    }
    .copyright span{
      color:var(--muted2);
      font-size:12.5px;
    }

    .toTop{
      position:fixed;
      right:16px;
      bottom:16px;
      z-index:60;
      width:46px;height:46px;
      border-radius:18px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(10,9,26,.72);
      backdrop-filter: blur(10px);
      color:rgba(255,255,255,.92);
      display:flex;align-items:center;justify-content:center;
      cursor:pointer;
      box-shadow: 0 18px 60px rgba(0,0,0,.4);
      transform: translateY(14px);
      opacity:0;
      pointer-events:none;
      transition: transform .2s ease, opacity .2s ease, background .2s ease, border-color .2s ease;
    }
    .toTop.show{
      transform: translateY(0);
      opacity:1;
      pointer-events:auto;
    }
    .toTop:hover{
      background: rgba(255,255,255,.06);
      border-color: rgba(255,255,255,.22);
    }
    .toTop svg{width:18px;height:18px; stroke: rgba(255,255,255,.92); stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round}

    .float-kefu{
      position:fixed;
      left:16px;
      bottom:16px;
      z-index:55;
      display:flex; flex-direction:column; gap:10px;
      align-items:flex-start;
    }
    .kefu-card{
      width:148px;
      border-radius:20px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(10,9,26,.72);
      backdrop-filter: blur(10px);
      box-shadow: 0 18px 60px rgba(0,0,0,.4);
      overflow:hidden;
      transform: translateY(12px);
      opacity:0;
      pointer-events:none;
      transition: transform .22s ease, opacity .22s ease;
    }
    .kefu-card.show{
      transform: translateY(0);
      opacity:1;
      pointer-events:auto;
    }
    .kefu-head{
      padding:10px 10px 8px;
      border-bottom:1px solid rgba(255,255,255,.10);
      display:flex; align-items:center; justify-content:space-between; gap:10px;
    }
    .kefu-head b{font-size:12.8px}
    .kefu-head button{
      border:none;
      background:transparent;
      color:rgba(255,255,255,.78);
      cursor:pointer;
      padding:6px 8px;
      border-radius:12px;
      border:1px solid rgba(255,255,255,.12);
    }
    .kefu-head button:hover{background: rgba(255,255,255,.06)}
    .kefu-body{
      padding:10px;
      display:flex;
      flex-direction:column;
      gap:8px;
    }
    .kefu-body img{
      width:100%;
      height:auto;
      border-radius:14px;
      border:1px solid rgba(255,255,255,.12);
      display:block;
      background: rgba(255,255,255,.02);
    }
    .kefu-body a{
      font-size:12.6px;
      color:rgba(255,255,255,.9);
      padding:9px 10px;
      border-radius:14px;
      border:1px solid rgba(255,255,255,.14);
      background: rgba(255,255,255,.04);
      text-align:center;
      transition: transform .18s ease, background .18s ease;
      user-select:none;
    }
    .kefu-body a:hover{transform: translateY(-2px); background: rgba(255,255,255,.06)}
    .kefu-toggle{
      width:52px;height:52px;
      border-radius:20px;
      border:1px solid rgba(255,255,255,.14);
      background: linear-gradient(135deg, rgba(255,73,199,.18), rgba(155,92,255,.12));
      display:flex;align-items:center;justify-content:center;
      cursor:pointer;
      box-shadow: 0 18px 60px rgba(0,0,0,.4);
      transition: transform .15s ease, border-color .15s ease, background .15s ease;
      user-select:none;
    }
    .kefu-toggle:hover{transform: translateY(-2px); border-color: rgba(255,255,255,.22); background: linear-gradient(135deg, rgba(255,73,199,.22), rgba(155,92,255,.16))}
    .kefu-toggle svg{width:22px;height:22px; stroke: rgba(255,255,255,.95); stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round}

    .reveal{
      opacity:0;
      transform: translateY(12px);
      transition: opacity .55s ease, transform .55s ease;
    }
    .reveal.in{
      opacity:1;
      transform: translateY(0);
    }

    @media (max-width: 980px){
      .hero-grid{grid-template-columns: 1fr; gap:14px}
      .steps{grid-template-columns:1fr}
      .grid-3{grid-template-columns: 1fr}
      .grid-4{grid-template-columns: 1fr 1fr}
      .two-col{grid-template-columns:1fr}
      .match-grid{grid-template-columns:1fr}
      .faq-grid{grid-template-columns:1fr}
      .articles{grid-template-columns:1fr}
      .solution-grid{grid-template-columns:1fr}
      .logos-grid{grid-template-columns: repeat(3, 1fr)}
      .footer-grid{grid-template-columns:1fr}
      .footer-right{align-items:flex-start}
      .links-grid{justify-content:flex-start}
      table{min-width: 760px}
    }

    @media (max-width: 860px){
      .nav{display:none}
      .nav-cta{display:none}
      .hamburger{display:flex}
      .mobile-nav.open{display:block}
      .mobile-nav{display:none}
    }

    @media (prefers-reduced-motion: reduce){
      *{animation:none !important; transition:none !important; scroll-behavior:auto !important}
    }