:root{
      --bg0:#fbfaf7;
      --bg1:#f5f7fb;
      --card:#ffffff;
      --text:#1f2430;
      --muted:#5a6678;
      --muted2:#7a879a;
      --line:rgba(17,24,39,.10);
      --shadow: 0 10px 30px rgba(17,24,39,.08);
      --shadow2: 0 6px 18px rgba(17,24,39,.10);
      --brand:#2b6cff;
      --brand2:#7c3aed;
      --brand3:#00bcd4;
      --good:#16a34a;
      --warn:#f59e0b;
      --hot:#ef4444;
      --radius:18px;
      --radius2:14px;
      --container: 1120px;
    }

    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      color:var(--text);
      background:
        radial-gradient(900px 420px at 15% 0%, rgba(124,58,237,.10), transparent 60%),
        radial-gradient(900px 420px at 85% 10%, rgba(43,108,255,.12), transparent 55%),
        radial-gradient(650px 360px at 70% 65%, rgba(0,188,212,.10), transparent 55%),
        linear-gradient(180deg, var(--bg0), var(--bg1));
      overflow-x:hidden;
    }

    a{color:inherit; text-decoration:none}
    .container{
      width:100%;
      max-width:var(--container);
      margin:0 auto;
      padding:0 18px;
    }

    .skip{
      position:absolute;
      left:-9999px;
      top:auto;
      width:1px;height:1px;overflow:hidden;
    }
    .skip:focus{
      left:16px;top:16px;width:auto;height:auto;z-index:9999;
      padding:10px 12px;border-radius:10px;background:#fff;border:1px solid var(--line);
      box-shadow: var(--shadow2);
    }

    header{
      position:sticky;
      top:0;
      z-index:50;
      backdrop-filter: blur(10px);
      background: rgba(251,250,247,.74);
      border-bottom:1px solid rgba(17,24,39,.06);
    }

    .nav-wrap{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:14px;
      padding:12px 0;
    }
    .brand{
      display:flex;align-items:center;gap:10px;min-width:220px;
    }
    .brand img{
      width:38px;height:38px;object-fit:contain;
      border-radius:10px;
      background: rgba(255,255,255,.85);
      box-shadow: 0 8px 18px rgba(43,108,255,.12);
      padding:6px;
    }
    .brand .brand-text{
      display:flex;flex-direction:column;line-height:1.15;
    }
    .brand .brand-name{
      font-weight:800;letter-spacing:.2px;font-size:15px;
    }
    .brand .brand-sub{
      font-size:12px;color:var(--muted);
    }

    .nav{
      display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;
    }
    .nav a, .nav button{
      font-size:13px;
      color:var(--muted);
      padding:9px 10px;
      border-radius:12px;
      border:1px solid transparent;
      background:transparent;
      cursor:pointer;
      transition: transform .12s ease, background .15s ease, border-color .15s ease, color .15s ease;
      white-space:nowrap;
    }
    .nav a:hover{
      background: rgba(43,108,255,.08);
      border-color: rgba(43,108,255,.20);
      color: #2453d6;
      transform: translateY(-1px);
    }

    .nav .primary{
      color:#fff;
      background: linear-gradient(135deg, var(--brand), var(--brand2));
      border: 1px solid rgba(255,255,255,.22);
      box-shadow: 0 12px 28px rgba(43,108,255,.20);
    }
    .nav .primary:hover{
      background: linear-gradient(135deg, #2453d6, #6d28d9);
      border-color: rgba(255,255,255,.30);
    }

    .nav .ghost{
      border-color: rgba(17,24,39,.10);
      background: rgba(255,255,255,.70);
      color: var(--text);
    }
    .nav .ghost:hover{
      background:#fff;
      border-color: rgba(17,24,39,.16);
      color: #101827;
    }

    .menu-btn{
      display:none;
    }

    main{padding-bottom:18px}

    .hero{
      padding:34px 0 18px;
    }

    .hero-grid{
      display:grid;
      grid-template-columns: 1.1fr .9fr;
      gap:18px;
      align-items:stretch;
    }

    .hero-left{
      border-radius: var(--radius);
      background:
        radial-gradient(1200px 420px at 10% 0%, rgba(43,108,255,.24), transparent 60%),
        radial-gradient(760px 380px at 92% 18%, rgba(124,58,237,.20), transparent 55%),
        radial-gradient(680px 360px at 70% 95%, rgba(0,188,212,.18), transparent 60%),
        linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.70));
      border:1px solid rgba(17,24,39,.08);
      box-shadow: var(--shadow);
      padding:20px;
      position:relative;
      overflow:hidden;
    }

    .scribble{
      position:absolute;
      inset:-40px -60px auto -60px;
      height:220px;
      pointer-events:none;
      opacity:.28;
      background:
        radial-gradient(circle at 15% 50%, rgba(43,108,255,.75), transparent 45%),
        radial-gradient(circle at 40% 35%, rgba(124,58,237,.7), transparent 42%),
        radial-gradient(circle at 70% 60%, rgba(0,188,212,.65), transparent 45%);
      filter: blur(6px);
      transform: rotate(-8deg);
    }

    .hero-kicker{
      display:flex;align-items:center;gap:10px;flex-wrap:wrap;
    }
    .pill{
      display:inline-flex;align-items:center;gap:8px;
      padding:7px 10px;border-radius:999px;
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.10);
      color: var(--muted);
      font-size:12.5px;
    }
    .dot{
      width:10px;height:10px;border-radius:50%;
      background: conic-gradient(from 180deg, var(--brand), var(--brand2), var(--brand3), var(--brand));
      box-shadow: 0 8px 18px rgba(43,108,255,.25);
    }

    h1{
      margin:14px 0 10px;
      font-size:28px;
      letter-spacing:-.6px;
      line-height:1.25;
    }

    .hero-desc{
      margin:0;
      color:var(--muted);
      font-size:14.5px;
      line-height:1.8;
      max-width:58ch;
    }

    .hero-actions{
      display:flex;
      gap:12px;
      flex-wrap:wrap;
      margin-top:16px;
      align-items:center;
    }
    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:10px;
      padding:12px 14px;
      border-radius:14px;
      border:1px solid rgba(17,24,39,.10);
      background:#fff;
      cursor:pointer;
      transition: transform .12s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
      font-weight:700;
      font-size:14px;
      color:var(--text);
      user-select:none;
    }
    .btn:hover{
      transform: translateY(-1px);
      box-shadow: 0 12px 24px rgba(17,24,39,.10);
      border-color: rgba(17,24,39,.18);
      background:#fff;
    }
    .btn-primary{
      color:#fff;
      border-color: rgba(255,255,255,.22);
      background: linear-gradient(135deg, var(--brand), var(--brand2));
      box-shadow: 0 16px 34px rgba(43,108,255,.24);
    }
    .btn-primary:hover{
      background: linear-gradient(135deg, #2453d6, #6d28d9);
      box-shadow: 0 18px 40px rgba(43,108,255,.26);
    }
    .btn .arrow{
      width:18px;height:18px;border-radius:6px;
      background: rgba(255,255,255,.22);
      display:inline-flex;align-items:center;justify-content:center;
      border:1px solid rgba(255,255,255,.22);
    }
    .btn-primary .arrow{
      background: rgba(255,255,255,.20);
    }

    .hero-meta{
      margin-top:14px;
      display:flex;gap:10px;flex-wrap:wrap;
    }
    .meta-card{
      flex:1;
      min-width: 185px;
      padding:12px 12px;
      border-radius:16px;
      background: rgba(255,255,255,.72);
      border:1px solid rgba(17,24,39,.08);
      transition: transform .15s ease, border-color .15s ease;
    }
    .meta-card:hover{
      transform: translateY(-2px);
      border-color: rgba(43,108,255,.24);
    }
    .meta-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
    .meta-title{font-weight:800;font-size:13px}
    .badge{
      font-size:12px;color:#0f172a;
      background: rgba(43,108,255,.10);
      border:1px solid rgba(43,108,255,.18);
      padding:6px 9px;border-radius:999px;
      white-space:nowrap;
    }
    .meta-sub{margin-top:8px;color:var(--muted);font-size:13px;line-height:1.5}

    .hero-right{
      display:flex;
      flex-direction:column;
      gap:12px;
    }

    .data-panel{
      border-radius: var(--radius);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: var(--shadow2);
      padding:16px;
      overflow:hidden;
      position:relative;
    }
    .data-panel:before{
      content:"";
      position:absolute;
      inset:-2px -2px auto -2px;
      height:92px;
      background:
        radial-gradient(400px 90px at 20% 30%, rgba(43,108,255,.22), transparent 60%),
        radial-gradient(420px 90px at 80% 45%, rgba(124,58,237,.18), transparent 62%);
      pointer-events:none;
    }
    .data-title{
      display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;position:relative;
    }
    .data-title h2{
      margin:0;font-size:15px;letter-spacing:-.2px;
    }
    .status{
      display:inline-flex;align-items:center;gap:8px;
      font-size:12.5px;color:var(--muted);
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.70);
      padding:7px 10px;border-radius:999px;
    }
    .pulse{
      width:10px;height:10px;border-radius:50%;
      background: var(--good);
      box-shadow: 0 0 0 rgba(22,163,74,.55);
      animation: pulse 1.6s ease-in-out infinite;
    }
    @keyframes pulse{
      0%{box-shadow:0 0 0 0 rgba(22,163,74,.45)}
      60%{box-shadow:0 0 0 10px rgba(22,163,74,.0)}
      100%{box-shadow:0 0 0 0 rgba(22,163,74,.0)}
    }

    .stats-grid{
      display:grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap:12px;
      position:relative;
    }
    .stat{
      border-radius:16px;
      padding:12px;
      background: rgba(255,255,255,.76);
      border:1px solid rgba(17,24,39,.08);
      transition: transform .14s ease, border-color .14s ease;
    }
    .stat:hover{
      transform: translateY(-2px);
      border-color: rgba(124,58,237,.25);
    }
    .stat .num{
      font-weight:900;
      font-size:18px;
      letter-spacing:-.2px;
    }
    .stat .lab{
      margin-top:6px;color:var(--muted);font-size:12.8px;line-height:1.4;
    }

    .quick-callout{
      border-radius: var(--radius);
      background: linear-gradient(135deg, rgba(43,108,255,.10), rgba(124,58,237,.08));
      border:1px solid rgba(43,108,255,.18);
      padding:14px;
      display:flex;flex-direction:column;gap:10px;
    }
    .callout-row{display:flex;gap:10px;align-items:flex-start}
    .icon-badge{
      width:40px;height:40px;border-radius:14px;
      background: rgba(255,255,255,.72);
      border:1px solid rgba(17,24,39,.08);
      display:flex;align-items:center;justify-content:center;
      flex:0 0 auto;
    }
    .icon-badge svg{width:20px;height:20px;opacity:.9}
    .callout-title{font-weight:900;margin:0;font-size:14px}
    .callout-desc{margin:4px 0 0;color:var(--muted);font-size:13px;line-height:1.6}
    .callout-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:2px}
    .link-btn{
      display:inline-flex;align-items:center;gap:10px;
      padding:10px 12px;border-radius:14px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.74);
      font-weight:800;font-size:13px;
      transition: transform .12s ease, border-color .15s ease, background .15s ease;
    }
    .link-btn:hover{
      transform: translateY(-1px);
      border-color: rgba(17,24,39,.18);
      background: rgba(255,255,255,.95);
    }
    .link-btn .mini{
      width:18px;height:18px;border-radius:7px;
      background: rgba(43,108,255,.10);
      border:1px solid rgba(43,108,255,.18);
      display:flex;align-items:center;justify-content:center;
      color:#2453d6;
    }

    .section{
      padding:26px 0;
    }
    .section-head{
      display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;
      margin-bottom:14px;
    }
    .section-title{
      margin:0;
      font-size:20px;
      letter-spacing:-.4px;
    }
    .section-sub{
      margin:6px 0 0;
      color:var(--muted);
      font-size:13.8px;
      line-height:1.7;
      max-width:70ch;
    }
    .anchor-row{
      display:flex;gap:10px;flex-wrap:wrap;align-items:center;
    }
    .chip{
      padding:8px 10px;border-radius:999px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.66);
      color: var(--muted);
      font-weight:700;
      font-size:12.5px;
      transition: transform .12s ease, border-color .15s ease, background .15s ease;
      cursor:pointer;
      user-select:none;
    }
    .chip:hover{
      transform: translateY(-1px);
      border-color: rgba(43,108,255,.20);
      background: rgba(255,255,255,.92);
    }

    .grid-3{
      display:grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap:12px;
    }
    .grid-4{
      display:grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap:12px;
    }
    .card{
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      border-radius: var(--radius2);
      box-shadow: 0 8px 20px rgba(17,24,39,.05);
      padding:14px;
      transition: transform .15s ease, box-shadow .2s ease, border-color .15s ease;
      position:relative;
      overflow:hidden;
    }
    .card:hover{
      transform: translateY(-2px);
      border-color: rgba(43,108,255,.22);
      box-shadow: 0 14px 34px rgba(17,24,39,.08);
    }
    .card h3{margin:10px 0 6px;font-size:14.5px;letter-spacing:-.2px}
    .card p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}

    .card .top{
      display:flex;align-items:center;gap:10px;justify-content:space-between
    }
    .tag{
      font-size:12px;
      font-weight:900;
      letter-spacing:.2px;
      padding:7px 10px;border-radius:999px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.74);
      color: var(--text);
      white-space:nowrap;
    }
    .tag.grad1{background: linear-gradient(135deg, rgba(43,108,255,.12), rgba(124,58,237,.12)); border-color: rgba(43,108,255,.22)}
    .tag.grad2{background: linear-gradient(135deg, rgba(0,188,212,.12), rgba(43,108,255,.10)); border-color: rgba(0,188,212,.22)}
    .tag.grad3{background: linear-gradient(135deg, rgba(124,58,237,.12), rgba(239,68,68,.10)); border-color: rgba(124,58,237,.22)}
    .tag.grad4{background: linear-gradient(135deg, rgba(245,158,11,.14), rgba(43,108,255,.10)); border-color: rgba(245,158,11,.22)}

    .step-wrap{
      display:grid;
      grid-template-columns: 1.2fr .8fr;
      gap:12px;
      align-items:start;
    }
    .steps{
      display:flex;flex-direction:column;gap:10px;
    }
    .step{
      display:flex;gap:12px;align-items:flex-start;
      padding:14px;
      border-radius: var(--radius2);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      transition: transform .15s ease, border-color .15s ease;
    }
    .step:hover{transform: translateY(-2px);border-color: rgba(124,58,237,.22)}
    .step-num{
      width:34px;height:34px;border-radius:14px;
      background: rgba(124,58,237,.10);
      border:1px solid rgba(124,58,237,.20);
      display:flex;align-items:center;justify-content:center;
      font-weight:1000;color:#5b21b6;
      flex:0 0 auto;
    }
    .step:nth-child(2) .step-num{background: rgba(43,108,255,.10); border-color: rgba(43,108,255,.22); color:#2453d6;}
    .step:nth-child(3) .step-num{background: rgba(0,188,212,.10); border-color: rgba(0,188,212,.22); color:#0e7490;}
    .step:nth-child(4) .step-num{background: rgba(245,158,11,.14); border-color: rgba(245,158,11,.22); color:#b45309;}
    .step h3{margin:0;font-size:14.5px}
    .step p{margin:6px 0 0;color:var(--muted);font-size:13px;line-height:1.7}

    .side-cta{
      border-radius: var(--radius);
      background:
        radial-gradient(500px 220px at 10% 10%, rgba(43,108,255,.18), transparent 55%),
        radial-gradient(480px 220px at 95% 15%, rgba(124,58,237,.16), transparent 58%),
        linear-gradient(180deg, rgba(255,255,255,.86), rgba(255,255,255,.66));
      border:1px solid rgba(17,24,39,.08);
      padding:14px;
      box-shadow: var(--shadow2);
    }
    .side-cta h3{
      margin:4px 0 6px;font-size:15px;letter-spacing:-.2px
    }
    .side-cta p{margin:0;color:var(--muted);font-size:13.2px;line-height:1.75}
    .side-cta .bullets{
      margin-top:12px;
      display:flex;flex-direction:column;gap:8px;
    }
    .bline{
      display:flex;gap:10px;align-items:flex-start;
      padding:10px;
      border-radius: 14px;
      background: rgba(255,255,255,.68);
      border:1px solid rgba(17,24,39,.08);
    }
    .check{
      width:20px;height:20px;border-radius:8px;
      background: rgba(22,163,74,.10);
      border:1px solid rgba(22,163,74,.20);
      display:flex;align-items:center;justify-content:center;
      color: #16a34a;
      flex:0 0 auto;
      margin-top:1px;
    }
    .bline .t{font-weight:900;font-size:13px}
    .bline .d{color:var(--muted);font-size:12.8px;line-height:1.6;margin-top:3px}

    .compare-grid{
      display:grid;
      grid-template-columns: 1.1fr .9fr;
      gap:12px;
      align-items:start;
    }
    .table-wrap{
      border-radius: var(--radius);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: var(--shadow2);
      overflow:hidden;
    }
    table{
      width:100%;
      border-collapse:collapse;
      min-width: 620px;
    }
    th,td{
      padding:12px 12px;
      border-bottom:1px solid rgba(17,24,39,.08);
      vertical-align:top;
      font-size:13px;
      line-height:1.6;
    }
    th{
      background: linear-gradient(135deg, rgba(43,108,255,.10), rgba(124,58,237,.08));
      color:#111827;
      font-size:13px;
      font-weight:1000;
      border-bottom:1px solid rgba(17,24,39,.10);
    }
    td:first-child{color:var(--muted)}
    .star{
      display:inline-flex;gap:2px;align-items:center;white-space:nowrap;
    }
    .star svg{width:16px;height:16px}
    .score{
      font-weight:1000;
      letter-spacing:-.2px;
      font-size:18px;
    }

    .rating-panel{
      border-radius: var(--radius);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: var(--shadow2);
      padding:16px;
      position:relative;
      overflow:hidden;
    }
    .rating-panel:before{
      content:"";
      position:absolute;inset:-40px -40px auto auto;
      width:200px;height:200px;border-radius:50%;
      background: radial-gradient(circle at 30% 30%, rgba(245,158,11,.30), transparent 55%);
      filter: blur(2px);
      pointer-events:none;
    }
    .rating-top{
      display:flex;align-items:flex-start;justify-content:space-between;gap:10px;position:relative;
    }
    .rating-top h3{margin:0;font-size:15px}
    .rating-top .rank{
      padding:8px 10px;border-radius:999px;
      background: rgba(245,158,11,.14);
      border:1px solid rgba(245,158,11,.22);
      color:#8a4b00;
      font-weight:1000;
      font-size:12.5px;
      white-space:nowrap;
    }
    .rating-big{
      margin-top:12px;display:flex;align-items:flex-end;gap:14px;position:relative;
    }
    .rating-big .left .small{
      color:var(--muted);font-size:13px;font-weight:800;
    }
    .rating-big .left .big{
      font-weight:1100;font-size:34px;letter-spacing:-.8px;line-height:1;
      margin-top:6px;
    }
    .rating-big .left .desc{
      margin-top:6px;color:var(--muted);font-size:13px;line-height:1.6;max-width:22ch;
    }
    .rating-big .right{
      flex:1;
      display:flex;flex-direction:column;gap:10px;align-items:flex-end;
      min-width: 160px;
    }
    .meter{
      width:100%;
      border-radius:14px;
      padding:10px;
      background: rgba(255,255,255,.70);
      border:1px solid rgba(17,24,39,.08);
    }
    .meter .line{
      height:10px;border-radius:999px;
      background: rgba(17,24,39,.06);
      overflow:hidden;
    }
    .meter .fill{
      height:100%;
      width:92%;
      background: linear-gradient(90deg, var(--brand), var(--brand2));
      border-radius:999px;
    }
    .meter .lbl{
      margin-top:8px;color:var(--muted);font-size:12.8px;font-weight:800;
    }

    .list-badges{
      margin-top:14px;
      display:flex;flex-wrap:wrap;gap:8px;position:relative;
    }
    .mini-badge{
      padding:8px 10px;border-radius:999px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.72);
      font-size:12.6px;
      color:var(--muted);
      font-weight:800;
      white-space:nowrap;
    }

    .tabs-grid{
      display:grid;
      grid-template-columns: .95fr 1.05fr;
      gap:12px;
      align-items:start;
    }
    .tablist{
      display:flex;flex-direction:column;gap:10px;
    }
    .tab{
      text-align:left;
      padding:14px;
      border-radius: var(--radius2);
      border:1px solid rgba(17,24,39,.08);
      background: rgba(255,255,255,.78);
      cursor:pointer;
      transition: transform .14s ease, border-color .15s ease, box-shadow .2s ease;
    }
    .tab:hover{
      transform: translateY(-2px);
      border-color: rgba(43,108,255,.22);
      box-shadow: 0 14px 30px rgba(17,24,39,.07);
    }
    .tab.active{
      border-color: rgba(43,108,255,.32);
      box-shadow: 0 18px 40px rgba(43,108,255,.14);
      background:
        radial-gradient(420px 160px at 5% 0%, rgba(43,108,255,.18), transparent 55%),
        radial-gradient(420px 160px at 95% 10%, rgba(124,58,237,.16), transparent 58%),
        rgba(255,255,255,.86);
    }
    .tab .t1{
      display:flex;align-items:center;justify-content:space-between;gap:10px;
    }
    .tab .name{font-weight:1000;letter-spacing:-.2px}
    .tab .count{
      font-size:12.5px;font-weight:1000;color:var(--muted);
      padding:7px 9px;border-radius:999px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.72);
      white-space:nowrap;
    }
    .tab .note{margin-top:6px;color:var(--muted);font-size:13px;line-height:1.65}

    .tab-panel{
      border-radius: var(--radius);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: var(--shadow2);
      padding:16px;
      overflow:hidden;
      position:relative;
    }
    .tab-panel:before{
      content:"";
      position:absolute;
      inset:-2px -2px auto -2px;
      height:100px;
      background:
        radial-gradient(420px 90px at 20% 60%, rgba(0,188,212,.18), transparent 60%),
        radial-gradient(420px 90px at 80% 30%, rgba(124,58,237,.16), transparent 62%);
      pointer-events:none;
    }
    .tab-panel .panel-title{
      position:relative;
      display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap;
      margin-bottom:10px;
    }
    .tab-panel h3{margin:0;font-size:15px}
    .panel-badges{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
    .panel-badge{
      padding:8px 10px;border-radius:999px;
      background: rgba(255,255,255,.72);
      border:1px solid rgba(17,24,39,.10);
      font-size:12.6px;color:var(--muted);font-weight:900;
      white-space:nowrap;
    }
    .panel-grid{
      position:relative;
      display:grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap:10px;
      margin-top:10px;
    }
    .kv{
      border-radius:16px;
      padding:12px;
      background: rgba(255,255,255,.70);
      border:1px solid rgba(17,24,39,.08);
    }
    .kv .k{color:var(--muted);font-size:12.8px;font-weight:900}
    .kv .v{margin-top:6px;font-weight:1100;letter-spacing:-.2px;font-size:13.5px;line-height:1.5}

    .cards-rows{
      display:grid;grid-template-columns: repeat(3, minmax(0, 1fr));gap:12px;
    }
    .review{
      padding:16px;
      border-radius: var(--radius);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: 0 10px 26px rgba(17,24,39,.06);
      transition: transform .15s ease, border-color .15s ease;
      position:relative;overflow:hidden;
    }
    .review:before{
      content:"";
      position:absolute;inset:-40px auto auto -40px;
      width:160px;height:160px;border-radius:50%;
      background: radial-gradient(circle at 30% 30%, rgba(43,108,255,.20), transparent 58%);
      filter: blur(3px);
      pointer-events:none;
    }
    .review:hover{transform: translateY(-2px);border-color: rgba(124,58,237,.22)}
    .review .head{
      display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative;
    }
    .who{
      display:flex;flex-direction:column;gap:4px;min-width: 0;
    }
    .who .role{font-size:13px;color:var(--muted);font-weight:900}
    .who .name{font-size:14.5px;font-weight:1100;letter-spacing:-.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .stars{
      display:flex;gap:2px;align-items:center;
    }
    .review p{
      margin:12px 0 0;
      color: var(--muted);
      font-size:13.2px;
      line-height:1.8;
      position:relative;
    }

    .cases-grid{
      display:grid;grid-template-columns: repeat(3, minmax(0, 1fr));gap:12px;
    }
    .case-card{
      border-radius: var(--radius);
      background: rgba(255,255,255,.80);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: 0 10px 26px rgba(17,24,39,.06);
      overflow:hidden;
      transition: transform .15s ease, border-color .15s ease;
      display:flex;
      flex-direction:column;
    }
    .case-card:hover{transform: translateY(-2px);border-color: rgba(43,108,255,.24)}
    .case-media{
      padding:14px;
      border-bottom:1px solid rgba(17,24,39,.08);
      background:
        radial-gradient(360px 140px at 15% 20%, rgba(43,108,255,.18), transparent 60%),
        radial-gradient(360px 140px at 85% 30%, rgba(124,58,237,.14), transparent 62%),
        linear-gradient(180deg, rgba(255,255,255,.65), rgba(255,255,255,.25));
      min-height: 92px;
    }
    .case-media .line1{
      display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;
    }
    .case-title{
      font-weight:1100;letter-spacing:-.2px;font-size:14.5px;
    }
    .case-type{
      font-size:12.5px;font-weight:1000;color:var(--muted);
      padding:7px 10px;border-radius:999px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.70);
      white-space:nowrap;
    }
    .case-media .bars{
      display:flex;gap:8px;align-items:flex-end;
      height:28px;
    }
    .bar{
      width:12px;border-radius:10px;
      background: linear-gradient(180deg, rgba(43,108,255,.85), rgba(124,58,237,.55));
      opacity:.9;
    }
    .bar.b2{background: linear-gradient(180deg, rgba(0,188,212,.85), rgba(43,108,255,.55))}
    .bar.b3{background: linear-gradient(180deg, rgba(245,158,11,.85), rgba(124,58,237,.45))}
    .case-body{
      padding:14px;
      display:flex;flex-direction:column;gap:10px;flex:1;
    }
    .case-body .desc{
      color:var(--muted);font-size:13.2px;line-height:1.75;margin:0;
      flex:1;
    }
    .case-foot{
      display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:space-between;
    }
    .case-foot .meta{
      color:var(--muted2);font-size:12.5px;font-weight:900
    }
    .case-foot a{
      font-weight:1000;
      font-size:13px;
      color:#2453d6;
      padding:9px 10px;border-radius:12px;
      border:1px solid rgba(43,108,255,.22);
      background: rgba(43,108,255,.06);
      transition: transform .12s ease, background .15s ease, border-color .15s ease;
      white-space:nowrap;
    }
    .case-foot a:hover{
      transform: translateY(-1px);
      background: rgba(43,108,255,.10);
      border-color: rgba(43,108,255,.30);
    }

    .article-grid{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:12px;
    }
    .article-list{
      border-radius: var(--radius);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: var(--shadow2);
      padding:14px;
    }
    .article-item{
      display:flex;flex-direction:column;gap:6px;
      padding:12px;
      border-radius: 16px;
      border:1px solid rgba(17,24,39,.07);
      background: rgba(255,255,255,.70);
      transition: transform .14s ease, border-color .15s ease;
    }
    .article-item:hover{transform: translateY(-2px);border-color: rgba(124,58,237,.22)}
    .article-item + .article-item{margin-top:10px}
    .article-item .t{
      font-weight:1100;letter-spacing:-.2px;
      font-size:14.5px;
      line-height:1.35;
    }
    .article-item .m{
      color:var(--muted);font-size:13px;line-height:1.6;
    }
    .article-item .linkrow{
      display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;
      margin-top:2px;
    }
    .article-item a{
      color:#2453d6;
      font-weight:1000;
      font-size:13px;
      padding:9px 10px;border-radius:12px;
      border:1px solid rgba(43,108,255,.22);
      background: rgba(43,108,255,.06);
      transition: transform .12s ease, background .15s ease, border-color .15s ease;
      white-space:nowrap;
    }
    .article-item a:hover{transform: translateY(-1px); background: rgba(43,108,255,.10); border-color: rgba(43,108,255,.30);}
    .article-item .meta{
      color:var(--muted2);font-size:12.5px;font-weight:900
    }

    .gallery-grid{
      display:grid;
      grid-template-columns: 1fr;
      gap:12px;
    }
    .tiles{
      display:grid;
      grid-template-columns: 1.2fr .8fr;
      gap:12px;
      align-items:stretch;
    }
    .tile{
      border-radius: var(--radius);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: var(--shadow2);
      overflow:hidden;
    }
    .tile .pad{padding:14px}
    .tile h3{margin:0 0 6px;font-size:15px;letter-spacing:-.2px}
    .tile p{margin:0;color:var(--muted);font-size:13.2px;line-height:1.75}
    .image-grid{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:10px;
      padding:12px;
      align-items:start;
      background:
        radial-gradient(520px 180px at 20% 0%, rgba(43,108,255,.16), transparent 58%),
        radial-gradient(520px 180px at 90% 10%, rgba(124,58,237,.14), transparent 60%),
        rgba(255,255,255,.70);
      border-top:1px solid rgba(17,24,39,.08);
    }
    .imgbox{
      border-radius: 16px;
      border:1px solid rgba(17,24,39,.08);
      background: rgba(255,255,255,.72);
      overflow:hidden;
      min-height: 110px;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:10px;
    }
    .imgbox img{
      width:100%;
      height:auto;
      max-width: 180px;
      object-fit:contain;
    }

    .accordion{
      border-radius: var(--radius);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: var(--shadow2);
      overflow:hidden;
    }
    .acc-item{
      border-bottom:1px solid rgba(17,24,39,.08);
    }
    .acc-item:last-child{border-bottom:none}
    .acc-btn{
      width:100%;
      display:flex;align-items:center;justify-content:space-between;gap:12px;
      padding:14px 14px;
      background: transparent;
      border:none;
      cursor:pointer;
      text-align:left;
    }
    .acc-q{
      font-weight:1000;
      font-size:14.2px;
      letter-spacing:-.2px;
      color:var(--text);
    }
    .acc-icon{
      width:34px;height:34px;border-radius:14px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.70);
      display:flex;align-items:center;justify-content:center;
      transition: transform .15s ease;
      flex:0 0 auto;
    }
    .acc-icon svg{width:18px;height:18px}
    .acc-content{
      max-height:0;
      overflow:hidden;
      transition: max-height .25s ease;
    }
    .acc-content .inner{
      padding:0 14px 14px;
      color:var(--muted);
      line-height:1.85;
      font-size:13.2px;
    }
    .acc-item.open .acc-content{max-height: 220px}
    .acc-item.open .acc-icon{transform: rotate(45deg);}

    .contact-grid{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:12px;
      align-items:start;
    }
    .form-card{
      border-radius: var(--radius);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: var(--shadow2);
      padding:16px;
      overflow:hidden;
      position:relative;
    }
    .form-card:before{
      content:"";
      position:absolute;inset:-2px -2px auto -2px;height:86px;
      background:
        radial-gradient(420px 90px at 25% 50%, rgba(43,108,255,.16), transparent 62%),
        radial-gradient(420px 90px at 78% 35%, rgba(124,58,237,.14), transparent 64%);
      pointer-events:none;
    }
    .form-card h3{position:relative;margin:0 0 6px;font-size:15.5px;letter-spacing:-.2px}
    .form-card p{position:relative;margin:0 0 12px;color:var(--muted);font-size:13.2px;line-height:1.7}
    form{position:relative}
    .field-row{
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:10px;
    }
    label{
      display:flex;flex-direction:column;gap:7px;
      font-size:12.8px;
      color:var(--muted);
      font-weight:900;
    }
    input,select,textarea{
      width:100%;
      border-radius:14px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.86);
      padding:11px 12px;
      outline:none;
      color:var(--text);
      font-size:14px;
      transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
    }
    textarea{min-height:100px;resize:vertical}
    input:focus,select:focus,textarea:focus{
      border-color: rgba(43,108,255,.35);
      box-shadow: 0 0 0 4px rgba(43,108,255,.12);
      background:#fff;
    }
    .form-actions{
      display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:space-between;
      margin-top:12px;
    }
    .fineprint{
      color:var(--muted2);
      font-size:12.3px;
      font-weight:800;
      line-height:1.6;
      max-width:44ch;
    }
    .submit{
      border:none;
      background: linear-gradient(135deg, var(--brand), var(--brand2));
      color:#fff;
      padding:12px 14px;
      border-radius:14px;
      font-weight:1100;
      cursor:pointer;
      box-shadow: 0 16px 34px rgba(43,108,255,.22);
      transition: transform .12s ease, box-shadow .18s ease, filter .18s ease;
      display:inline-flex;align-items:center;gap:10px;
      user-select:none;
    }
    .submit:hover{
      transform: translateY(-1px);
      filter: brightness(.98);
      box-shadow: 0 18px 40px rgba(43,108,255,.25);
    }
    .toast{
      position:fixed;
      left:50%;top:18px;
      transform: translateX(-50%);
      z-index:200;
      background: rgba(17,24,39,.92);
      color:#fff;
      padding:10px 12px;
      border-radius:14px;
      box-shadow: 0 18px 40px rgba(0,0,0,.22);
      opacity:0;
      pointer-events:none;
      transition: opacity .2s ease, top .2s ease;
      font-weight:900;
      font-size:13px;
      max-width: calc(100% - 24px);
      text-align:center;
    }
    .toast.show{
      opacity:1;
      top:22px;
    }

    .contact-side{
      border-radius: var(--radius);
      background: rgba(255,255,255,.78);
      border:1px solid rgba(17,24,39,.08);
      box-shadow: var(--shadow2);
      padding:16px;
    }
    .contact-side h3{margin:0 0 8px;font-size:15.5px;letter-spacing:-.2px}
    .contact-side .kvlist{
      display:flex;flex-direction:column;gap:10px;
      margin-top:10px;
    }
    .kvrow{
      display:flex;gap:12px;align-items:flex-start;
      padding:12px;
      border-radius:16px;
      border:1px solid rgba(17,24,39,.08);
      background: rgba(255,255,255,.70);
    }
    .kvrow .k{
      width:36px;height:36px;border-radius:14px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.78);
      display:flex;align-items:center;justify-content:center;
      flex:0 0 auto;
    }
    .kvrow svg{width:18px;height:18px;opacity:.85}
    .kvrow .v .t{font-weight:1000;font-size:13.6px}
    .kvrow .v .d{color:var(--muted);font-size:13.1px;margin-top:4px;line-height:1.6}
    .qrwrap{
      display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:12px;
      padding:12px;
      border-radius: 16px;
      border:1px solid rgba(17,24,39,.08);
      background: rgba(255,255,255,.70);
    }
    .qrwrap img{
      width:92px;height:92px;border-radius:14px;
      object-fit:cover;
      background:#fff;
      border:1px solid rgba(17,24,39,.10);
    }
    .qrwrap .qrd{
      flex:1;min-width: 220px;
    }
    .qrwrap .qrd .t{font-weight:1100;font-size:14.5px}
    .qrwrap .qrd .d{color:var(--muted);margin-top:6px;font-size:13.2px;line-height:1.75}
    .socialrow{
      display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;
    }
    .soc{
      padding:10px 12px;border-radius:14px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.72);
      font-weight:1000;
      font-size:13px;
      color: var(--text);
      transition: transform .12s ease, border-color .15s ease, background .15s ease;
    }
    .soc:hover{transform: translateY(-1px);border-color: rgba(124,58,237,.22);background:#fff}

    .footer{
      margin-top:18px;
      background: linear-gradient(180deg, rgba(17,24,39,.03), rgba(17,24,39,.06));
      border-top:1px solid rgba(17,24,39,.08);
    }
    .footer-inner{
      padding:18px 0 20px;
    }
    .foot-grid{
      display:grid;
      grid-template-columns: 1.05fr .95fr;
      gap:12px;
      align-items:start;
    }
    .foot-card{
      border-radius: var(--radius);
      background: rgba(255,255,255,.60);
      border:1px solid rgba(17,24,39,.08);
      padding:14px;
    }
    .foot-card h3{margin:0 0 10px;font-size:14.8px;letter-spacing:-.2px}
    .foot-links{
      display:flex;flex-wrap:wrap;gap:10px;
    }
    .foot-links a{
      padding:9px 10px;border-radius:14px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.70);
      color: var(--text);
      font-weight:1000;font-size:13px;
      transition: transform .12s ease, border-color .15s ease, background .15s ease;
      white-space:nowrap;
    }
    .foot-links a:hover{transform: translateY(-1px); border-color: rgba(43,108,255,.22); background:#fff}
    .foot-right p{
      margin:0;color:var(--muted);font-size:13.2px;line-height:1.75
    }
    .copyright{
      margin-top:12px;
      color:var(--muted2);
      font-size:12.5px;
      font-weight:900;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      flex-wrap:wrap;
    }

    .float-cs{
      position:fixed;
      right:14px;
      bottom:14px;
      z-index:120;
      display:flex;
      flex-direction:column;
      gap:10px;
      align-items:flex-end;
      pointer-events:none;
    }
    .float-btn{
      pointer-events:auto;
      display:inline-flex;align-items:center;gap:10px;
      padding:12px 13px;border-radius:16px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.82);
      box-shadow: 0 16px 40px rgba(17,24,39,.12);
      cursor:pointer;
      transition: transform .15s ease, border-color .15s ease, background .15s ease;
      user-select:none;
    }
    .float-btn:hover{
      transform: translateY(-2px);
      border-color: rgba(43,108,255,.24);
      background:#fff;
    }
    .float-btn .bicon{
      width:36px;height:36px;border-radius:14px;
      background: linear-gradient(135deg, rgba(43,108,255,.14), rgba(124,58,237,.10));
      border:1px solid rgba(43,108,255,.22);
      display:flex;align-items:center;justify-content:center;
      flex:0 0 auto;
    }
    .float-btn svg{width:18px;height:18px}
    .float-btn .t{
      font-weight:1100;font-size:13.5px;
    }
    .float-pop{
      pointer-events:auto;
      width: 280px;
      border-radius: 18px;
      background: rgba(255,255,255,.92);
      border:1px solid rgba(17,24,39,.10);
      box-shadow: 0 20px 60px rgba(17,24,39,.18);
      overflow:hidden;
      transform-origin: 90% 100%;
      transform: scale(.98);
      opacity:0;
      max-height:0;
      transition: opacity .18s ease, max-height .22s ease, transform .18s ease;
    }
    .float-pop.show{
      opacity:1;
      max-height: 380px;
      transform: scale(1);
    }
    .float-pop .top{
      padding:12px 12px 10px;
      background:
        radial-gradient(420px 160px at 20% 0%, rgba(43,108,255,.18), transparent 60%),
        radial-gradient(420px 160px at 95% 10%, rgba(124,58,237,.16), transparent 62%),
        rgba(255,255,255,.70);
      border-bottom:1px solid rgba(17,24,39,.08);
    }
    .float-pop .top .tt{
      display:flex;align-items:center;justify-content:space-between;gap:10px;
    }
    .float-pop .top h4{
      margin:0;font-size:14px;letter-spacing:-.2px;
    }
    .closex{
      width:34px;height:34px;border-radius:14px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.75);
      cursor:pointer;
      display:flex;align-items:center;justify-content:center;
      transition: transform .12s ease, background .15s ease, border-color .15s ease;
    }
    .closex:hover{transform: translateY(-1px);background:#fff;border-color: rgba(17,24,39,.18)}
    .float-pop .content{
      padding:12px;
      display:flex;flex-direction:column;gap:10px;
    }
    .float-pop .row{
      display:flex;gap:12px;align-items:center;
      padding:10px;
      border-radius:16px;
      border:1px solid rgba(17,24,39,.08);
      background: rgba(255,255,255,.70);
    }
    .float-pop .row img{
      width:78px;height:78px;border-radius:14px;object-fit:cover;border:1px solid rgba(17,24,39,.10);background:#fff;
    }
    .float-pop .row .txt .a{font-weight:1100;font-size:13.8px}
    .float-pop .row .txt .b{margin-top:4px;color:var(--muted);font-size:12.8px;line-height:1.6}
    .float-pop .links{
      display:flex;flex-wrap:wrap;gap:10px;
    }
    .float-pop .links a{
      flex:1;
      min-width: 110px;
      padding:10px 12px;border-radius:14px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.75);
      font-weight:1000;
      color: var(--text);
      font-size:13px;
      text-align:center;
      transition: transform .12s ease, border-color .15s ease, background .15s ease;
    }
    .float-pop .links a:hover{transform: translateY(-1px);border-color: rgba(43,108,255,.22); background:#fff}

    .toTop{
      display:none;
      position:fixed;
      right:14px;
      bottom:128px;
      z-index:120;
      pointer-events:auto;
      border-radius:16px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.85);
      box-shadow: 0 16px 40px rgba(17,24,39,.12);
      cursor:pointer;
      padding:11px 12px;
      transition: transform .12s ease, background .15s ease, border-color .15s ease;
    }
    .toTop:hover{transform: translateY(-2px);background:#fff;border-color: rgba(43,108,255,.22)}
    .toTop svg{width:18px;height:18px}

    .reveal{
      opacity:0;
      transform: translateY(10px);
      transition: opacity .5s ease, transform .5s ease;
    }
    .reveal.show{
      opacity:1;
      transform: translateY(0);
    }

    @media (max-width: 980px){
      .hero-grid{grid-template-columns: 1fr; }
      .hero-right{flex-direction:row;flex-wrap:wrap}
      .data-panel{flex: 1; min-width: 280px;}
      .quick-callout{flex: 1; min-width: 280px;}
      .grid-3{grid-template-columns: 1fr}
      .grid-4{grid-template-columns: 1fr 1fr}
      .step-wrap{grid-template-columns: 1fr}
      .compare-grid{grid-template-columns: 1fr}
      .tabs-grid{grid-template-columns: 1fr}
      .cards-rows{grid-template-columns: 1fr}
      .cases-grid{grid-template-columns: 1fr}
      .article-grid{grid-template-columns: 1fr}
      .tiles{grid-template-columns: 1fr}
      .contact-grid{grid-template-columns: 1fr}
      .foot-grid{grid-template-columns: 1fr}
      table{min-width: 560px;}
      .field-row{grid-template-columns: 1fr}
      .nav{display:none}
      .menu-btn{
        display:inline-flex;
      }
      header{position:sticky}
    }

    .mobile-nav{
      display:none;
      border-top:1px solid rgba(17,24,39,.06);
      padding:12px 0 14px;
    }
    .mobile-nav.show{display:block}
    .mobile-actions{
      display:flex;gap:10px;flex-wrap:wrap;
      align-items:center;justify-content:space-between;
    }
    .mobile-actions .left{
      display:flex;gap:10px;flex-wrap:wrap;
    }
    .mobile-actions a, .mobile-actions button{
      padding:10px 12px;border-radius:14px;
      border:1px solid rgba(17,24,39,.10);
      background: rgba(255,255,255,.75);
      font-weight:1000;font-size:13px;
      cursor:pointer;
      transition: transform .12s ease, border-color .15s ease, background .15s ease;
      color: var(--text);
      white-space:nowrap;
    }
    .mobile-actions a:hover, .mobile-actions button:hover{transform: translateY(-1px);background:#fff;border-color: rgba(43,108,255,.22)}
    .mobile-actions .primary{
      color:#fff;background: linear-gradient(135deg, var(--brand), var(--brand2));
      border-color: rgba(255,255,255,.22);
      box-shadow: 0 16px 34px rgba(43,108,255,.20);
    }
    .mobile-actions .primary:hover{background: linear-gradient(135deg, #2453d6, #6d28d9)}