:root{
    --ink:#0e1330;
    --ink-2:#3a4468;
    --ink-3:#5d6788;
    --brand:#5b3cf5;
    --brand-deep:#3a1fb8;
    --cyan:#00c8ff;
    --pink:#ff45b5;
    --line:rgba(91,60,245,.14);
    --line-strong:rgba(91,60,245,.32);
    --bg:#f6f7ff;
    --card:#ffffff;
    --radius:18px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
    color:var(--ink);
    line-height:1.7;
    font-size:16px;
    background-color:var(--bg);
    background-image:
      radial-gradient(900px 620px at 6% -6%, rgba(0,200,255,.16), transparent 62%),
      radial-gradient(880px 620px at 96% 4%, rgba(255,69,181,.13), transparent 62%),
      radial-gradient(900px 700px at 50% 46%, rgba(91,60,245,.09), transparent 68%),
      radial-gradient(800px 600px at 12% 92%, rgba(0,200,255,.10), transparent 66%);
    background-repeat:no-repeat;
    -webkit-font-smoothing:antialiased;
  }
  img{max-width:100%;}
  a{color:var(--brand-deep);}
  h1,h2,h3{color:var(--ink);margin:0;}
  p{margin:0;}
  ul{margin:0;padding:0;list-style:none;}
  .container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px;}

  /* ---------- Header ---------- */
  .site-header{
    position:sticky;
    top:0;
    z-index:100;
    background:rgba(255,255,255,.88);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);
  }
  .header-inner{
    display:flex;
    align-items:center;
    gap:14px;
    min-height:68px;
    position:relative;
  }
  .brand{
    display:flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
    flex:0 0 auto;
  }
  .ai-page-logo{max-height:34px;width:auto;display:block;}
  .brand-text{
    font-size:17px;
    font-weight:800;
    letter-spacing:1px;
    color:var(--ink);
    white-space:nowrap;
  }
  .nav{margin-left:auto;}
  .nav-links{
    display:flex;
    align-items:center;
    gap:0;
  }
  .nav-links li{list-style:none;}
  .nav-links a{
    display:block;
    padding:8px 11px;
    font-size:14px;
    color:#2a3155;
    text-decoration:none;
    border-radius:10px;
    white-space:nowrap;
    transition:color .2s ease, background .2s ease;
  }
  .nav-links a:hover{color:var(--brand-deep);background:rgba(91,60,245,.08);}
  .header-cta{flex:0 0 auto;}
  .nav-toggle{
    display:none;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    width:42px;
    height:42px;
    padding:0;
    border:1px solid var(--line-strong);
    border-radius:12px;
    background:#fff;
    cursor:pointer;
    flex:0 0 auto;
  }
  .nav-toggle span{
    display:block;
    width:18px;
    height:2px;
    margin:0 auto;
    background:#2a3155;
    border-radius:2px;
    transition:transform .25s ease, opacity .25s ease;
  }
  .nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav-toggle.open span:nth-child(2){opacity:0;}
  .nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

  /* ---------- Buttons ---------- */
  .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:12px 26px;
    border-radius:999px;
    font-size:15px;
    font-weight:600;
    text-decoration:none;
    border:1px solid transparent;
    cursor:pointer;
    font-family:inherit;
    transition:transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease, color .25s ease;
  }
  .btn-primary{
    background:linear-gradient(120deg,#5b3cf5,#8a3cff 48%,#00c8ff);
    color:#fff;
    box-shadow:0 10px 24px rgba(91,60,245,.32);
  }
  .btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(91,60,245,.42);}
  .btn-primary:active{transform:translateY(0);}
  .btn-ghost{
    background:#fff;
    color:#1a2040;
    border-color:var(--line-strong);
    box-shadow:0 6px 16px rgba(23,29,64,.05);
  }
  .btn-ghost:hover{border-color:var(--brand);color:var(--brand-deep);transform:translateY(-2px);}
  .btn-sm{padding:9px 20px;font-size:14px;}

  /* ---------- Section ---------- */
  .section{padding:64px 0;position:relative;}
  .section--alt{
    background:linear-gradient(180deg, rgba(255,255,255,.66), rgba(255,255,255,0));
  }
  .sec-head{
    max-width:780px;
    margin:0 auto 40px;
    text-align:center;
  }
  .sec-label{
    display:inline-block;
    padding:5px 15px;
    border-radius:999px;
    font-size:13px;
    font-weight:600;
    letter-spacing:.5px;
    color:var(--brand-deep);
    background:rgba(91,60,245,.1);
    border:1px solid rgba(91,60,245,.2);
    margin-bottom:14px;
  }
  .sec-head h2{
    font-size:clamp(22px,3vw,32px);
    line-height:1.36;
    margin-bottom:12px;
    letter-spacing:.5px;
  }
  .sec-head p{color:var(--ink-3);font-size:15px;line-height:1.85;}

  /* ---------- Grids & Cards ---------- */
  .grid{display:grid;gap:20px;}
  .grid-2{grid-template-columns:repeat(2,1fr);}
  .grid-3{grid-template-columns:repeat(3,1fr);}
  .grid-4{grid-template-columns:repeat(4,1fr);}
  .card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:24px;
    box-shadow:0 8px 24px rgba(23,29,64,.05);
    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  }
  .card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 38px rgba(91,60,245,.16);
    border-color:var(--line-strong);
  }
  .card h3{
    font-size:17px;
    margin-bottom:10px;
    letter-spacing:.3px;
  }
  .card p{color:var(--ink-3);font-size:14.5px;line-height:1.8;}
  .icon-dot{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    border-radius:12px;
    margin-bottom:14px;
    font-size:17px;
    font-weight:800;
    color:#fff;
    background:linear-gradient(135deg,#5b3cf5,#00c8ff);
    box-shadow:0 8px 18px rgba(91,60,245,.28);
  }
  .icon-dot--pink{background:linear-gradient(135deg,#ff45b5,#8a3cff);}
  .icon-dot--cyan{background:linear-gradient(135deg,#00c8ff,#5b3cf5);}

  /* ---------- Hero ---------- */
  .hero{
    position:relative;
    overflow:hidden;
    padding:76px 0 58px;
    text-align:center;
  }
  .hero::before{
    content:"";
    position:absolute;
    inset:0;
    background:
      radial-gradient(420px 420px at 16% 28%, rgba(0,200,255,.26), transparent 70%),
      radial-gradient(460px 460px at 84% 16%, rgba(255,69,181,.20), transparent 70%),
      radial-gradient(560px 520px at 52% 96%, rgba(91,60,245,.20), transparent 72%);
    pointer-events:none;
    z-index:0;
  }
  .hero::after{
    content:"";
    position:absolute;
    inset:0;
    background-image:
      linear-gradient(rgba(91,60,245,.07) 1px, transparent 1px),
      linear-gradient(90deg, rgba(91,60,245,.07) 1px, transparent 1px);
    background-size:48px 48px;
    -webkit-mask-image:radial-gradient(circle at 50% 34%, #000 26%, transparent 74%);
    mask-image:radial-gradient(circle at 50% 34%, #000 26%, transparent 74%);
    pointer-events:none;
    z-index:0;
  }
  .hero .container{position:relative;z-index:1;}
  .hero-badge{
    display:inline-block;
    padding:6px 16px;
    border-radius:999px;
    font-size:13px;
    font-weight:600;
    letter-spacing:1px;
    color:var(--brand-deep);
    background:rgba(255,255,255,.82);
    border:1px solid rgba(91,60,245,.26);
    box-shadow:0 8px 20px rgba(91,60,245,.12);
  }
  .hero h1{
    font-size:clamp(27px,4.4vw,48px);
    line-height:1.26;
    letter-spacing:1px;
    max-width:960px;
    margin:20px auto 18px;
  }
  .hero-desc{
    max-width:800px;
    margin:0 auto 30px;
    color:#414b6b;
    font-size:16px;
    line-height:1.9;
  }
  .hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    justify-content:center;
  }
  .hero-tags{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    justify-content:center;
    margin-top:28px;
  }
  .hero-tags li{
    padding:6px 14px;
    font-size:13px;
    color:#3a4468;
    background:rgba(255,255,255,.8);
    border:1px solid rgba(91,60,245,.18);
    border-radius:999px;
  }
  .metrics{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
    margin-top:48px;
  }
  .metric{
    padding:20px 16px;
    border-radius:16px;
    background:rgba(255,255,255,.82);
    border:1px solid rgba(91,60,245,.16);
    box-shadow:0 10px 26px rgba(23,29,64,.06);
    transition:transform .28s ease, box-shadow .28s ease;
  }
  .metric:hover{transform:translateY(-4px);box-shadow:0 16px 32px rgba(91,60,245,.16);}
  .metric .num{
    display:block;
    font-size:24px;
    font-weight:800;
    color:var(--brand-deep);
    letter-spacing:.5px;
    margin-bottom:4px;
  }
  .metric .txt{font-size:13.5px;color:var(--ink-3);}

  /* ---------- Reveal ---------- */
  .reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease, transform .6s ease;}
  .reveal.in{opacity:1;transform:none;}

  /* ---------- About ---------- */
  .about-list{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px;
    margin-top:0;
  }
  .about-item{
    display:flex;
    gap:12px;
    padding:16px 18px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
  }
  .about-item:hover{border-color:var(--line-strong);box-shadow:0 10px 24px rgba(91,60,245,.12);transform:translateY(-3px);}
  .about-item .mark{
    flex:0 0 auto;
    width:24px;
    height:24px;
    border-radius:8px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:700;
    color:#fff;
    background:linear-gradient(135deg,#5b3cf5,#00c8ff);
    margin-top:2px;
  }
  .about-item h3{font-size:15px;margin-bottom:4px;}
  .about-item p{font-size:13.8px;color:var(--ink-3);line-height:1.75;}
  .banner-strip{
    margin-top:32px;
    border-radius:20px;
    overflow:hidden;
    border:1px solid var(--line);
    background:#fff;
    box-shadow:0 16px 40px rgba(23,29,64,.08);
  }
  .banner-strip img{display:block;width:100%;height:auto;}

  /* ---------- Scene cards ---------- */
  .scene-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    padding:20px;
    position:relative;
    overflow:hidden;
    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  }
  .scene-card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:3px;
    background:linear-gradient(90deg,#5b3cf5,#00c8ff,#ff45b5);
    opacity:0;
    transition:opacity .28s ease;
  }
  .scene-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(91,60,245,.16);border-color:var(--line-strong);}
  .scene-card:hover::before{opacity:1;}
  .scene-card h3{font-size:15.5px;margin-bottom:8px;}
  .scene-card p{font-size:13.8px;color:var(--ink-3);line-height:1.75;}

  /* ---------- Industry ---------- */
  .ind-card{
    background:linear-gradient(160deg, rgba(255,255,255,.96), rgba(240,242,255,.94));
    border:1px solid var(--line);
    border-radius:18px;
    padding:24px;
    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  }
  .ind-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(91,60,245,.15);border-color:var(--line-strong);}
  .ind-card h3{font-size:16.5px;margin-bottom:9px;}
  .ind-card p{font-size:14px;color:var(--ink-3);line-height:1.8;}
  .pill-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
  .pill{
    font-size:12.5px;
    padding:4px 11px;
    border-radius:999px;
    color:var(--brand-deep);
    background:rgba(91,60,245,.09);
    border:1px solid rgba(91,60,245,.16);
  }

  /* ---------- Timeline ---------- */
  .timeline{position:relative;display:grid;gap:18px;}
  .step{
    display:flex;
    gap:18px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    padding:22px;
    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  }
  .step:hover{transform:translateX(4px);box-shadow:0 14px 30px rgba(91,60,245,.14);border-color:var(--line-strong);}
  .step .idx{
    flex:0 0 auto;
    width:44px;
    height:44px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    font-size:16px;
    color:#fff;
    background:linear-gradient(135deg,#5b3cf5,#00c8ff);
    box-shadow:0 8px 18px rgba(91,60,245,.26);
  }
  .step h3{font-size:16px;margin-bottom:6px;}
  .step p{font-size:14px;color:var(--ink-3);line-height:1.8;}

  /* ---------- Cases ---------- */
  .case-media{
    aspect-ratio:16/10;
    background:#eef1fb;
    border-radius:14px;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:16px;
    border:1px solid rgba(91,60,245,.1);
  }
  .case-media img{width:100%;height:100%;object-fit:contain;display:block;}

  /* ---------- Table ---------- */
  .table-wrap{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    border:1px solid var(--line);
    border-radius:16px;
    background:#fff;
    box-shadow:0 12px 30px rgba(23,29,64,.06);
  }
  table{border-collapse:collapse;width:100%;min-width:760px;font-size:14.5px;}
  thead th{
    background:linear-gradient(120deg,#31217f,#5b3cf5 60%,#3a7bff);
    color:#fff;
    padding:15px 16px;
    text-align:left;
    font-weight:600;
    white-space:nowrap;
  }
  tbody td{
    padding:14px 16px;
    border-top:1px solid rgba(91,60,245,.1);
    color:#37405f;
    vertical-align:top;
    line-height:1.75;
  }
  tbody tr:nth-child(even){background:rgba(91,60,245,.035);}
  tbody td:first-child{font-weight:600;color:#1a2040;}
  tbody td.best{color:var(--brand-deep);font-weight:600;background:rgba(91,60,245,.07);}
  .score{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:22px;
    padding:24px 28px;
    border-radius:18px;
    margin-bottom:24px;
    background:linear-gradient(120deg, rgba(91,60,245,.11), rgba(0,200,255,.11));
    border:1px solid rgba(91,60,245,.24);
  }
  .score-stars{
    font-size:22px;
    letter-spacing:4px;
    color:#d97706;
    line-height:1.2;
  }
  .score-label{font-size:14px;color:var(--ink-2);margin-top:4px;font-weight:600;}
  .score-num{
    font-size:40px;
    font-weight:800;
    color:var(--brand-deep);
    line-height:1;
    letter-spacing:1px;
  }
  .score-num span{font-size:17px;font-weight:600;color:var(--ink-3);margin-left:2px;}
  .score-note{font-size:14px;color:var(--ink-2);flex:1 1 220px;min-width:180px;}

  /* ---------- Token ---------- */
  .price-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    padding:22px;
    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  }
  .price-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(91,60,245,.15);border-color:var(--line-strong);}
  .price-card h3{font-size:16px;margin-bottom:8px;}
  .price-card p{font-size:13.8px;color:var(--ink-3);line-height:1.8;}
  .price-note{
    margin-top:20px;
    font-size:13.5px;
    color:var(--ink-3);
    background:rgba(255,255,255,.8);
    border:1px dashed rgba(91,60,245,.28);
    border-radius:14px;
    padding:14px 18px;
    line-height:1.8;
  }

  /* ---------- Form ---------- */
  .form-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:20px;
    padding:28px;
    box-shadow:0 18px 42px rgba(23,29,64,.08);
  }
  .form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
  .field{display:flex;flex-direction:column;gap:8px;margin-bottom:16px;}
  .field label{font-size:14px;font-weight:600;color:#2a3155;}
  .field input,
  .field select,
  .field textarea{
    width:100%;
    padding:12px 14px;
    border-radius:12px;
    border:1px solid rgba(91,60,245,.22);
    background:#fbfbff;
    font-size:14.5px;
    color:#1a2040;
    font-family:inherit;
    transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
  }
  .field textarea{min-height:112px;resize:vertical;line-height:1.7;}
  .field input:focus,
  .field select:focus,
  .field textarea:focus{
    outline:none;
    border-color:var(--brand);
    background:#fff;
    box-shadow:0 0 0 3px rgba(91,60,245,.14);
  }
  .form-tip{font-size:13px;color:var(--ink-3);margin-top:12px;line-height:1.8;}

  /* ---------- FAQ ---------- */
  .faq-item{
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    margin-bottom:12px;
    overflow:hidden;
    transition:border-color .25s ease, box-shadow .25s ease;
  }
  .faq-item[open]{
    border-color:var(--line-strong);
    box-shadow:0 12px 28px rgba(91,60,245,.12);
  }
  .faq-item summary{
    cursor:pointer;
    list-style:none;
    position:relative;
    padding:16px 52px 16px 18px;
    font-weight:600;
    font-size:15px;
    color:#1a2040;
    transition:color .2s ease;
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary::after{
    content:"";
    position:absolute;
    right:20px;
    top:50%;
    width:9px;
    height:9px;
    border-right:2px solid var(--brand);
    border-bottom:2px solid var(--brand);
    transform:translateY(-70%) rotate(45deg);
    transition:transform .28s ease;
  }
  .faq-item[open] summary::after{transform:translateY(-30%) rotate(-135deg);}
  .faq-item[open] summary{color:var(--brand-deep);}
  .faq-body{
    padding:0 18px 18px;
    font-size:14.5px;
    color:var(--ink-3);
    line-height:1.85;
  }

  /* ---------- Reviews ---------- */
  .review{
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    padding:22px;
    display:flex;
    flex-direction:column;
    gap:14px;
    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  }
  .review:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(91,60,245,.15);border-color:var(--line-strong);}
  .review-text{font-size:14.3px;color:#313a5c;line-height:1.85;flex:1;}
  .review-user{display:flex;align-items:center;gap:10px;border-top:1px solid rgba(91,60,245,.1);padding-top:13px;}
  .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,#5b3cf5,#00c8ff);
    flex:0 0 auto;
  }
  .review-user .name{font-size:14px;font-weight:600;color:#1a2040;line-height:1.4;}
  .review-user .role{font-size:12.5px;color:var(--ink-3);line-height:1.4;}

  /* ---------- Articles & tags ---------- */
  .tag-cloud{display:flex;flex-wrap:wrap;gap:10px;}
  .tag-cloud a{
    display:inline-block;
    padding:7px 15px;
    font-size:13.5px;
    border-radius:999px;
    text-decoration:none;
    color:#3a4468;
    background:#fff;
    border:1px solid var(--line);
    transition:all .25s ease;
  }
  .tag-cloud a:hover{
    color:#fff;
    background:linear-gradient(120deg,#5b3cf5,#00c8ff);
    border-color:transparent;
    transform:translateY(-2px);
    box-shadow:0 10px 22px rgba(91,60,245,.28);
  }
  .article-list{display:grid;gap:12px;margin-top:22px;}
  .article-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:16px 20px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    text-decoration:none;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .article-item:hover{transform:translateX(4px);border-color:var(--line-strong);box-shadow:0 12px 26px rgba(91,60,245,.13);}
  .article-item .art-title{font-size:14.8px;font-weight:600;color:#1a2040;line-height:1.6;}
  .article-item .art-more{font-size:13px;color:var(--brand-deep);white-space:nowrap;font-weight:600;}

  /* ---------- Contact ---------- */
  .contact-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    padding:26px;
    box-shadow:0 12px 30px rgba(23,29,64,.06);
  }
  .contact-card h3{font-size:17px;margin-bottom:16px;}
  .contact-row{
    display:flex;
    gap:12px;
    padding:11px 0;
    border-bottom:1px dashed rgba(91,60,245,.16);
    font-size:14.3px;
    color:var(--ink-2);
    align-items:flex-start;
  }
  .contact-row:last-of-type{border-bottom:none;}
  .contact-row .ck{color:var(--ink-3);flex:0 0 76px;font-size:13.5px;}
  .contact-row a{color:var(--brand-deep);text-decoration:none;word-break:break-all;}
  .contact-row a:hover{text-decoration:underline;}
  .qr-box{margin-top:16px;text-align:center;}
  .qr-box img{
    width:150px;
    height:auto;
    display:inline-block;
    border-radius:12px;
    border:1px solid var(--line);
    padding:6px;
    background:#fff;
  }
  .qr-box p{font-size:13px;color:var(--ink-3);margin-top:8px;}

  /* ---------- Join ---------- */
  .join-card{
    background:linear-gradient(135deg, rgba(91,60,245,.10), rgba(0,200,255,.10));
    border:1px solid rgba(91,60,245,.24);
    border-radius:20px;
    padding:32px;
  }
  .join-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:22px 0 26px;}
  .join-item{
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:18px;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .join-item:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(91,60,245,.14);}
  .join-item h3{font-size:15px;margin-bottom:7px;}
  .join-item p{font-size:13.6px;color:var(--ink-3);line-height:1.78;}

  /* ---------- Friend links ---------- */
  .friend-links{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    justify-content:center;
    margin-top:18px;
  }
  .friend-links a{
    font-size:13.5px;
    padding:7px 15px;
    border-radius:999px;
    text-decoration:none;
    color:#3a4468;
    background:#fff;
    border:1px solid var(--line);
    transition:all .25s ease;
  }
  .friend-links a:hover{color:var(--brand-deep);border-color:var(--line-strong);transform:translateY(-2px);}

  /* ---------- Footer ---------- */
  .site-footer{
    margin-top:0;
    background:linear-gradient(180deg,#eef1ff,#e4e8ff);
    border-top:1px solid rgba(91,60,245,.18);
    padding:36px 0 22px;
    color:#2a3155;
  }
  .footer-inner{
    display:flex;
    flex-wrap:wrap;
    gap:24px;
    justify-content:space-between;
    align-items:flex-start;
  }
  .footer-name{
    font-size:17px;
    font-weight:800;
    color:#151b3d;
    letter-spacing:1px;
    margin-bottom:8px;
  }
  .footer-desc{font-size:13.5px;color:#4a5473;line-height:1.8;max-width:460px;}
  .footer-contact{font-size:13.5px;color:#4a5473;line-height:2;}
  .footer-contact a{color:#3a1fb8;text-decoration:none;}
  .footer-contact a:hover{text-decoration:underline;}
  .footer-bottom{
    margin-top:24px;
    padding-top:16px;
    border-top:1px solid rgba(91,60,245,.16);
    font-size:13px;
    color:#4a5473;
  }
  .footer-bottom a{color:#3a1fb8;text-decoration:none;}
  .footer-bottom a:hover{text-decoration:underline;}

  /* ---------- Floating ---------- */
  .float-tools{
    position:fixed;
    right:16px;
    bottom:20px;
    z-index:120;
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:12px;
  }
  .float-btn{
    width:52px;
    height:52px;
    border-radius:50%;
    border:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:700;
    color:#fff;
    font-family:inherit;
    background:linear-gradient(135deg,#5b3cf5,#00c8ff);
    box-shadow:0 10px 26px rgba(91,60,245,.36);
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .float-btn:hover{transform:translateY(-3px);box-shadow:0 16px 32px rgba(91,60,245,.46);}
  #toTop{
    background:#fff;
    color:var(--brand-deep);
    border:1px solid var(--line-strong);
    box-shadow:0 8px 20px rgba(23,29,64,.12);
  }
  .float-panel{
    width:206px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    padding:16px;
    box-shadow:0 18px 40px rgba(23,29,64,.16);
    text-align:center;
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:opacity .25s ease, transform .25s ease, visibility .25s ease;
  }
  .float-panel.show{opacity:1;visibility:visible;transform:none;}
  .fp-title{font-size:14px;font-weight:700;color:#1a2040;margin-bottom:10px;}
  .fp-qr img{
    width:132px;
    height:auto;
    display:block;
    margin:0 auto;
    border-radius:10px;
    border:1px solid var(--line);
  }
  .fp-note{font-size:12.5px;color:var(--ink-3);margin:8px 0 10px;}
  .fp-line{font-size:12.5px;color:#3a4468;line-height:1.9;word-break:break-all;}

  /* ---------- Responsive ---------- */
  @media (max-width:1080px){
    .nav{
      position:absolute;
      top:100%;
      left:0;
      right:0;
      margin-left:0;
      display:none;
      background:#fff;
      border-bottom:1px solid var(--line);
      box-shadow:0 22px 44px rgba(23,29,64,.14);
      padding:8px 20px 16px;
      border-radius:0 0 16px 16px;
    }
    .nav.open{display:block;}
    .nav-links{flex-direction:column;align-items:stretch;gap:0;}
    .nav-links a{padding:12px 8px;border-bottom:1px solid rgba(91,60,245,.08);border-radius:0;}
    .nav-toggle{display:flex;}
    .header-cta{display:none;}
  }
  @media (max-width:900px){
    .grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}
    .join-grid{grid-template-columns:1fr;}
    .metrics{grid-template-columns:repeat(2,1fr);}
  }
  @media (max-width:720px){
    .section{padding:48px 0;}
    .hero{padding:52px 0 44px;}
    .grid-2{grid-template-columns:1fr;}
    .about-list{grid-template-columns:1fr;}
    .form-row{grid-template-columns:1fr;}
    .score{padding:20px;gap:16px;}
    .score-num{font-size:34px;}
    .join-card{padding:22px;}
    .footer-inner{flex-direction:column;gap:16px;}
  }
  @media (max-width:620px){
    .grid-3,.grid-4{grid-template-columns:1fr;}
    .metrics{grid-template-columns:1fr 1fr;}
    .metric{padding:16px 12px;}
    .metric .num{font-size:20px;}
    .hero-desc{font-size:15px;}
    .brand-text{display:none;}
    .step{padding:18px;gap:14px;}
    .step .idx{width:38px;height:38px;border-radius:12px;font-size:14px;}
  }
  @media (prefers-reduced-motion:reduce){
    *{animation:none !important;transition:none !important;}
    html{scroll-behavior:auto;}
    .reveal{opacity:1;transform:none;}
  }
  section[id], div[id]{scroll-margin-top:86px;}