/* ============================================================
   Polaris 课程表 · 动效版官网
   ============================================================ */

:root{
  --bg:#06070a;
  --panel:#0a0c12;
  --fg:#f4f5f7;
  --dim:rgba(244,245,247,.62);
  --dim-2:rgba(244,245,247,.38);
  --line:rgba(255,255,255,.08);
  --line-2:rgba(255,255,255,.15);

  --accent:#5eead4;
  --accent-2:#8b7bff;

  --pad:clamp(20px,5vw,64px);
  --max:1320px;
  --ease:cubic-bezier(.19,1,.22,1);
  --ease-io:cubic-bezier(.65,0,.35,1);

  --ff:"Inter","SF Pro Display",-apple-system,"Segoe UI","PingFang SC","HarmonyOS Sans SC","MiSans","Microsoft YaHei",sans-serif;
  --ff-serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Songti SC",serif;
}

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

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  background:var(--bg);
}

body{
  margin:0;
  font-family:var(--ff);
  font-size:16px;
  line-height:1.7;
  color:var(--fg);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}

@supports (overflow-x:clip){
  body{ overflow-x:clip; }
}

body.is-locked{ overflow:hidden; }

h1,h2,h3,h4,p,ul,ol,figure,blockquote{ margin:0; }
ul,ol{ padding:0; list-style:none; }
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
[id]{ scroll-margin-top:110px; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
code{ font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace; font-size:.88em; }

::selection{ background:var(--accent); color:#04060a; }

:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
  border-radius:4px;
}

.skip{
  position:fixed; top:-100px; left:16px; z-index:10000;
  padding:12px 18px; border-radius:10px;
  background:var(--fg); color:#000; font-size:14px;
  transition:top .3s;
}
.skip:focus{ top:16px; }

.wrap{
  width:100%;
  max-width:var(--max);
  margin-inline:auto;
  padding-inline:var(--pad);
}

/* 排版细化：标题避开孤字，正文避开头尾孤行，数字等宽 */
.hero__title,
.sec__title,
.hs__title,
.gd__title{ text-wrap:balance; }

.hero__lead,
.sec__lead,
.card p,
.step p,
.faq details p,
.privacy__grid p,
.guide li p,
.gd__lead{ text-wrap:pretty; }

.spec b,
.stats b,
.dl__app span{ font-variant-numeric:tabular-nums; }

/* ---------------- 背景 ---------------- */

.aurora{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  pointer-events:none;
  opacity:.85;
  transition:opacity 1s ease;
}

/* 周课表网格：7 列 = 周一至周日，作为整页的底层结构 */
.weekgrid{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:
    linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.032) 1px,transparent 1px);
  background-size:calc(100% / 7) 100%,100% 88px;
  background-position:0 0,0 var(--gy,0px);
  mask-image:radial-gradient(140% 92% at 50% 24%,#000 26%,rgba(0,0,0,.55) 62%,transparent 88%);
  -webkit-mask-image:radial-gradient(140% 92% at 50% 24%,#000 26%,rgba(0,0,0,.55) 62%,transparent 88%);
}

.grain{
  position:fixed;
  inset:-50%;
  z-index:2;
  pointer-events:none;
  opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:240px 240px;
}

.vignette{
  position:fixed;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(120% 80% at 50% 0%,transparent 30%,rgba(6,7,10,.55) 100%),
    radial-gradient(90% 60% at 50% 100%,rgba(6,7,10,.8),transparent 60%);
}

main, .nav, .footer, .marquee{ position:relative; z-index:3; }

/* ---------------- 自定义光标 ---------------- */

.cursor{
  position:fixed;
  top:0; left:0;
  z-index:9998;
  pointer-events:none;
  opacity:0;
  transition:opacity .35s;
  will-change:transform;
}
body.has-cursor .cursor{ opacity:1; }
body.has-cursor{ cursor:none; }
body.has-cursor a,
body.has-cursor button,
body.has-cursor summary{ cursor:none; }

.cursor__ring{
  position:absolute;
  top:0; left:0;
  width:34px; height:34px;
  margin:0;
  border:1px solid rgba(255,255,255,.42);
  border-radius:50%;
  transition:border-color .3s,background-color .3s,opacity .3s;
}
.cursor__dot{
  position:absolute;
  top:0; left:0;
  width:5px; height:5px;
  margin:0;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 12px var(--accent);
  transition:opacity .25s,background-color .4s;
}
.cursor.is-snap .cursor__ring{
  border-color:rgba(255,255,255,.24);
  background:rgba(255,255,255,.05);
  backdrop-filter:blur(2px);
}
.cursor.is-large .cursor__ring{
  border-color:rgba(255,255,255,.5);
  background:transparent;
  backdrop-filter:none;
}
.cursor.is-hover .cursor__dot{ opacity:0; }
.cursor.is-down .cursor__ring{ border-color:var(--accent); }

/* ---------------- 载入 ---------------- */

.loader{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:22px;
  background:var(--bg);
  transition:transform 1s var(--ease),opacity .8s .1s;
}
.loader.is-done{
  transform:translateY(-101%);
  opacity:0;
}
.loader__inner{
  display:flex;
  align-items:center;
  gap:18px;
  font-size:12px;
  letter-spacing:.34em;
  color:var(--dim);
}
.loader__brand{ color:var(--fg); }
.loader__num{
  font-variant-numeric:tabular-nums;
  letter-spacing:.1em;
  color:var(--accent);
  min-width:3ch;
  text-align:right;
}
.loader__bar{
  width:min(260px,50vw);
  height:1px;
  background:rgba(255,255,255,.12);
  overflow:hidden;
}
.loader__bar i{
  display:block;
  height:100%;
  width:0%;
  background:var(--accent);
  transition:width .25s linear;
}

/* ---------------- 滚动进度 ---------------- */

.progress{
  position:fixed;
  top:0; left:0;
  width:100%;
  height:2px;
  z-index:110;
  pointer-events:none;
}
.progress i{
  display:block;
  height:100%;
  width:100%;
  transform:scaleX(0);
  transform-origin:0 50%;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  transition:background .6s;
}

/* ---------------- 导航 ---------------- */

.nav{
  position:fixed;
  top:0; left:0;
  width:100%;
  z-index:100;
}

.nav__shell{
  position:relative;
  max-width:var(--max);
  margin-inline:auto;
  height:82px;
  padding-inline:var(--pad);
  display:flex;
  align-items:center;
  gap:24px;
  border:1px solid transparent;
  border-radius:0;
  transition:height .5s var(--ease),max-width .5s var(--ease),
             margin-top .5s var(--ease),border-radius .5s var(--ease),
             padding .5s var(--ease),background-color .5s,
             border-color .5s,box-shadow .5s,backdrop-filter .5s;
}
.nav.is-scrolled .nav__shell{
  height:60px;
  max-width:1120px;
  margin-top:12px;
  padding-inline:10px;
  border-radius:100px;
  border-color:var(--line-2);
  background:rgba(10,12,18,.72);
  backdrop-filter:blur(20px) saturate(1.5);
  -webkit-backdrop-filter:blur(20px) saturate(1.5);
  box-shadow:0 18px 50px -20px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07);
}

.brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:600;
  font-size:15px;
  letter-spacing:-.01em;
  flex:none;
  transition:padding .5s var(--ease);
}
.brand img{ border-radius:8px; }
.nav.is-scrolled .brand{ padding-left:10px; }

.nav__links{
  display:flex;
  align-items:center;
  gap:4px;
  margin-left:auto;
}
.nav__links a{
  position:relative;
  display:inline-flex;
  align-items:baseline;
  gap:6px;
  padding:9px 14px;
  font-size:13.5px;
  color:var(--dim);
  border-radius:100px;
  transition:color .3s,background-color .3s;
}
.nav__links a i{
  font-style:normal;
  font-size:9px;
  letter-spacing:.06em;
  color:var(--dim-2);
  opacity:0;
  transform:translateY(-2px);
  transition:opacity .3s,color .3s;
}
.nav__links a:hover{ color:var(--fg); background:rgba(255,255,255,.05); }
.nav__links a:hover i{ opacity:1; color:var(--accent); }
.nav__links a[aria-current="page"]{ color:var(--fg); }
.nav__links a[aria-current="page"] i{ opacity:1; color:var(--accent); }
.menu nav a[aria-current="page"]{ color:var(--accent); }

.nav__right{
  display:flex;
  align-items:center;
  gap:14px;
  flex:none;
}
.nav__src{
  position:relative;
  font-size:12.5px;
  color:var(--dim);
  transition:color .3s;
}
.nav__src::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-4px;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform .45s var(--ease);
}
.nav__src:hover::after{ transform:scaleX(1); transform-origin:left center; }
.nav__src:hover{ color:var(--fg); }

.btn:active,
.dl:active,
.tc:active{ filter:brightness(.93); }
.tc:active .tc__block{ transform:scale(1.05); }

.burger{
  display:none;
  width:40px; height:40px;
  border-radius:50%;
  border:1px solid var(--line-2);
  position:relative;
}
.burger i{
  position:absolute;
  left:50%; top:50%;
  width:14px; height:1px;
  margin-left:-7px;
  background:var(--fg);
  transition:transform .4s var(--ease),opacity .3s;
}
.burger i:first-child{ transform:translateY(-2.5px); }
.burger i:last-child{ transform:translateY(2.5px); width:9px; margin-left:-7px; }
.burger[aria-expanded="true"] i:first-child{ transform:rotate(45deg); }
.burger[aria-expanded="true"] i:last-child{ transform:rotate(-45deg); width:14px; }

/* 移动菜单 */
.menu{
  position:fixed;
  inset:0;
  z-index:99;
  padding:120px var(--pad) 40px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:rgba(6,7,10,.96);
  backdrop-filter:blur(24px);
  opacity:0;
  transition:opacity .45s ease;
}
.menu[hidden]{ display:none; }
.menu.is-open{ opacity:1; }
.menu nav{ display:flex; flex-direction:column; }
.menu nav a{
  display:flex;
  align-items:baseline;
  gap:16px;
  padding:18px 0;
  font-size:clamp(1.9rem,8vw,2.6rem);
  font-weight:600;
  letter-spacing:-.03em;
  border-bottom:1px solid var(--line);
  opacity:0;
  transform:translateY(18px);
  transition:opacity .5s var(--ease),transform .5s var(--ease);
}
.menu.is-open nav a{ opacity:1; transform:none; }
.menu nav a i{
  font-style:normal;
  font-size:11px;
  letter-spacing:.1em;
  color:var(--accent);
}
.menu__foot{
  display:flex;
  justify-content:space-between;
  gap:16px;
  font-size:12.5px;
  color:var(--dim);
}

/* ---------------- 通用按钮 / 文字链 ---------------- */

.btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:13px 22px;
  border-radius:100px;
  font-size:14px;
  font-weight:500;
  letter-spacing:.01em;
  border:1px solid var(--line-2);
  background:rgba(255,255,255,.04);
  color:var(--fg);
  overflow:hidden;
  transition:background-color .35s,border-color .35s,color .35s,box-shadow .35s;
  will-change:transform;
}
.btn::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:radial-gradient(60% 120% at 50% 120%,var(--accent),transparent 70%);
  opacity:0;
  transition:opacity .45s;
}
.btn:hover{ border-color:rgba(255,255,255,.3); }
.btn:hover::after{ opacity:.18; }
.btn span,.btn i{ position:relative; z-index:1; }
.btn i{
  font-style:normal;
  transition:transform .4s var(--ease);
}
.btn:hover i{ transform:translateY(2px); }

.btn--sm{
  padding:9px 18px;
  font-size:13px;
  background:var(--fg);
  color:#06070a;
  border-color:var(--fg);
}
.btn--sm:hover{ background:var(--accent); border-color:var(--accent); color:#04100d; }

.btn--primary{
  padding:17px 30px;
  font-size:15px;
  font-weight:600;
  background:var(--fg);
  color:#06070a;
  border-color:transparent;
  box-shadow:0 20px 46px -22px rgba(255,255,255,.45);
}
.btn--primary::after{
  background:radial-gradient(70% 140% at 50% 120%,#06070a,transparent 70%);
}
.btn--primary:hover{
  background:var(--accent);
  color:#04100d;
  box-shadow:0 26px 60px -24px var(--accent);
}

.link-arrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:14px;
  color:var(--dim);
  transition:color .3s;
  will-change:transform;
}
.link-arrow i{
  font-style:normal;
  display:grid;
  place-items:center;
  width:26px; height:26px;
  border-radius:50%;
  border:1px solid var(--line-2);
  font-size:12px;
  transition:border-color .3s,background-color .3s,color .3s,transform .4s var(--ease);
}
.link-arrow:hover{ color:var(--fg); }
.link-arrow:hover i{
  border-color:var(--accent);
  color:var(--accent);
  transform:translate(3px,0);
}

/* ---------------- 文本入场 ---------------- */

.js [data-rv]{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .9s var(--ease),transform .9s var(--ease);
  transition-delay:var(--d,0s);
}
.js [data-rv].in{ opacity:1; transform:none; }

.js [data-split-lines] .ln{
  display:block;
  overflow:hidden;
  padding:.12em 0 .16em;
  margin:-.12em 0 -.16em;
}
.js [data-split-lines] .ch{
  display:inline-block;
  transform:translateY(130%);
  transition:transform 1.05s var(--ease);
  transition-delay:var(--cd,0s);
  will-change:transform;
}
.js [data-split-lines].in .ch{ transform:translateY(0); }

/* ---------------- HERO ---------------- */

.hero{
  position:relative;
  min-height:100svh;
  display:flex;
  align-items:center;
  padding-top:clamp(108px,14vh,148px);
  padding-bottom:clamp(48px,7vh,76px);
}

.hero__inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.78fr);
  grid-template-areas:
    "copy stage"
    "spec spec";
  align-items:center;
  align-content:center;
  column-gap:clamp(28px,5vw,76px);
  row-gap:clamp(34px,6vh,60px);
}

.hero__copy{
  grid-area:copy;
  max-width:620px;
}

.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:11.5px;
  letter-spacing:.2em;
  color:var(--dim);
  text-transform:uppercase;
}
.kicker__dot{
  width:6px; height:6px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 0 var(--accent);
  animation:ping 2.6s ease-out infinite;
}
@keyframes ping{
  0%{ box-shadow:0 0 0 0 rgba(94,234,212,.5); }
  70%{ box-shadow:0 0 0 9px rgba(94,234,212,0); }
  100%{ box-shadow:0 0 0 0 rgba(94,234,212,0); }
}

.hero__title{
  margin-top:22px;
  font-size:clamp(2rem,3.4vw,3rem);
  font-weight:600;
  line-height:1.24;
  letter-spacing:-.028em;
}

.hero__lead{
  margin-top:20px;
  max-width:46ch;
  font-size:15.5px;
  line-height:1.9;
  color:var(--dim);
}

.hero__actions{
  display:flex;
  align-items:center;
  gap:22px;
  flex-wrap:wrap;
  margin-top:32px;
}

/* 舞台 */
.stage{
  grid-area:stage;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:clamp(380px,52vh,560px);
  perspective:1200px;
  z-index:1;
}
.stage__glow{
  position:absolute;
  width:118%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(94,234,212,.22),rgba(139,123,255,.14) 42%,transparent 68%);
  filter:blur(38px);
  transition:background .8s;
}
.phone{
  position:relative;
  height:clamp(330px,56vh,540px);
  width:auto;
  aspect-ratio:720/1600;
  border-radius:30px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:
    0 60px 120px -40px rgba(0,0,0,.95),
    0 0 0 8px rgba(255,255,255,.028),
    inset 0 0 0 1px rgba(255,255,255,.1);
  transform:rotate(-5.5deg);
  will-change:transform;
  z-index:2;
}
.phone img{ width:100%; height:100%; object-fit:cover; }

.fcard{
  position:absolute;
  z-index:3;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(14,17,23,.66);
  backdrop-filter:blur(16px) saturate(1.4);
  -webkit-backdrop-filter:blur(16px) saturate(1.4);
  box-shadow:0 24px 50px -18px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.12);
  animation:float 8s ease-in-out infinite;
}
@keyframes float{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-12px); }
}
.fcard--a{
  left:clamp(-20px,-2vw,0px);
  top:12%;
  padding:12px 16px 14px;
  min-width:96px;
}
.fcard--a span{
  display:block;
  font-size:10.5px;
  letter-spacing:.16em;
  color:var(--dim);
  text-transform:uppercase;
}
.fcard--a strong{
  display:flex;
  align-items:baseline;
  gap:4px;
  font-size:30px;
  font-weight:600;
  letter-spacing:-.03em;
  line-height:1.1;
  margin-top:2px;
}
.fcard--a small{ font-size:11px; font-weight:400; color:var(--dim); letter-spacing:0; }

.fcard--b{
  right:clamp(-24px,-2vw,0px);
  bottom:16%;
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  font-size:11.5px;
  color:rgba(244,245,247,.86);
  animation-delay:-3.4s;
}
.fcard__dot{
  width:6px; height:6px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 10px var(--accent);
  transition:background .6s,box-shadow .6s;
}

/* 规格行 */
.spec{
  grid-area:spec;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  margin-top:0;
  padding-top:22px;
  border-top:1px solid var(--line);
}
.spec li{ display:flex; flex-direction:column; gap:2px; }
.spec span{
  font-size:10.5px;
  letter-spacing:.16em;
  color:var(--dim-2);
  text-transform:uppercase;
}
.spec b{ font-size:13.5px; font-weight:500; }

/* ---------------- 跑马灯 ---------------- */

.marquee{
  border-block:1px solid var(--line);
  padding-block:clamp(18px,2.4vw,28px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:6px;
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.marquee__row{ display:flex; overflow:hidden; }
.marquee__track{
  display:inline-flex;
  align-items:center;
  gap:clamp(20px,3vw,40px);
  padding-right:clamp(20px,3vw,40px);
  white-space:nowrap;
  will-change:transform;
  font-size:clamp(1.5rem,3.6vw,2.9rem);
  font-weight:700;
  letter-spacing:-.025em;
  line-height:1.15;
}
.marquee__track i{
  font-style:normal;
  font-size:.34em;
  color:var(--accent);
  opacity:.8;
  transition:color .6s;
}
.marquee__row--rev .marquee__track{
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.24);
}
.marquee__row--rev .marquee__track i{
  -webkit-text-stroke:0;
  color:var(--accent-2);
  opacity:.7;
}

/* ---------------- 区块骨架 ---------------- */

.sec{
  position:relative;
  padding-block:clamp(88px,12vh,150px);
}
.sec__head{
  max-width:880px;
  margin-bottom:clamp(36px,4.8vw,68px);
}
.sec__idx{
  display:inline-flex;
  align-items:center;
  gap:11px;
  font-size:11px;
  letter-spacing:.22em;
  color:var(--dim-2);
  text-transform:uppercase;
  margin-bottom:26px;
}
.sec__idx::before{
  content:"";
  width:26px; height:1px;
  background:var(--accent);
  opacity:.8;
  transition:width .9s var(--ease) .12s,background .6s;
}
.js .sec__idx::before{ width:0; }
.js .sec__idx.in::before{ width:26px; }
.sec__idx b{
  font-family:var(--ff-serif);
  font-style:italic;
  font-weight:400;
  font-size:13px;
  letter-spacing:.02em;
  color:var(--dim);
  font-variant-numeric:tabular-nums;
}
.sec__title{
  font-size:clamp(1.8rem,2.9vw,2.5rem);
  font-weight:600;
  line-height:1.22;
  letter-spacing:-.03em;
}
.sec__lead{
  max-width:54ch;
  margin-top:24px;
  font-size:16px;
  line-height:1.85;
  color:var(--dim);
}

/* ---------------- 01 解构 ---------------- */

.decon__stage{
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(72px,9vw,132px) minmax(0,1.06fr);
  align-items:center;
  gap:clamp(16px,3vw,40px);
}

.paper{
  position:relative;
  width:100%;
  max-width:420px;
  aspect-ratio:3/4;
  padding:clamp(18px,2.2vw,26px);
  border-radius:10px;
  color:#2a2a26;
  background:linear-gradient(158deg,#f6f3ec,#e3ded2);
  box-shadow:
    0 50px 80px -40px rgba(0,0,0,.9),
    0 2px 0 rgba(255,255,255,.5) inset,
    0 -14px 30px -18px rgba(0,0,0,.25) inset;
  transform:rotate(-2.2deg);
  overflow:hidden;
}
.paper::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(120% 60% at 100% 0%,rgba(255,255,255,.7),transparent 60%);
  pointer-events:none;
}
.paper__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(0,0,0,.14);
}
.paper__title{
  display:block;
  width:42%;
  height:9px;
  border-radius:2px;
  background:rgba(0,0,0,.62);
}
.paper__meta{
  font-size:9.5px;
  letter-spacing:.02em;
  color:rgba(0,0,0,.45);
  white-space:nowrap;
}
.paper__grid{
  margin-top:14px;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  grid-template-rows:repeat(4,1fr);
  gap:5px;
  height:calc(100% - 92px);
}
.paper__grid i{
  border-radius:2px;
  background:rgba(0,0,0,.045);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.055);
}
.paper__grid .pc--1{ grid-column:2; grid-row:1/3; background:rgba(58,120,200,.34); }
.paper__grid .pc--2{ grid-column:3; grid-row:2/4; background:rgba(214,150,60,.34); }
.paper__grid .pc--3{ grid-column:4; grid-row:1/2; background:rgba(200,90,140,.3); }
.paper__grid .pc--4{ grid-column:5; grid-row:3/5; background:rgba(90,160,120,.3); }
.paper__grid .pc--5{ grid-column:1; grid-row:2/3; background:rgba(0,0,0,.08); }
.paper__grid .pc--6{ grid-column:2; grid-row:3/5; background:rgba(120,110,200,.26); }
.paper__grid .pc--7{ grid-column:4; grid-row:2/3; background:rgba(0,0,0,.07); }
.paper__grid .pc--8{ grid-column:5; grid-row:1/3; background:rgba(200,200,200,.5); }
.paper__grid .pc--9{ grid-column:3; grid-row:4/5; background:rgba(0,0,0,.05); }
.paper__foot{
  display:flex;
  gap:8px;
  margin-top:12px;
}
.paper__foot span{
  height:5px;
  border-radius:2px;
  background:rgba(0,0,0,.16);
}
.paper__foot span:first-child{ width:30%; }
.paper__foot span:last-child{ width:16%; }

.paper__scan{
  position:absolute;
  left:0; right:0;
  height:26%;
  background:linear-gradient(180deg,transparent,rgba(94,234,212,.16) 62%,rgba(94,234,212,.5));
  border-bottom:1.5px solid var(--accent);
  box-shadow:0 0 26px var(--accent);
  animation:scan 4.4s cubic-bezier(.55,0,.45,1) infinite;
  opacity:.85;
}
@keyframes scan{
  0%,8%{ top:-30%; opacity:0; }
  18%{ opacity:.9; }
  82%{ opacity:.9; }
  92%,100%{ top:100%; opacity:0; }
}

.decon__arrow{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--dim-2);
}
.decon__line{
  flex:1;
  height:1px;
  background:repeating-linear-gradient(90deg,var(--line-2) 0 4px,transparent 4px 9px);
}
.decon__arrow b{
  font-size:10.5px;
  letter-spacing:.18em;
  font-weight:500;
  color:var(--accent);
  white-space:nowrap;
  transition:color .6s;
}

.decon__out{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.out{
  position:relative;
  padding:16px 20px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(13,16,22,.66);
  backdrop-filter:blur(10px);
  transition:border-color .4s,transform .5s var(--ease),background-color .4s;
}
.out::before{
  content:"";
  position:absolute;
  left:0; top:14px; bottom:14px;
  width:2px;
  border-radius:2px;
  background:var(--oc);
}
.out:nth-child(2){ margin-left:clamp(0px,2vw,26px); }
.out:nth-child(3){ margin-left:clamp(0px,4vw,52px); }
.out b{ display:block; font-size:14.5px; font-weight:600; letter-spacing:-.01em; }
.out small{ display:block; font-size:12px; color:var(--dim); margin-top:3px; }
.out em{
  position:absolute;
  top:16px; right:18px;
  font-style:normal;
  font-size:10px;
  letter-spacing:.08em;
  color:var(--oc);
  opacity:.85;
}
.out--cyan{ --oc:#5eead4; }
.out--amber{ --oc:#ffb03a; }
.out--pink{ --oc:#ff6b9d; }
.out:hover{ border-color:var(--line-2); background:rgba(18,22,30,.8); }

.steps{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(20px,3vw,40px);
  margin-top:clamp(46px,6vw,76px);
  padding-top:clamp(28px,3vw,40px);
  border-top:1px solid var(--line);
}
.step{ display:flex; gap:14px; }
.step__n{
  font-family:var(--ff-serif);
  font-style:italic;
  font-size:14px;
  letter-spacing:.02em;
  color:var(--accent);
  padding-top:3px;
  transition:color .6s;
}
.step h3{ font-size:16px; font-weight:600; letter-spacing:-.01em; }
.step p{ margin-top:8px; font-size:13.5px; line-height:1.8; color:var(--dim); }

/* ---------------- 02 吸顶堆叠 ---------------- */

.stack{
  position:relative;
  padding-bottom:6vh;
}
.card{
  position:sticky;
  top:calc(96px + var(--i) * 16px);
  height:min(66vh,520px);
  margin-bottom:22px;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  align-items:center;
  border-radius:26px;
  border:1px solid var(--line-2);
  background:
    radial-gradient(80% 130% at 92% 8%,color-mix(in srgb,var(--c) 16%,transparent),transparent 62%),
    linear-gradient(158deg,rgba(20,23,31,.94),rgba(9,11,16,.97));
  box-shadow:
    0 40px 90px -40px rgba(0,0,0,.95),
    inset 0 1px 0 rgba(255,255,255,.07);
  overflow:hidden;
  transform-origin:50% 10%;
  will-change:transform,opacity;
}
.card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
  opacity:.035;
  pointer-events:none;
}

.card__body{ padding:clamp(26px,4vw,52px); position:relative; z-index:1; }
.card__n{
  display:inline-block;
  font-family:var(--ff-serif);
  font-style:italic;
  font-size:15px;
  letter-spacing:.02em;
  color:var(--c);
  margin-bottom:clamp(16px,3vw,34px);
}
.card h3{
  font-size:clamp(1.5rem,2.4vw,2.05rem);
  font-weight:600;
  letter-spacing:-.03em;
  line-height:1.15;
}
.card p{
  margin-top:16px;
  max-width:36ch;
  font-size:14.5px;
  line-height:1.85;
  color:var(--dim);
}

.card__art{
  position:relative;
  height:100%;
  display:grid;
  place-items:center;
  overflow:hidden;
}
.card__art::before{
  content:"";
  position:absolute;
  width:min(78%,320px);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--c) 26%,transparent),transparent 66%);
  filter:blur(24px);
  opacity:.85;
}

/* art: zero */
.art--zero{ gap:0; }
.art--zero i{
  position:absolute;
  left:22%; right:22%;
  height:1px;
  background:rgba(255,255,255,.16);
}
.art--zero i:nth-child(1){ top:38%; }
.art--zero i:nth-child(2){ top:50%; left:30%; right:30%; }
.art--zero i:nth-child(3){ top:62%; }
.art--zero b{
  position:relative;
  font-size:clamp(4.4rem,8vw,7rem);
  font-weight:300;
  letter-spacing:-.06em;
  line-height:1;
  color:var(--c);
  text-shadow:0 0 60px color-mix(in srgb,var(--c) 55%,transparent);
}

/* art: offline */
.art--offline .ring{
  width:min(52%,200px);
  aspect-ratio:1;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 0 0 14px rgba(255,255,255,.03),inset 0 0 40px color-mix(in srgb,var(--c) 30%,transparent);
}
.art--offline .core{
  position:absolute;
  width:14%;
  aspect-ratio:1;
  border-radius:50%;
  background:var(--c);
  box-shadow:0 0 34px var(--c);
}
.art--offline .slash{
  position:absolute;
  width:min(66%,250px);
  height:1.5px;
  background:rgba(255,255,255,.55);
  transform:rotate(-38deg);
}

/* art: alarm */
.art--alarm{
  align-content:center;
  gap:12px;
  padding:0 18%;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.art--alarm i{
  display:block;
  height:7px;
  width:var(--w);
  border-radius:100px;
  background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 25%,transparent));
  transform-origin:left center;
  animation:barpulse 3.6s ease-in-out infinite;
}
.art--alarm i:nth-child(2){ animation-delay:.3s; }
.art--alarm i:nth-child(3){ animation-delay:.6s; }
.art--alarm i:nth-child(4){ animation-delay:.9s; }
@keyframes barpulse{
  0%,100%{ transform:scaleX(.82); opacity:.6; }
  50%{ transform:scaleX(1); opacity:1; }
}

/* art: verify */
.art--verify .box{
  width:min(48%,180px);
  aspect-ratio:1.15;
  border-radius:16px;
  border:1px dashed rgba(255,255,255,.26);
  background:rgba(255,255,255,.02);
}
.art--verify em{
  position:absolute;
  font-style:normal;
  font-size:10px;
  letter-spacing:.24em;
  color:var(--dim-2);
  bottom:26%;
}
.art--verify b{
  position:absolute;
  right:26%;
  top:26%;
  display:grid;
  place-items:center;
  width:38px; height:38px;
  border-radius:50%;
  background:var(--c);
  color:#06070a;
  font-size:16px;
  box-shadow:0 0 30px color-mix(in srgb,var(--c) 65%,transparent);
}

/* ---------------- 03 横向 ---------------- */

.hs{ position:relative; height:340vh; }

.hs__sticky{
  position:sticky;
  top:0;
  height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:clamp(18px,2.6vw,32px);
  padding-block:clamp(72px,10vh,110px) clamp(34px,5vh,60px);
  overflow:hidden;
}
.hs__head .sec__idx{ margin-bottom:14px; }
.hs__title{
  font-size:clamp(1.8rem,2.9vw,2.5rem);
  font-weight:600;
  line-height:1.2;
  letter-spacing:-.03em;
}
.hs__lead{
  margin-top:12px;
  font-size:14px;
  color:var(--dim);
}

.hs__track{
  display:flex;
  align-items:flex-start;
  gap:clamp(16px,2.2vw,30px);
  padding-left:max(var(--pad),calc((100% - var(--max)) / 2 + var(--pad)));
  padding-right:var(--pad);
  will-change:transform;
}

.shot{
  flex:none;
  margin:0;
  border-radius:18px;
  overflow:hidden;
  border:1px solid var(--line-2);
  background:var(--panel);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.9);
  transition:border-color .4s,transform .6s var(--ease);
}
.shot img{ height:100%; width:auto; object-fit:cover; }
.shot--phone img{ height:min(44vh,380px); }
.shot--pad img{ height:min(34vh,300px); }
.shot figcaption{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px 16px;
  border-top:1px solid var(--line);
  font-size:11.5px;
  color:var(--dim);
}
.shot figcaption b{ font-weight:500; color:var(--fg); }
.shot:hover{ border-color:rgba(255,255,255,.3); }
.shot:hover img{ transform:scale(1.015); }
.shot img{ transition:transform .8s var(--ease); }

.hs__meta{
  display:flex;
  align-items:center;
  gap:20px;
  font-size:11px;
  letter-spacing:.14em;
  color:var(--dim-2);
}
.hs__count{ display:flex; align-items:baseline; gap:6px; letter-spacing:.06em; }
.hs__count b{
  font-family:var(--ff-serif);
  font-style:italic;
  font-size:15px;
  color:var(--fg);
  font-weight:400;
  font-variant-numeric:tabular-nums;
}
.hs__count i{ font-style:normal; }
.hs__bar{
  flex:1;
  height:1px;
  background:rgba(255,255,255,.12);
  overflow:hidden;
}
.hs__bar i{
  display:block;
  height:100%;
  width:100%;
  transform:scaleX(0);
  transform-origin:0 50%;
  background:var(--accent);
  transition:background .6s;
}
.hs__hint{ flex:none; }

/* ---------------- 04 主题 ---------------- */

.themes{
  display:flex;
  gap:clamp(10px,1.2vw,16px);
  height:clamp(300px,42vh,430px);
}
.tc{
  position:relative;
  flex:1 1 0;
  min-width:0;
  border-radius:22px;
  border:1px solid var(--line);
  overflow:hidden;
  text-align:left;
  padding:0;
  transition:flex-grow .7s var(--ease),border-color .4s;
  will-change:flex-grow;
}
.tc:hover,.tc:focus-visible{ flex-grow:1.75; border-color:var(--line-2); }

.tc__block{
  position:absolute;
  inset:0;
  transition:transform .9s var(--ease);
}
.tc:hover .tc__block{ transform:scale(1.03); }

.tc[data-theme="light"] .tc__block{
  background:linear-gradient(158deg,#f7f4ee,#ded9cd 60%,#cfc9ba);
}
.tc[data-theme="aurora"] .tc__block{
  background:
    radial-gradient(70% 60% at 20% 12%,rgba(94,234,212,.85),transparent 62%),
    radial-gradient(80% 70% at 86% 80%,rgba(139,123,255,.9),transparent 60%),
    linear-gradient(158deg,#0d2630,#141334 60%,#0a0a12);
}
.tc[data-theme="space"] .tc__block{
  background:
    radial-gradient(60% 50% at 76% 18%,rgba(120,140,255,.55),transparent 62%),
    radial-gradient(80% 70% at 18% 88%,rgba(94,60,180,.75),transparent 60%),
    linear-gradient(158deg,#070b22,#130f33 60%,#04050c);
}
.tc[data-theme="campus"] .tc__block{
  background:
    radial-gradient(70% 60% at 24% 16%,rgba(255,176,58,.55),transparent 60%),
    radial-gradient(80% 70% at 84% 84%,rgba(120,170,120,.5),transparent 62%),
    linear-gradient(158deg,#1f2a22,#2e2718 60%,#0c0b08);
}
.tc::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 40%,rgba(4,6,10,.82));
  pointer-events:none;
}
.tc[data-theme="light"]::after{
  background:linear-gradient(180deg,transparent 45%,rgba(60,56,46,.55));
}

.tc__meta{
  position:absolute;
  left:22px; bottom:20px;
  z-index:2;
  display:flex;
  flex-direction:column;
  gap:2px;
  color:#fff;
}
.tc__meta b{ font-size:15.5px; font-weight:600; letter-spacing:-.01em; }
.tc__meta small{
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  opacity:.6;
}
.tc[data-theme="light"] .tc__meta{ color:#1c1b17; }

.tc__mini{
  position:absolute;
  top:20px; right:20px;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,14px);
  grid-template-rows:repeat(2,20px);
  gap:4px;
  opacity:.55;
  transition:opacity .5s,transform .7s var(--ease);
}
.tc:hover .tc__mini{ opacity:.95; transform:translateY(2px); }
.tc__mini i{ border-radius:3px; background:rgba(255,255,255,.35); }
.tc[data-theme="light"] .tc__mini i{ background:rgba(0,0,0,.22); }
.tc__mini i:nth-child(1){ background:rgba(94,234,212,.85); }
.tc__mini i:nth-child(3){ background:rgba(255,176,58,.85); }
.tc__mini i:nth-child(5){ background:rgba(139,123,255,.85); }

.tc[aria-pressed="true"]{
  border-color:var(--accent);
  box-shadow:0 0 0 1px var(--accent),0 30px 70px -40px var(--accent);
}

.themes__now{
  margin-top:22px;
  font-size:12px;
  letter-spacing:.1em;
  color:var(--dim-2);
}
.themes__now b{
  color:var(--accent);
  font-weight:500;
  transition:color .6s;
}

/* ---------------- 05 隐私 ---------------- */

.sec--privacy{ padding-block:clamp(84px,12vh,150px); }
.privacy__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(28px,5vw,70px);
  align-items:end;
  margin-top:clamp(34px,5vw,60px);
  padding-bottom:clamp(28px,4vw,44px);
  border-bottom:1px solid var(--line);
  margin-bottom:26px;
}
.privacy__grid p{
  max-width:42ch;
  font-size:15.5px;
  line-height:1.9;
  color:var(--dim);
}
.stats{
  display:flex;
  gap:clamp(20px,4vw,50px);
}
.stats li{ display:flex; flex-direction:column; gap:2px; }
.stats b{
  font-size:clamp(1.9rem,3.2vw,2.6rem);
  font-weight:300;
  letter-spacing:-.04em;
  line-height:1;
  color:var(--accent);
  transition:color .6s;
  font-variant-numeric:tabular-nums;
}
.stats span{ font-size:11.5px; color:var(--dim-2); letter-spacing:.06em; }

/* ---------------- 06 下载 ---------------- */

.sec--download{ padding-top:clamp(100px,15vh,180px); }
.sec--themes{ padding-bottom:clamp(100px,15vh,180px); }
#faq{ padding-block:clamp(64px,9vh,104px) clamp(90px,13vh,150px); }

.dl{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:clamp(18px,2.6vw,30px);
  padding:clamp(26px,3.4vw,44px) clamp(24px,3.2vw,44px);
  border-radius:22px;
  border:1px solid var(--line-2);
  background:linear-gradient(158deg,rgba(20,23,31,.9),rgba(9,11,16,.94));
  transition:border-color .4s,background-color .4s,box-shadow .5s;
  will-change:transform;
}
.dl:hover{
  border-color:rgba(255,255,255,.34);
  box-shadow:
    0 44px 90px -44px rgba(0,0,0,.95),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 0 1px color-mix(in srgb,var(--accent) 20%,transparent);
}
.dl__badge{
  display:grid;
  place-items:center;
  width:clamp(50px,4.6vw,64px);
  aspect-ratio:1;
  border-radius:16px;
  border:1px solid var(--line-2);
  background:rgba(255,255,255,.05);
  font-size:clamp(19px,1.8vw,22px);
  font-weight:500;
  transition:background-color .4s,color .4s,border-color .4s;
}
.dl:hover .dl__badge{
  background:var(--accent);
  color:#04100d;
  border-color:var(--accent);
}
.dl__copy b{
  display:block;
  font-size:clamp(1.28rem,2.5vw,1.9rem);
  font-weight:600;
  letter-spacing:-.03em;
  line-height:1.2;
}
.dl__copy small{
  display:block;
  margin-top:4px;
  font-size:12.5px;
  color:var(--dim);
}
.dl__arw{
  font-size:22px;
  color:var(--dim);
  transition:transform .5s var(--ease),color .4s;
}
.dl:hover .dl__arw{ transform:translateY(4px); color:var(--accent); }

.dl--mirror{
  margin-top:12px;
  padding-block:clamp(16px,2vw,22px);
  background:rgba(255,255,255,.022);
}
.dl--mirror .dl__copy b{ font-size:clamp(1rem,1.5vw,1.15rem); }
.dl--mirror .dl__badge{ width:clamp(38px,3.4vw,44px); font-size:15px; border-radius:11px; }
.dl--mirror:hover .dl__arw{ transform:translate(3px,-3px); }

.dl__spec{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
  margin-top:clamp(24px,3vw,34px);
  padding-top:clamp(20px,2.4vw,26px);
  border-top:1px solid var(--line);
}
.dl__app{ display:flex; align-items:center; gap:14px; }
.dl__app img{ border-radius:11px; }
.dl__app div{ display:flex; flex-direction:column; }
.dl__app strong{ font-size:14px; font-weight:600; }
.dl__app span{ font-size:11.5px; color:var(--dim-2); }
.dl__spec p{ font-size:12.5px; color:var(--dim); max-width:52ch; }
.dl__spec a{ color:var(--fg); border-bottom:1px solid var(--line-2); }

.guide{
  margin-top:clamp(44px,6vw,70px);
  padding-top:clamp(26px,3vw,36px);
  border-top:1px solid var(--line);
}
.guide__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
  margin-bottom:24px;
}
.guide h3{
  font-size:clamp(1.05rem,1.7vw,1.3rem);
  font-weight:600;
  letter-spacing:-.02em;
}
.guide ol{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(18px,2.6vw,34px);
}
.guide li{ display:flex; gap:12px; }
.guide li > span{
  flex:none;
  display:grid;
  place-items:center;
  width:22px; height:22px;
  border-radius:50%;
  border:1px solid var(--line-2);
  font-size:10.5px;
  color:var(--accent);
  transition:color .6s,border-color .4s;
}
.guide li b{ display:block; font-size:13.5px; font-weight:500; }
.guide li p{ margin-top:4px; font-size:12.5px; line-height:1.8; color:var(--dim); }
.guide code{
  padding:1px 5px;
  border-radius:4px;
  background:rgba(255,255,255,.07);
  color:var(--fg);
}

/* ---------------- 07 FAQ ---------------- */

.faq{ border-top:1px solid var(--line); }
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:clamp(20px,2.6vw,28px) 0;
  font-size:clamp(1rem,1.6vw,1.2rem);
  font-weight:500;
  letter-spacing:-.015em;
  list-style:none;
  transition:color .3s;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary:hover{ color:var(--accent); }
.faq summary i{
  position:relative;
  flex:none;
  width:16px; height:16px;
}
.faq summary i::before,
.faq summary i::after{
  content:"";
  position:absolute;
  left:0; top:50%;
  width:100%; height:1px;
  background:currentColor;
  transition:transform .4s var(--ease),opacity .3s;
}
.faq summary i::after{ transform:rotate(90deg); }
.faq details[open] summary i::after{ transform:rotate(0deg); opacity:0; }
.faq details p{
  max-width:72ch;
  padding-bottom:clamp(20px,2.6vw,28px);
  font-size:14px;
  line-height:1.9;
  color:var(--dim);
}

/* ---------------- 页脚 ---------------- */

.footer{
  position:relative;
  padding-top:clamp(60px,8vh,100px);
  padding-bottom:clamp(28px,4vw,44px);
  border-top:1px solid var(--line);
  overflow:hidden;
}
.footer__word{
  display:flex;
  justify-content:space-between;
  font-size:clamp(2.4rem,7.6vw,6.4rem);
  font-weight:800;
  line-height:.82;
  letter-spacing:-.055em;
  margin-bottom:clamp(30px,5vw,60px);
  user-select:none;
}
.footer__word span{
  display:inline-block;
  color:rgba(255,255,255,.085);
  transition:color .5s,transform .5s var(--ease);
  will-change:transform;
}
.footer__row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
  padding-block:26px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.footer__links{ display:flex; gap:clamp(14px,2.4vw,30px); flex-wrap:wrap; }
.footer__links a{
  position:relative;
  font-size:13px;
  color:var(--dim);
  transition:color .3s;
  will-change:transform;
}
.footer__links a::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-4px;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform .45s var(--ease);
}
.footer__links a:hover::after{
  transform:scaleX(1);
  transform-origin:left center;
}
.footer__links a:hover{ color:var(--fg); }
.to-top{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12.5px;
  color:var(--dim);
  will-change:transform;
}
.to-top i{ font-style:normal; transition:transform .4s var(--ease); }
.to-top:hover{ color:var(--fg); }
.to-top:hover i{ transform:translateY(-3px); }

.footer__bottom{
  display:flex;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
  padding-top:22px;
  font-size:11.5px;
  color:var(--dim-2);
  letter-spacing:.02em;
}

/* ---------------- 图解子页 ---------------- */

.gd{
  max-width:1000px;
  margin-inline:auto;
  padding-top:clamp(110px,14vh,150px);
  padding-bottom:clamp(56px,9vh,100px);
}
.gd__back{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12.5px;
  color:var(--dim);
  margin-bottom:clamp(24px,4vw,38px);
  transition:color .3s;
}
.gd__back i{ font-style:normal; transition:transform .4s var(--ease); }
.gd__back:hover{ color:var(--fg); }
.gd__back:hover i{ transform:translateX(-3px); }

.gd__title{
  font-size:clamp(1.7rem,2.9vw,2.35rem);
  font-weight:600;
  line-height:1.24;
  letter-spacing:-.03em;
}
.gd__lead{
  margin-top:14px;
  max-width:56ch;
  font-size:14.5px;
  line-height:1.9;
  color:var(--dim);
}

.gd__figs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(14px,2.4vw,26px);
  margin-top:clamp(28px,4.4vw,48px);
}
.gd figure{
  margin:0;
  border-radius:16px;
  overflow:hidden;
  border:1px solid var(--line);
  background:rgba(255,255,255,.02);
  transition:border-color .4s;
}
.gd figure:hover{ border-color:var(--line-2); }
.gd figure img{ width:100%; height:auto; }
.gd figcaption{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:13px 16px;
  border-top:1px solid var(--line);
  font-size:12px;
  color:var(--dim);
}
.gd figcaption b{ font-weight:500; color:var(--fg); }

.gd .guide{ margin-top:clamp(34px,5vw,54px); }

/* ---------------- 响应式 ---------------- */

@media (max-height:780px) and (min-width:1081px){
  .hero{ padding-top:96px; padding-bottom:40px; }
  .phone{ height:clamp(300px,52vh,460px); }
  .stage{ min-height:320px; }
  .hero__lead{ margin-top:16px; }
  .hero__actions{ margin-top:24px; }
}

@media (max-width:1080px){
  .nav__links{ display:none; }
  .nav__src{ display:none; }
  .burger{ display:block; }
  .nav__right{ margin-left:auto; }

  .hero__inner{
    grid-template-columns:1fr;
    grid-template-areas:
      "copy"
      "stage"
      "spec";
    justify-items:start;
  }
  .hero__copy{ max-width:none; }
  .stage{
    width:100%;
    margin-top:clamp(30px,5vw,48px);
    min-height:auto;
  }
  .phone{ height:clamp(320px,46vh,420px); }
  .fcard--a{ left:4%; top:6%; }
  .fcard--b{ right:4%; bottom:10%; }

  .decon__stage{
    grid-template-columns:1fr;
    gap:clamp(20px,4vw,32px);
  }
  .paper{ max-width:360px; margin-inline:auto; }
  .decon__arrow{ justify-content:center; }
  .decon__arrow .decon__line{ flex:none; width:min(28%,80px); }
  .out:nth-child(2),.out:nth-child(3){ margin-left:0; }

  .steps{ grid-template-columns:1fr; gap:22px; }
  .guide ol{ grid-template-columns:1fr; }
  .gd__figs{ grid-template-columns:1fr; }
  .card{ height:auto; min-height:min(52vh,380px); }
}

@media (max-width:780px){
  .nav__shell{ height:68px; }
  .hero__title{ font-size:clamp(1.8rem,6.6vw,2.35rem); }
  .spec{ grid-template-columns:repeat(2,1fr); gap:16px 20px; }
  .card{
    grid-template-columns:1fr;
    grid-template-rows:auto minmax(120px,1fr);
    top:calc(74px + var(--i) * 12px);
  }
  .card__art{ min-height:140px; order:-1; }
  .card__art::before{ width:190px; }
  .card__body{ padding:22px 24px 28px; }
  .card p{ max-width:none; }
  .themes{ flex-direction:column; height:auto; }
  .tc{ height:130px; flex:none; }
  .tc:hover,.tc:focus-visible{ flex-grow:0; }
  .tc__mini{ grid-template-columns:repeat(3,12px); grid-template-rows:repeat(2,16px); }
  .privacy__grid{ grid-template-columns:1fr; align-items:start; }
  .hs{ height:auto; }
  .hs__sticky{
    position:static;
    height:auto;
    padding-block:clamp(56px,9vh,90px);
    overflow:visible;
    gap:22px;
  }
  .hs__track{
    transform:none !important;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    padding-bottom:14px;
    scrollbar-width:none;
  }
  .hs__track::-webkit-scrollbar{ display:none; }
  .shot{ scroll-snap-align:center; }
  .hs__meta{ display:none; }
  .hs__track{ gap:14px; }
  .shot--phone img{ height:min(44vh,340px); }
  .shot--pad img{ height:min(30vh,240px); }
  .footer__row{ justify-content:flex-start; }
  .to-top{ margin-left:0; }
  .dl{ grid-template-columns:auto 1fr; }
  .dl__arw{ display:none; }
}

/* ---------------- 减少动效 ---------------- */

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .js [data-rv],
  .js [data-split-lines] .ch{ opacity:1 !important; transform:none !important; }
  .aurora{ opacity:.5; }
  .paper__scan{ display:none; }
}