/* =========================================================
   PAGE RESET
========================================================= */

html,
body{
  margin:0;
  padding:0;
}

html{
  scroll-behavior:smooth;
}

body{
  background:#f7f9fc;
}


/* =========================================================
   PAGE ROOT
========================================================= */

.guide-page{
  --blue:#1769ff;
  --blue2:#35b9ff;
  --blue-dark:#1053d6;
  --text:#172033;
  --muted:#697386;
  --light:#f5f8fc;
  --line:#e8edf5;
  --white:#ffffff;
  --shadow:0 18px 50px rgba(29,70,125,.10);

  min-height:100vh;
  width:100%;
  margin:0;
  padding:0;

  background:#f7f9fc;
  color:var(--text);

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    "PingFang SC",
    "Hiragino Sans GB",
    "Microsoft YaHei",
    Arial,
    sans-serif;

  line-height:1.75;
  overflow-x:hidden;
}

.guide-page *,
.guide-page *::before,
.guide-page *::after{
  box-sizing:border-box;
}

.guide-page a{
  color:inherit;
  text-decoration:none;
}

.guide-page img{
  max-width:100%;
  height:auto;
  display:block;
}

.guide-page button,
.guide-page input,
.guide-page textarea,
.guide-page select{
  font:inherit;
}

.guide-page h1,
.guide-page h2,
.guide-page h3,
.guide-page h4,
.guide-page p,
.guide-page ul,
.guide-page ol{
  margin-top:0;
}


/* =========================================================
   HEADER
   与首页母版统一
========================================================= */

.guide-page .site-header{
  position:fixed;
  z-index:1000;

  top:0;
  left:0;
  right:0;

  height:76px;

  background:rgba(255,255,255,.84);

  border-bottom:
    1px solid rgba(225,232,242,.75);

  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);

  transition:
    background .3s ease,
    box-shadow .3s ease;
}

.guide-page .site-header.scrolled{
  background:rgba(255,255,255,.97);

  box-shadow:
    0 8px 30px rgba(24,64,120,.06);
}

.guide-page .nav-inner{
  width:min(1240px,calc(100% - 40px));

  height:100%;

  margin:0 auto;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:28px;

  position:relative;
}


/* =========================================================
   LOGO
========================================================= */

.guide-page .logo{
  display:flex;
  align-items:center;

  gap:11px;

  flex-shrink:0;

  min-width:0;
}

.guide-page .logo-icon{
  display:flex;
  align-items:center;
  justify-content:center;

  flex-shrink:0;
}

.guide-page .logo-icon img{
  width:auto;
  height:auto;

  max-height:44px;

  display:block;
}


/* =========================================================
   DESKTOP NAV
========================================================= */

.guide-page .nav-links{
  display:flex;
  align-items:center;

  gap:4px;

  margin-left:auto;

  min-width:0;
}

.guide-page .nav-links a{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:9px 12px;

  border-radius:10px;

  color:#536078;

  font-size:14px;
  line-height:1.2;

  white-space:nowrap;

  transition:
    color .25s ease,
    background .25s ease;
}

.guide-page .nav-links a:hover,
.guide-page .nav-links a.active{
  color:var(--blue);

  background:#edf5ff;
}


/* =========================================================
   HEADER ACTIONS
========================================================= */

.guide-page .nav-actions{
  display:flex;
  align-items:center;

  gap:10px;

  flex:0 0 auto;
}

.guide-page .nav-help{
  color:#536078;

  font-size:14px;

  white-space:nowrap;

  transition:
    color .2s ease;
}

.guide-page .nav-help:hover{
  color:var(--blue);
}

.guide-page .nav-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:10px 17px;

  border-radius:10px;

  color:#fff;

  background:
    linear-gradient(
      135deg,
      var(--blue),
      var(--blue2)
    );

  font-size:14px;
  line-height:1.2;
  font-weight:700;

  white-space:nowrap;

  box-shadow:
    0 8px 20px rgba(23,105,255,.20);

  transition:
    transform .2s ease,
    box-shadow .2s ease;
}

.guide-page .nav-btn:hover{
  transform:translateY(-1px);

  box-shadow:
    0 11px 24px rgba(23,105,255,.25);
}


/* =========================================================
   MOBILE MENU BUTTON
========================================================= */

.guide-page .mobile-menu-btn{
  display:none;

  width:42px;
  height:42px;

  padding:0;

  border:
    1px solid var(--line);

  border-radius:10px;

  background:#fff;

  cursor:pointer;

  flex:0 0 auto;
}

.guide-page .mobile-menu-btn span{
  display:block;

  width:19px;
  height:2px;

  margin:4px auto;

  background:#243149;

  border-radius:3px;

  transition:.2s ease;
}


/* =========================================================
   MOBILE NAV
========================================================= */

.guide-page .mobile-nav{
  display:none;
}


/* =========================================================
   HERO
========================================================= */

.guide-page .guide-hero{
  position:relative;

  overflow:hidden;

  padding:
    145px 20px 75px;

  background:
    radial-gradient(
      circle at 10% 15%,
      rgba(53,185,255,.15),
      transparent 31%
    ),
    radial-gradient(
      circle at 92% 25%,
      rgba(23,105,255,.12),
      transparent 30%
    ),
    linear-gradient(
      180deg,
      #f8fbff 0%,
      #f5f8fc 100%
    );
}

.guide-page .hero-orb{
  position:absolute;

  width:420px;
  height:420px;

  border-radius:50%;

  right:-190px;
  top:40px;

  background:
    linear-gradient(
      135deg,
      rgba(53,185,255,.13),
      rgba(23,105,255,.03)
    );

  filter:blur(1px);

  pointer-events:none;

  will-change:transform;
}

.guide-page .hero-inner{
  position:relative;

  width:min(1040px,100%);

  margin:0 auto;

  text-align:center;
}

.guide-page .eyebrow{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  gap:8px;

  padding:7px 13px;
  margin-bottom:18px;

  border-radius:999px;

  color:var(--blue);

  background:#eaf4ff;

  border:1px solid #dcecff;

  font-size:13px;
  font-weight:700;
}

.guide-page .eyebrow-dot{
  width:7px;
  height:7px;

  flex:0 0 7px;

  border-radius:50%;

  background:var(--blue);

  box-shadow:
    0 0 0 5px rgba(23,105,255,.08);
}

.guide-page .guide-hero h1{
  margin:0 auto;

  max-width:900px;

  color:#111b2f;

  font-size:clamp(34px,5vw,58px);

  line-height:1.15;

  letter-spacing:-1.8px;

  font-weight:850;
}

.guide-page .guide-hero h1 span{
  color:var(--blue);
}

.guide-page .hero-desc{
  max-width:760px;

  margin:23px auto 0;

  color:#68758a;

  font-size:17px;
}

.guide-page .hero-meta{
  margin-top:22px;

  display:flex;

  justify-content:center;
  align-items:center;

  gap:18px;

  flex-wrap:wrap;

  color:#8993a5;

  font-size:13px;
}

.guide-page .hero-meta span{
  display:inline-flex;

  align-items:center;

  gap:6px;
}

.guide-page .hero-meta i{
  display:block;

  width:5px;
  height:5px;

  flex:0 0 5px;

  border-radius:50%;

  background:#b8c2d1;
}


/* =========================================================
   ARTICLE LAYOUT
========================================================= */

.guide-page .article-area{
  width:min(1160px,calc(100% - 40px));

  margin:0 auto;

  padding:
    65px 0 90px;

  display:grid;

  grid-template-columns:
    minmax(0,820px)
    280px;

  gap:42px;

  align-items:start;
}

.guide-page .article-card{
  min-width:0;

  background:#fff;

  border:
    1px solid var(--line);

  border-radius:22px;

  box-shadow:var(--shadow);

  padding:46px;
}

.guide-page .article-intro{
  padding:20px 22px;

  margin-bottom:35px;

  border-left:
    4px solid var(--blue);

  border-radius:
    0 14px 14px 0;

  background:#f3f8ff;

  color:#506078;

  font-size:15px;
}

.guide-page .article-card h2{
  scroll-margin-top:95px;

  margin:
    42px 0 18px;

  color:#182237;

  font-size:27px;

  line-height:1.35;

  letter-spacing:-.5px;
}

.guide-page .article-card h2:first-of-type{
  margin-top:8px;
}

.guide-page .article-card h3{
  margin:
    27px 0 12px;

  color:#25314a;

  font-size:20px;

  line-height:1.45;
}

.guide-page .article-card p{
  margin:
    0 0 17px;

  color:#59677d;

  font-size:16px;
}

.guide-page .article-card ul,
.guide-page .article-card ol{
  margin:
    15px 0 23px;

  padding-left:25px;

  color:#59677d;
}

.guide-page .article-card li{
  margin:8px 0;

  padding-left:3px;
}

.guide-page .article-card strong{
  color:#26354f;
}


/* =========================================================
   INFO CARDS
========================================================= */

.guide-page .info-grid{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:15px;

  margin:
    23px 0 30px;
}

.guide-page .info-card{
  min-width:0;

  padding:21px;

  border:
    1px solid #e6edf7;

  border-radius:16px;

  background:#fbfdff;
}

.guide-page .info-icon{
  width:38px;
  height:38px;

  display:grid;
  place-items:center;

  margin-bottom:13px;

  border-radius:11px;

  background:#eaf4ff;

  color:var(--blue);

  font-weight:800;
}

.guide-page .info-card h3{
  margin:0 0 6px;

  font-size:17px;
}

.guide-page .info-card p{
  margin:0;

  font-size:14px;
}


/* =========================================================
   STEPS
========================================================= */

.guide-page .step-list{
  display:grid;

  gap:14px;

  margin:
    22px 0 28px;
}

.guide-page .step-item{
  display:grid;

  grid-template-columns:
    45px
    minmax(0,1fr);

  gap:14px;

  padding:18px;

  border:
    1px solid #e7edf6;

  border-radius:16px;

  background:#fff;
}

.guide-page .step-num{
  width:40px;
  height:40px;

  border-radius:12px;

  display:grid;
  place-items:center;

  background:
    linear-gradient(
      135deg,
      var(--blue),
      var(--blue2)
    );

  color:#fff;

  font-weight:800;
}

.guide-page .step-item h3{
  margin:0 0 5px;

  font-size:17px;
}

.guide-page .step-item p{
  margin:0;

  font-size:14px;
}


/* =========================================================
   NOTICE
========================================================= */

.guide-page .notice{
  margin:25px 0;

  padding:20px 22px;

  border-radius:15px;

  background:#fff9e9;

  border:
    1px solid #f5e7bb;

  color:#75633a;

  font-size:14px;
}


/* =========================================================
   PROCESS
========================================================= */

.guide-page .process{
  display:flex;

  align-items:stretch;

  gap:8px;

  margin:
    25px 0 32px;
}

.guide-page .process-item{
  flex:1;

  min-width:0;

  padding:17px 10px;

  text-align:center;

  border:
    1px solid #e3eaf4;

  border-radius:14px;

  background:#fbfdff;

  font-size:14px;

  font-weight:700;

  color:#40506a;
}

.guide-page .process-arrow{
  display:flex;

  align-items:center;
  justify-content:center;

  flex:0 0 auto;

  color:#9eabc0;

  font-weight:800;
}


/* =========================================================
   FAQ
========================================================= */

.guide-page .faq-list{
  margin-top:20px;
}

.guide-page .faq-item{
  border:
    1px solid #e5ebf4;

  border-radius:15px;

  margin-bottom:12px;

  overflow:hidden;

  background:#fff;
}

.guide-page .faq-question{
  width:100%;

  min-height:58px;

  border:0;

  padding:18px 20px;

  background:#fff;

  color:#26334b;

  text-align:left;

  font-weight:700;

  cursor:pointer;

  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:15px;
}

.guide-page .faq-question span:first-child{
  min-width:0;
}

.guide-page .faq-question span:last-child{
  flex:0 0 auto;

  font-size:21px;

  line-height:1;

  color:var(--blue);

  transition:
    transform .25s ease;
}

.guide-page .faq-item.open
.faq-question span:last-child{
  transform:rotate(45deg);
}

.guide-page .faq-answer{
  display:none;

  padding:
    0 20px 19px;

  color:#68758a;

  font-size:14px;
}

.guide-page .faq-item.open .faq-answer{
  display:block;
}


/* =========================================================
   RELATED
========================================================= */

.guide-page .related-box{
  margin-top:45px;

  padding-top:32px;

  border-top:
    1px solid var(--line);
}

.guide-page .related-box h2{
  margin-top:0;
}

.guide-page .related-grid{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:12px;

  margin-top:18px;
}

.guide-page .related-link{
  display:block;

  min-width:0;

  padding:16px 17px;

  border:
    1px solid #e4eaf3;

  border-radius:14px;

  background:#fbfdff;

  transition:
    border-color .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}

.guide-page .related-link:hover{
  border-color:#c8ddff;

  transform:translateY(-2px);

  box-shadow:
    0 8px 20px rgba(23,105,255,.08);
}

.guide-page .related-link strong{
  display:block;

  color:#293751;

  font-size:14px;
}

.guide-page .related-link span{
  display:block;

  margin-top:3px;

  color:#8792a5;

  font-size:12px;
}


/* =========================================================
   SIDEBAR
========================================================= */

.guide-page .sidebar{
  min-width:0;

  position:sticky;

  top:96px;
}

.guide-page .side-card{
  padding:22px;

  margin-bottom:17px;

  background:#fff;

  border:
    1px solid var(--line);

  border-radius:18px;

  box-shadow:
    0 10px 30px rgba(30,63,110,.07);
}

.guide-page .side-card h3{
  margin:0 0 14px;

  font-size:16px;
}

.guide-page .toc a{
  display:block;

  padding:8px 10px;

  margin:3px 0;

  border-radius:9px;

  color:#66748a;

  font-size:13px;

  line-height:1.5;

  transition:
    color .2s ease,
    background .2s ease;
}

.guide-page .toc a:hover{
  color:var(--blue);

  background:#edf5ff;
}


/* =========================================================
   SIDEBAR DOWNLOAD
========================================================= */

.guide-page .side-download{
  position:relative;

  overflow:hidden;

  background:
    linear-gradient(
      145deg,
      #1265f6,
      #35b9ff
    );

  border:0;

  color:#fff;
}

.guide-page .side-download:after{
  content:"";

  position:absolute;

  width:130px;
  height:130px;

  border-radius:50%;

  right:-65px;
  top:-65px;

  background:
    rgba(255,255,255,.12);

  pointer-events:none;
}

.guide-page .side-download h3{
  position:relative;

  z-index:1;

  color:#fff;
}

.guide-page .side-download p{
  position:relative;

  z-index:1;

  margin:
    0 0 15px;

  color:
    rgba(255,255,255,.84);

  font-size:13px;
}

.guide-page .side-download a{
  position:relative;

  z-index:1;

  display:inline-flex;

  padding:9px 13px;

  border-radius:9px;

  background:#fff;

  color:#1265f6;

  font-size:13px;

  font-weight:700;
}


/* =========================================================
   CTA
========================================================= */

.guide-page .article-cta{
  margin-top:50px;

  padding:38px 30px;

  text-align:center;

  border-radius:20px;

  background:
    radial-gradient(
      circle at 10% 10%,
      rgba(255,255,255,.18),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #125ee8,
      #2db6ff
    );

  color:#fff;
}

.guide-page .article-cta h2{
  margin:
    0 0 10px;

  color:#fff;

  font-size:28px;
}

.guide-page .article-cta p{
  max-width:620px;

  margin:
    0 auto 21px;

  color:
    rgba(255,255,255,.86);
}

.guide-page .cta-actions{
  display:flex;

  justify-content:center;

  gap:10px;

  flex-wrap:wrap;
}

.guide-page .cta-primary,
.guide-page .cta-secondary{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  min-height:43px;

  padding:11px 20px;

  border-radius:10px;

  font-size:14px;

  font-weight:700;
}

.guide-page .cta-primary{
  color:#1261e9;

  background:#fff;
}

.guide-page .cta-secondary{
  color:#fff;

  border:
    1px solid rgba(255,255,255,.35);

  background:
    rgba(255,255,255,.10);
}


/* =========================================================
   FOOTER
   与首页母版统一
========================================================= */

.guide-page .site-footer{
  padding:
    65px 0 25px;

  background:#091629;

  color:#fff;
}

.guide-page .footer-inner{
  width:min(1180px,calc(100% - 40px));

  margin:0 auto;
}

.guide-page .footer-top{
  display:grid;

  grid-template-columns:
    1.5fr
    1fr
    1fr
    1fr
    1fr;

  gap:45px;

  padding-bottom:48px;

  border-bottom:
    1px solid rgba(255,255,255,.08);
}

.guide-page .footer-brand{
  min-width:0;
}

.guide-page .footer-brand p{
  max-width:330px;

  margin:
    16px 0 0;

  color:#8190a7;

  font-size:13px;

  line-height:1.9;
}

.guide-page .footer-col{
  min-width:0;
}

.guide-page .footer-col h4{
  margin:
    0 0 15px;

  color:#fff;

  font-size:14px;

  font-weight:700;
}

.guide-page .footer-col a{
  display:block;

  margin:9px 0;

  color:#8190a7;

  font-size:13px;

  transition:
    color .2s ease;
}

.guide-page .footer-col a:hover{
  color:#fff;
}

.guide-page .footer-bottom{
  display:flex;

  justify-content:space-between;

  gap:20px;

  padding-top:23px;

  color:#65748b;

  font-size:12px;
}


/* =========================================================
   REVEAL
========================================================= */

.guide-page.js-ready .reveal{
  opacity:0;

  transform:translateY(22px);

  transition:
    opacity .7s ease,
    transform .7s ease;
}

.guide-page.js-ready .reveal.show{
  opacity:1;

  transform:none;
}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:1100px){

  .guide-page .nav-inner{
    width:calc(100% - 28px);

    gap:15px;
  }

  .guide-page .nav-links{
    gap:2px;
  }

  .guide-page .nav-links a{
    padding:
      8px 8px;

    font-size:13px;
  }

  .guide-page .nav-help{
    display:none;
  }

  .guide-page .article-area{
    grid-template-columns:
      minmax(0,1fr)
      260px;

    gap:25px;
  }

}


/* =========================================================
   MOBILE NAV / TABLET
========================================================= */

@media(max-width:900px){

  .guide-page .nav-links{
    display:none;
  }

  .guide-page .nav-actions{
    margin-left:auto;
  }

  .guide-page .mobile-menu-btn{
    display:block;
  }

  .guide-page .mobile-nav{
    position:absolute;

    top:76px;

    left:0;
    right:0;

    display:none;

    padding:10px;

    background:#fff;

    border:
      1px solid var(--line);

    border-radius:14px;

    box-shadow:
      0 18px 40px rgba(20,50,90,.12);

    max-height:
      calc(100vh - 90px);

    overflow-y:auto;
  }

  .guide-page .mobile-nav.open{
    display:block;
  }

  .guide-page .mobile-nav a{
    display:block;

    padding:12px;

    border-radius:9px;

    color:#536078;

    font-size:14px;
  }

  .guide-page .mobile-nav a:hover,
  .guide-page .mobile-nav a.active{
    background:#edf5ff;

    color:var(--blue);
  }

  .guide-page .mobile-nav .mobile-menu-primary{
    margin-top:6px;

    color:#fff;

    background:
      linear-gradient(
        135deg,
        var(--blue),
        var(--blue2)
      );

    text-align:center;

    font-weight:700;
  }

  .guide-page .article-area{
    grid-template-columns:1fr;
  }

  .guide-page .sidebar{
    position:static;

    display:grid;

    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:15px;
  }

  .guide-page .side-card{
    margin:0;
  }

  .guide-page .side-download{
    grid-column:
      1 / -1;
  }

  .guide-page .footer-top{
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

  .guide-page .footer-brand{
    grid-column:
      1 / -1;
  }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media(max-width:700px){

  .guide-page .site-header{
    height:68px;
  }

  .guide-page .nav-inner{
    width:calc(100% - 28px);

    height:68px;

    gap:10px;
  }

  .guide-page .logo-icon img{
    max-height:40px;
  }

  .guide-page .nav-actions{
    gap:7px;
  }

  .guide-page .nav-btn{
    padding:
      9px 11px;

    font-size:12px;
  }

  .guide-page .mobile-menu-btn{
    width:40px;
    height:40px;
  }

  .guide-page .mobile-nav{
    top:67px;
  }

  .guide-page .guide-hero{
    padding:
      118px 17px 58px;
  }

  .guide-page .guide-hero h1{
    font-size:36px;

    letter-spacing:-1px;
  }

  .guide-page .hero-desc{
    font-size:15px;

    line-height:1.8;
  }

  .guide-page .hero-meta{
    gap:10px;

    font-size:12px;
  }

  .guide-page .article-area{
    width:calc(100% - 24px);

    padding:
      35px 0 60px;
  }

  .guide-page .article-card{
    padding:
      25px 19px;

    border-radius:17px;
  }

  .guide-page .article-intro{
    padding:
      17px 17px;

    margin-bottom:28px;

    font-size:14px;
  }

  .guide-page .article-card h2{
    font-size:23px;

    margin-top:34px;

    scroll-margin-top:80px;
  }

  .guide-page .article-card h3{
    font-size:18px;
  }

  .guide-page .article-card p{
    font-size:15px;
  }

  .guide-page .info-grid,
  .guide-page .related-grid{
    grid-template-columns:1fr;
  }

  .guide-page .process{
    display:grid;

    grid-template-columns:1fr;

    gap:8px;
  }

  .guide-page .process-arrow{
    display:none;
  }

  .guide-page .sidebar{
    grid-template-columns:1fr;
  }

  .guide-page .side-download{
    grid-column:auto;
  }

  .guide-page .footer-top{
    grid-template-columns:
      repeat(2,minmax(0,1fr));

    gap:
      28px 20px;
  }

  .guide-page .footer-brand{
    grid-column:
      1 / -1;
  }

  .guide-page .article-cta{
    padding:
      30px 20px;
  }

  .guide-page .article-cta h2{
    font-size:24px;
  }

  .guide-page .cta-actions{
    flex-direction:column;
  }

  .guide-page .cta-primary,
  .guide-page .cta-secondary{
    width:100%;
  }

  .guide-page .footer-bottom{
    flex-direction:column;

    align-items:flex-start;

    gap:7px;
  }

}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media(max-width:420px){

  .guide-page .nav-btn{
    display:none;
  }

  .guide-page .logo-icon img{
    max-height:37px;
  }

  .guide-page .guide-hero h1{
    font-size:32px;
  }

  .guide-page .article-card{
    padding:
      23px 16px;
  }

  .guide-page .step-item{
    grid-template-columns:
      40px
      minmax(0,1fr);

    gap:11px;

    padding:15px;
  }

  .guide-page .step-num{
    width:36px;
    height:36px;

    border-radius:10px;

    font-size:13px;
  }

  .guide-page .footer-top{
    grid-template-columns:1fr;
  }

  .guide-page .footer-brand{
    grid-column:auto;
  }

}


    /* ==========================================================
    全站统一 Header / Footer 样式（统一顶部与底部布局）
    追加于页面原有样式之后，保证所有页面渲染一致
    ========================================================== */

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .site-header, .site-header{
      position:fixed;
      z-index:1000;
      top:0;
      left:0;
      right:0;
      height:76px;
      display:flex;
      align-items:center;
      background:rgba(255,255,255,.92);
      backdrop-filter:blur(18px);
      -webkit-backdrop-filter:blur(18px);
      border-bottom:1px solid #e8eef7;
      transition:background .3s ease,border-color .3s ease,box-shadow .3s ease;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .site-header.scrolled, .site-header.scrolled{
      background:rgba(255,255,255,.98);
      border-color:#e2e9f3;
      box-shadow:0 8px 30px rgba(20,48,90,.08);
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .header-inner, .header-inner{
      width:min(1240px,calc(100% - 40px));
      height:100%;
      margin:auto;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:28px;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .logo, .logo{
      display:flex;
      align-items:center;
      gap:11px;
      flex-shrink:0;
      text-decoration:none;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .logo-icon, .logo-icon{
      display:flex;
      align-items:center;
      justify-content:center;
      width:auto;
      height:auto;
      border-radius:0;
      box-shadow:none;
      overflow:visible;
      background:transparent;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .logo-icon img, .logo-icon img{
      width:auto;
      height:auto;
      display:block;
      max-height:44px;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .nav, .nav{
      display:flex;
      align-items:center;
      gap:5px;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .nav a, .nav a{
      padding:9px 13px;
      border-radius:10px;
      color:#50617d;
      font-size:14px;
      font-weight:600;
      text-decoration:none;
      transition:.25s ease;
      display:inline-block;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .nav a:hover, .nav a.active, .nav a:hover, .nav a.active{
      color:#1769ff;
      background:#edf4ff;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .header-actions, .header-actions{
      display:flex;
      align-items:center;
      gap:10px;
      flex-shrink:0;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .header-help, .header-help{
      padding:9px 12px;
      color:#52637e;
      font-size:14px;
      font-weight:600;
      text-decoration:none;
      transition:.25s ease;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .header-help:hover, .header-help:hover{
      color:#1769ff;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .header-btn, .header-btn{
      padding:11px 18px;
      border-radius:11px;
      color:#fff;
      background:#1769ff;
      font-size:14px;
      font-weight:700;
      text-decoration:none;
      box-shadow:0 8px 22px rgba(23,105,255,.22);
      transition:.25s ease;
      white-space:nowrap;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .header-btn:hover, .header-btn:hover{
      background:#0f5ae0;
      transform:translateY(-2px);
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .menu-btn, .menu-btn{
      display:none;
      width:42px;
      height:42px;
      align-items:center;
      justify-content:center;
      flex-direction:column;
      gap:5px;
      border:1px solid #dde5ef;
      border-radius:11px;
      background:#fff;
      cursor:pointer;
      flex-shrink:0;
      padding:0;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .menu-btn span, .menu-btn span{
      width:18px;
      height:2px;
      border-radius:3px;
      background:#31415d;
      display:block;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .mobile-nav, .mobile-nav{
      display:none;
      position:fixed;
      top:76px;
      left:0;
      right:0;
      z-index:999;
      background:#fff;
      border-bottom:1px solid #e2e9f3;
      box-shadow:0 18px 40px rgba(16,24,40,.10);
      padding:12px 20px 20px;
      flex-direction:column;
      gap:4px;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .mobile-nav.open, .mobile-nav.open{
      display:flex;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .mobile-nav a, .mobile-nav a{
      padding:12px 14px;
      border-radius:10px;
      color:#3c4c63;
      font-size:15px;
      font-weight:600;
      text-decoration:none;
      transition:.2s ease;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .mobile-nav a:hover, .mobile-nav a.active, .mobile-nav a:hover, .mobile-nav a.active{
      color:#1769ff;
      background:#edf4ff;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .mobile-nav .mobile-menu-primary, .mobile-nav .mobile-menu-primary{
      margin-top:8px;
      color:#fff;
      background:#1769ff;
      text-align:center;
      border-radius:10px;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .mobile-nav .mobile-menu-primary:hover, .mobile-nav .mobile-menu-primary:hover{
      color:#fff;
      background:#0f5ae0;
    }

    /* 屏蔽旧版移动端下拉菜单样式，统一由 .mobile-nav 承担 */
    .mq-home .site-header.mobile-open .nav,
    .products-page .site-header.mobile-open .nav,
    .mq-solutions-page .site-header.mobile-open .nav,
    .mq-features-page .site-header.mobile-open .main-nav,
    .mq-features-page .site-header.mobile-open .header-actions{
      display:none !important;
    }

    /* ---------- 统一底部 ---------- */

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .site-footer, .site-footer{
      background:#091629;
      color:#fff;
      padding:65px 0 25px;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-inner, .footer-inner{
      width:min(1240px,calc(100% - 40px));
      margin:auto;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-top, .footer-top{
      display:grid;
      grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;
      gap:45px;
      padding-bottom:48px;
      border-bottom:1px solid rgba(255,255,255,.08);
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-brand, .footer-brand{
      max-width:330px;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-brand .logo-icon img, .footer-brand .logo-icon img{
      max-height:44px;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-brand p, .footer-brand p{
      margin:16px 0 0;
      color:#8190a7;
      font-size:13px;
      line-height:1.9;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-col h4, .footer-col h4{
      margin:0 0 15px;
      color:#fff;
      font-size:14px;
      font-weight:700;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-links, .footer-links{
      display:grid;
      gap:9px;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-links a, .footer-links a{
      color:#8190a7;
      font-size:13px;
      text-decoration:none;
      transition:.2s ease;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-links a:hover, .footer-links a:hover{
      color:#fff;
    }

    :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-bottom, .footer-bottom{
      display:flex;
      justify-content:space-between;
      gap:20px;
      padding-top:23px;
      color:#65748b;
      font-size:12px;
    }

    /* ---------- 统一响应式 ---------- */

    @media(max-width:1080px){
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .nav, .nav{ gap:0; }
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .nav a, .nav a{ padding:8px 9px; font-size:13px; }
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .header-help, .header-help{ display:none; }
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-top, .footer-top{ grid-template-columns:repeat(3,1fr); }
    }

    @media(max-width:900px){
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .nav, .nav{ display:none; }
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .header-actions, .header-actions{ display:none; }
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .menu-btn, .menu-btn{ display:flex; }
    }

    @media(max-width:820px){
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .site-header, .site-header{ height:68px; }
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .header-inner, .header-inner{ width:calc(100% - 28px); gap:12px; }
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .mobile-nav, .mobile-nav{ top:68px; }
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-top, .footer-top{ grid-template-columns:repeat(2,1fr); gap:28px; }
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-bottom, .footer-bottom{ flex-direction:column; }
    }

    @media(max-width:480px){
      :is(.mq-home,.mq-features-page,.products-page,.mq-solutions-page,.faq-page,.blog-page,.api-page,.terms-page,.mq-download-page,.mq-404-page,.download-guide-page,.install-guide-page,.pc-guide-page,.guide-page,.blog-online-page) .footer-top, .footer-top{ grid-template-columns:1fr; }
    }