
:root{
  /* 暖铜遗迹首屏 */
  --night:#2B1E18;
  --bronze:#463122;
  --smoke:#7D4E3E;
  --ember:#C98A5E;
  --core:#F4C287;
  --gold:#C99B5F;
  --ondark:#F4EADA;
  --ondark-2:rgba(244,234,218,.78);
  --ondark-3:rgba(244,234,218,.55);
  /* 正文羊皮纸 */
  --paper:#F4EADA;
  --paper-2:#ECDFC9;
  --card:#FBF4E7;
  --ink:#3A2C22;
  --ink-2:#79654F;
  --ink-soft:#A08A70;
  --accent:#B85C3F;
  --accent-deep:#96482F;
  --halo:#DFA778;
  --amber:#A8702C;
  --line:rgba(58,44,34,.14);
  --shadow:0 14px 34px rgba(107,70,40,.12);
  --radius:18px;
  --lattice:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='26' height='26'><rect x='9.6' y='9.6' width='6.8' height='6.8' rx='1' transform='rotate(45 13 13)' fill='none' stroke='%23B85C3F' stroke-opacity='.09'/></svg>");
  --chain:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='10'><path d='M0 5h10' stroke='%23B85C3F' stroke-opacity='.4' stroke-width='1'/><rect x='12.2' y='2.2' width='5.6' height='5.6' rx='1' transform='rotate(45 15 5)' fill='none' stroke='%23B85C3F' stroke-opacity='.55' stroke-width='1'/><path d='M20 5h10' stroke='%23B85C3F' stroke-opacity='.4' stroke-width='1'/></svg>");
  --chain-d:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='10'><path d='M0 5h10' stroke='%23C99B5F' stroke-opacity='.5' stroke-width='1'/><rect x='12.2' y='2.2' width='5.6' height='5.6' rx='1' transform='rotate(45 15 5)' fill='none' stroke='%23C99B5F' stroke-opacity='.7' stroke-width='1'/><path d='M20 5h10' stroke='%23C99B5F' stroke-opacity='.5' stroke-width='1'/></svg>");
  --font:"HarmonyOS Sans SC","Source Han Sans SC","Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--font);color:var(--ink);background:var(--paper);
  font-size:16px;line-height:1.85;-webkit-font-smoothing:antialiased;
}
a{color:var(--accent);text-decoration:none}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:8px}
b{font-weight:600}
section{scroll-margin-top:84px}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:8px 16px;z-index:99}
.skip:focus{left:12px;top:12px}
.nowrap{white-space:nowrap;display:inline-block}

/* 菱标母题 */
.dia::before{
  content:"";width:6px;height:6px;flex:none;
  background:linear-gradient(135deg,var(--accent),var(--halo));
  transform:rotate(45deg);border-radius:1px;
}
/* 菱链纹样带 */
.chain{height:10px;background-image:var(--chain);background-repeat:repeat-x;animation:chainflow 46s linear infinite}
@keyframes chainflow{to{background-position-x:600px}}

/* ═ 顶栏：暖雾透明起步，滚过首屏转羊皮纸 ═ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:50;
  transition:background .35s,box-shadow .35s,border-color .35s;
  border-bottom:1px solid transparent;
}
.nav .logo,.nav .nav-links a{color:var(--ondark);transition:color .35s}
.nav .nav-links a{color:var(--ondark-2)}
.nav .btn-ghost{border-color:rgba(244,234,218,.4);color:var(--ondark)}
.nav.scrolled{
  background:rgba(244,234,218,.88);
  backdrop-filter:blur(14px) saturate(1.1);
  -webkit-backdrop-filter:blur(14px) saturate(1.1);
  border-bottom-color:var(--line);
  box-shadow:0 6px 24px rgba(107,70,40,.10);
}
.nav.scrolled .logo{color:var(--ink)}
.nav.scrolled .nav-links a{color:var(--ink-2)}
.nav.scrolled .nav-links a:hover{color:var(--ink)}
.nav.scrolled .btn-ghost{border-color:rgba(58,44,34,.3);color:var(--ink)}
.nav-inner{max-width:1060px;margin:0 auto;padding:0 24px;height:64px;display:flex;align-items:center;gap:26px}
.logo{display:inline-flex;align-items:center;gap:9px;font-size:18px;font-weight:600;letter-spacing:.12em}
.logo::before{content:"";width:9px;height:9px;background:linear-gradient(135deg,var(--gold),var(--ember));transform:rotate(45deg);border-radius:1.5px;box-shadow:3px 3px 0 rgba(201,155,95,.35)}
.nav-links{display:flex;gap:24px;margin-left:auto}
.nav-links a{font-size:15px}

/* ═ 按钮 ═ */
.btn{
  display:inline-block;border-radius:999px;font-size:15px;
  padding:13px 30px;border:1px solid transparent;cursor:pointer;
  transition:transform .18s,box-shadow .25s,background .2s,border-color .2s;
  text-align:center;position:relative;overflow:hidden;
}
.btn::after{ /* 短促流光 */
  content:"";position:absolute;top:0;bottom:0;left:-45%;width:34%;
  background:linear-gradient(105deg,transparent,rgba(255,244,226,.6),transparent);
  transform:skewX(-20deg);transition:left .55s ease;pointer-events:none;
}
.btn:hover::after{left:120%}
.btn-primary{background:var(--accent);color:#FFF6EA;font-weight:600}
.btn-primary:hover{box-shadow:0 0 0 5px rgba(223,167,120,.3),0 12px 26px rgba(150,72,47,.36);transform:translateY(-1px)}
.btn-primary:active{background:var(--accent-deep);transform:scale(.98);box-shadow:none}
.btn-ghost{border-color:rgba(59,46,51,.28);color:var(--ink)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent-deep);transform:translateY(-1px)}
.btn-ghost:active{transform:scale(.98)}
.btn-sm{padding:7px 16px;font-size:13px}
.link-cta{font-size:15px;color:var(--ink-2);align-self:center;transition:color .2s}
.link-cta:hover{color:var(--accent)}
.link-cta .arr{display:inline-block;transition:transform .2s}
.link-cta:hover .arr{transform:translateX(4px)}

/* ═══ 首屏 · 拂晓遗迹之门 ═══ */
.hero{
  position:relative;min-height:100svh;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:112px 24px 110px;color:var(--ondark);
  background:
    radial-gradient(50% 44% at 22% 26%, rgba(147,102,218,.42), transparent 62%),
    radial-gradient(44% 40% at 78% 20%, rgba(170,80,160,.34), transparent 60%),
    radial-gradient(52% 46% at 50% 58%, rgba(120,70,180,.26), transparent 62%),
    radial-gradient(40% 34% at 50% 12%, rgba(201,155,95,.22), transparent 55%),
    radial-gradient(100% 60% at 50% 112%, rgba(244,234,218,.95), transparent 62%),
    linear-gradient(180deg, #322C48 0%, #3A3458 26%, #463E68 48%, #5C5078 66%, #756788 80%, #9488A0 90%, #C4B0A6 95%, #F4EADA 100%);
}
.scene{position:absolute;inset:0;z-index:1;pointer-events:none}
.wake{position:absolute;inset:0;background:var(--night);opacity:.75;animation:wake 1.4s ease .1s forwards}
@keyframes wake{to{opacity:0}}
.spokes{
  position:absolute;left:50%;top:30%;width:1400px;height:1400px;transform:translate(-50%,-50%);
  background:repeating-conic-gradient(rgba(201,155,95,.14) 0 .35deg,transparent .35deg 15deg);
  -webkit-mask:radial-gradient(closest-side,#000 20%,transparent 68%);
  mask:radial-gradient(closest-side,#000 20%,transparent 68%);
  opacity:.5;border-radius:50%;
}
.rim{position:absolute;left:50%;border-radius:50%;transform:translateX(-50%)}
.rim-1{width:170vw;height:170vw;top:19%;border:1px solid rgba(201,155,95,.22)}
.rim-2{width:150vw;height:150vw;top:24%;border:1px solid rgba(201,155,95,.12)}
.rim-3{width:190vw;height:190vw;top:15%;border:2px solid rgba(125,78,62,.28)}
.pillar{
  position:absolute;bottom:14%;width:90px;height:52%;
  background:linear-gradient(180deg,transparent,rgba(223,167,120,.16) 45%,rgba(223,167,120,.05));
  transform:skewX(-4deg);animation:sway 14s ease-in-out infinite alternate;
}
.pillar-1{left:16%}
.pillar-2{left:47%;height:64%;width:120px;opacity:.85;animation-duration:18s;animation-direction:alternate-reverse}
.pillar-3{right:14%;height:44%;opacity:.7;animation-duration:16s}
@keyframes sway{from{transform:skewX(-4deg) translateX(-8px)}to{transform:skewX(-3deg) translateX(8px)}}
.device{position:absolute;left:50%;top:0%;width:700px;height:700px;transform:translateX(-50%) rotate(-3deg)}
.device i{position:absolute;border-radius:50%;display:block}
@keyframes awk{to{opacity:1}}
@keyframes cal{from{opacity:0;transform:rotate(-16deg)}to{opacity:1;transform:rotate(0deg)}}
.sun{inset:150px;background:radial-gradient(closest-side,rgba(244,194,135,.55) 0%,rgba(223,167,120,.32) 30%,rgba(201,155,95,.18) 50%,rgba(201,155,95,.10) 68%,rgba(201,155,95,.04) 84%,transparent 100%);opacity:0;animation:ignite 1.1s ease .9s forwards,breathe 9s ease-in-out 2s infinite}
@keyframes ignite{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:scale(1)}}
@keyframes breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
.seal{
  position:absolute;inset:236px;border-radius:10px;
  border:1.5px solid rgba(244,234,218,.55);transform:rotate(45deg);
  box-shadow:0 0 24px rgba(244,194,135,.35),inset 0 0 18px rgba(244,194,135,.2);
  opacity:0;animation:awk .8s ease 1s forwards;
}
.seal::after{content:"";position:absolute;inset:14px;border-radius:6px;border:1px solid rgba(201,155,95,.45)}
.r-core{inset:214px;border:1px solid rgba(244,234,218,.4);opacity:0;animation:awk .9s ease .55s forwards}
.r-script-a{
  inset:150px;
  background:repeating-conic-gradient(rgba(201,155,95,.55) 0 .8deg,transparent .8deg 7deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 10px),#000 calc(100% - 9px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 10px),#000 calc(100% - 9px));
  animation:cal 1.2s cubic-bezier(.2,.7,.25,1) .35s forwards,spin 110s linear 2s infinite;opacity:0;
}
.r-script-b{
  inset:150px;
  background:repeating-conic-gradient(rgba(244,234,218,.4) 0 .5deg,transparent .5deg 11deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 16px),#000 calc(100% - 15px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 16px),#000 calc(100% - 15px));
  animation:cal 1.2s cubic-bezier(.2,.7,.25,1) .45s forwards,spin 150s linear 2s infinite reverse;opacity:0;
}
.r-sheen{
  inset:150px;
  background:conic-gradient(from 0deg,transparent 0 330deg,rgba(244,194,135,.6) 348deg,transparent 360deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 14px),#000 calc(100% - 13px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 14px),#000 calc(100% - 13px));
  animation:awk .9s ease .8s forwards,spin 26s linear 2s infinite;opacity:0;
}
.r-frac1,.r-frac2,.r-frac3{border:1.5px solid transparent;opacity:0}
.r-frac1{inset:96px;border-top-color:rgba(201,155,95,.5);border-right-color:rgba(201,155,95,.18);animation:frac1 1.3s cubic-bezier(.2,.7,.25,1) .5s forwards,spin 64s linear 2.2s infinite}
.r-frac2{inset:64px;border-bottom-color:rgba(125,78,62,.6);border-left-color:rgba(125,78,62,.22);animation:frac2 1.3s cubic-bezier(.2,.7,.25,1) .62s forwards,spin 88s linear 2.2s infinite reverse}
.r-frac3{inset:118px;border-left-color:rgba(244,234,218,.35);animation:frac3 1.3s cubic-bezier(.2,.7,.25,1) .74s forwards,spin 74s linear 2.2s infinite}
@keyframes frac1{from{opacity:0;transform:rotate(24deg)}to{opacity:1;transform:rotate(0)}}
@keyframes frac2{from{opacity:0;transform:rotate(-30deg)}to{opacity:1;transform:rotate(0)}}
@keyframes frac3{from{opacity:0;transform:rotate(14deg) translateY(4px)}to{opacity:1;transform:rotate(0) translateY(0)}}
.r-card{inset:34px;animation:cal 1.2s ease .5s forwards,spin 160s linear 2s infinite reverse;opacity:0}
.r-card s{position:absolute;width:8px;height:8px;border-radius:1px;background:linear-gradient(135deg,var(--gold),var(--core));box-shadow:0 0 12px rgba(244,194,135,.9)}
.r-card s:nth-child(1){left:50%;top:-4px;margin-left:-4px;transform:rotate(45deg)}
.r-card s:nth-child(2){left:6.7%;top:75%;margin-left:-4px;margin-top:-4px;transform:rotate(45deg)}
.r-card s:nth-child(3){left:93.3%;top:75%;margin-left:-4px;margin-top:-4px;transform:rotate(45deg)}
.r-orb{inset:120px;border:1px dashed rgba(201,155,95,.3);animation:awk .8s ease .7s forwards,spin 96s linear 2s infinite;opacity:0}
.sat{position:absolute;left:50%;top:-4px;width:8px;height:8px;margin-left:-4px;border-radius:1px;background:linear-gradient(135deg,#FFF0DA,var(--core));transform:rotate(45deg);box-shadow:0 0 14px rgba(244,194,135,1)}
.r-outer{inset:2px;border:1px solid rgba(201,155,95,.16);animation:awk 1s ease .3s forwards;opacity:0}
@keyframes spin{to{transform:rotate(360deg)}}
.glyph{position:absolute;opacity:0;animation:awk 1s ease forwards}.glyph svg{display:block}.g1{left:13%;top:33%;animation-delay:1.1s}.g2{right:11%;top:26%;animation-delay:1.25s;transform:rotate(8deg)}.g3{right:20%;top:56%;animation-delay:1.4s;transform:rotate(-6deg)}.g4{left:22%;top:16%;animation-delay:1.3s;transform:rotate(-10deg)}
.dots{position:absolute;width:190px;height:150px;background-image:radial-gradient(rgba(201,155,95,.65) 1px,transparent 1.7px);background-size:15px 15px;-webkit-mask:radial-gradient(closest-side,#000,transparent);mask:radial-gradient(closest-side,#000,transparent);opacity:0;animation:dotwake 1.6s ease .8s forwards,twinkle 6s ease-in-out 3s infinite alternate}
@keyframes dotwake{0%{opacity:0}30%{opacity:.75}45%{opacity:.15}65%{opacity:.6}100%{opacity:.4}}
@keyframes twinkle{0%{opacity:.28}50%{opacity:.55}100%{opacity:.35}}
.dots-l{left:7%;top:44%}.dots-r{right:6%;top:38%;animation-delay:1s,3.4s;width:150px;height:120px}
.frag{position:absolute;border-radius:2px;border:1.5px solid rgba(201,155,95,.55);transform:rotate(45deg);animation:fragdrift ease-in-out infinite alternate}
.frag-1{width:11px;height:11px;left:30%;top:22%;animation-duration:22s}.frag-2{width:8px;height:8px;right:29%;top:18%;border-color:rgba(244,194,135,.7);animation-duration:27s}.frag-3{width:7px;height:7px;right:33%;top:52%;animation-duration:19s}.frag-4{width:14px;height:5px;left:24%;top:47%;transform:rotate(24deg);border-color:rgba(125,78,62,.6);animation-duration:24s}.frag-5{width:5px;height:14px;left:56%;top:9%;transform:rotate(60deg);animation-duration:29s}
@keyframes fragdrift{from{translate:0 -10px}to{translate:6px 10px}}
.mote{position:absolute;width:4px;height:4px;border-radius:50%;background:rgba(255,240,218,.95);box-shadow:0 0 9px rgba(244,194,135,.9);animation:rise ease-in-out infinite;opacity:0}
@keyframes rise{0%{transform:translateY(16px);opacity:0}25%{opacity:.5}50%{transform:translateY(0);opacity:.34}75%{opacity:.14}100%{transform:translateY(-12px);opacity:0}}
.m1{left:14%;bottom:24%;animation-duration:16s}.m2{left:25%;bottom:17%;animation-duration:21s;animation-delay:3s}.m3{left:37%;bottom:28%;animation-duration:18s;animation-delay:7s;width:3px;height:3px}.m4{left:57%;bottom:21%;animation-duration:23s;animation-delay:2s}.m5{left:69%;bottom:30%;animation-duration:17s;animation-delay:9s;width:3px;height:3px}.m6{left:82%;bottom:19%;animation-duration:20s;animation-delay:5s}.m7{left:47%;bottom:13%;animation-duration:25s;animation-delay:11s}.m8{left:8%;bottom:36%;animation-duration:22s;animation-delay:6s;width:3px;height:3px}
.h-chain{position:absolute;left:50%;transform:translateX(-50%);opacity:.6}.h-chain-1{top:64.5%;width:58%}.h-chain-2{top:69%;width:40%;opacity:.4;animation-direction:reverse;animation-duration:60s}
.sea{position:absolute;border-radius:50%;filter:blur(40px)}
.sea-1{width:1000px;height:300px;left:-14%;bottom:-8%;background:radial-gradient(closest-side,rgba(251,244,231,.95),transparent);animation:seaflow 42s ease-in-out infinite alternate,seabreathe 6.5s ease-in-out infinite}
.sea-2{width:820px;height:250px;right:-16%;bottom:-10%;background:radial-gradient(closest-side,rgba(236,201,164,.85),transparent);animation:seaflow 56s ease-in-out infinite alternate-reverse,seabreathe 8s ease-in-out infinite}
.sea-3{width:560px;height:190px;left:31%;bottom:-2%;background:radial-gradient(closest-side,rgba(251,244,231,.8),transparent);animation:seaflow 48s ease-in-out infinite alternate,seabreathe 5.5s ease-in-out infinite}
@keyframes seaflow{from{transform:translateX(-26px)}to{transform:translateX(26px)}}@keyframes seabreathe{0%,100%{opacity:.84}50%{opacity:1}}
.hero-copy{position:relative;z-index:2;max-width:700px}.hero-copy::before{content:"";position:absolute;inset:-14% -18%;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(30,26,54,.5),rgba(30,26,54,.22) 55%,transparent 78%)}
.hero-copy>*{opacity:0;animation:confirm .8s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes confirm{from{opacity:0;transform:translateY(14px);filter:blur(5px)}to{opacity:1;transform:none;filter:blur(0)}}
.hero-eyebrow{animation-delay:1s;font-size:11px;letter-spacing:.3em;color:var(--gold);text-shadow:0 1px 16px rgba(30,20,14,.6);display:flex;align-items:center;justify-content:center;gap:12px}.hero-eyebrow::before,.hero-eyebrow::after{content:"";width:44px;height:9px;flex:none;background-image:var(--chain-d);background-repeat:repeat-x;background-position:center}
h1{animation-delay:1.15s;font-size:clamp(18px,3.12vw,30px);line-height:1.28;font-weight:600;letter-spacing:.05em;margin-top:18px;color:var(--ondark);text-shadow:0 2px 24px rgba(43,30,24,.5)}
.kicker{animation-delay:1.4s;margin-top:14px;font-size:clamp(14px,1.8vw,18px);font-weight:600;color:var(--core);text-shadow:0 1px 14px rgba(30,20,14,.55);letter-spacing:.05em}.hero-sub{animation-delay:1.6s;margin-top:14px;font-size:14px;color:var(--ondark-2);text-shadow:0 1px 14px rgba(30,20,14,.5)}
.hero-cta{animation-delay:1.75s;margin-top:30px;display:flex;gap:22px;justify-content:center;flex-wrap:wrap;align-items:center}
.hero-cta .btn{font-size:14px;padding:11px 30px}
.hero-cta .btn-primary{
  opacity:.80;
  background:linear-gradient(135deg,#D9BE96,#C9A56B 58%,#B08F58);
  color:#2B1E18;border:1px solid rgba(244,234,218,.48);font-weight:700;
  box-shadow:0 0 0 1px rgba(43,30,24,.25),0 0 28px rgba(244,194,135,.35),0 14px 34px rgba(43,30,24,.28);
  animation:gateopen 1.2s ease 2.35s 1 backwards;
}
.hero-cta .btn-primary:hover{box-shadow:0 0 0 5px rgba(244,194,135,.26),0 0 38px rgba(244,194,135,.42),0 16px 38px rgba(43,30,24,.34);transform:translateY(-1px)}
@keyframes gateopen{0%{box-shadow:0 0 0 0 rgba(244,194,135,.65)}60%{box-shadow:0 0 0 18px rgba(244,194,135,.16)}100%{box-shadow:0 0 0 30px rgba(244,194,135,0)}}
.hero .link-cta{color:var(--ondark);font-weight:600;text-shadow:0 2px 12px rgba(43,30,24,.55)}.hero .link-cta:hover{color:var(--core)}.hero .link-cta:not(.mobile-hero-only){opacity:.95}
.clients{animation-delay:2.1s;margin-top:26px;font-size:12px;letter-spacing:.2em;color:var(--ondark-3)}
.scroll-hint{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:7px;color:var(--ink-soft);font-size:11px;letter-spacing:.24em}
.scroll-hint i{width:7px;height:7px;border:1.5px solid var(--ink-soft);transform:rotate(45deg);border-radius:1px;animation:nudge 2.6s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateY(0) rotate(45deg);opacity:.5}50%{transform:translateY(5px) rotate(45deg);opacity:1}}

/* ═ 分区通用 ═ */
.section{padding:92px 24px}
.section-inner{max-width:1060px;margin:0 auto}
.section.alt{background:var(--paper-2)}
h2{font-size:clamp(22px,2.6vw,30px);font-weight:600;letter-spacing:.03em;display:flex;align-items:center;gap:12px}
h2.dia::before{width:8px;height:8px}
.lead{margin-top:10px;color:var(--ink-2)}
.orn{margin-top:20px;width:170px;opacity:.6}
.rv{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease;transition-delay:calc(var(--d,0)*80ms)}
.rv.in{opacity:1;transform:none}

/* ═ 套餐 · 通行证 ═ */
.plan-grid{margin-top:44px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.plan{
  position:relative;overflow:hidden;
  background-color:var(--card);background-image:var(--lattice);
  border:1px solid rgba(59,46,51,.10);
  border-radius:var(--radius);box-shadow:var(--shadow);
  padding:30px 26px 24px;display:flex;flex-direction:column;
  transition:transform .22s,box-shadow .28s,border-color .22s;
}
.plan::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--halo),var(--accent) 45%,var(--halo) 90%);
  background-size:220% 100%;transition:background-position .8s ease;
}
.plan::after{ /* 卡面流光扫掠 */
  content:"";position:absolute;top:-20%;bottom:-20%;left:-45%;width:32%;
  background:linear-gradient(105deg,transparent,rgba(255,246,235,.65),transparent);
  transform:skewX(-18deg);transition:left .7s ease;pointer-events:none;
}
.plan:hover{transform:translateY(-4px);border-color:rgba(233,169,134,.7);box-shadow:0 0 0 4px rgba(233,169,134,.22),0 20px 44px rgba(140,84,60,.16)}
.plan:hover::before{background-position:100% 0}
.plan:hover::after{left:125%}
.plan--trial{background-color:transparent;background-image:none;border:1.5px dashed rgba(197,103,75,.4)}
.plan--trial::before{display:none}
.plan-no{position:absolute;top:16px;right:22px;font-size:11px;letter-spacing:.26em;color:var(--ink-soft)}
.tsig{display:flex;gap:5px;margin-bottom:10px;min-height:8px}
.tsig i{width:7px;height:7px;background:linear-gradient(135deg,var(--accent),var(--halo));transform:rotate(45deg);border-radius:1px;transition:transform .35s ease}
.tsig i.hollow{background:none;border:1.5px solid var(--halo)}
.plan:hover .tsig i{transform:rotate(135deg)}
.plan h3{font-size:17px;font-weight:600;color:var(--ink-2)}
.price{margin-top:8px;font-size:36px;font-weight:600;font-variant-numeric:tabular-nums}
.price span{font-size:14px;font-weight:400;color:var(--ink-soft);margin-left:4px}
.spec{list-style:none;margin-top:18px;border-top:1px solid var(--line)}
.spec li{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--ink-2)}
.spec li b{color:var(--ink);text-align:right}
.spec li.tier-level b{word-break:keep-all}
.fit{margin-top:14px;font-size:13px;color:var(--ink-soft)}
.perf{margin-top:auto;padding-top:16px;position:relative;border-top:1px dashed rgba(197,103,75,.38)}
.perf::before,.perf::after{content:"";position:absolute;top:-9px;width:18px;height:18px;border-radius:50%;background:var(--paper)}
.perf::before{left:-35px}
.perf::after{right:-35px}
.perf .pin{position:absolute;left:50%;top:-4px;width:7px;height:7px;margin-left:-3.5px;background:linear-gradient(135deg,var(--accent),var(--halo));transform:rotate(45deg);border-radius:1px}
.plan .btn{width:100%}
.plan-note{margin-top:12px;font-size:12px;text-align:center}
.plan-note a{color:var(--ink-soft);border-bottom:1px solid var(--line)}
.plan-note a:hover{color:var(--accent)}
.fineprint{margin-top:28px;font-size:13px;color:var(--ink-soft);text-align:center}

/* ═ 服务规则 · 告示牌 ═ */
.board{
  margin-top:42px;background-color:var(--card);background-image:var(--lattice);
  border:1px solid rgba(59,46,51,.10);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow:hidden;
}
.brow{
  position:relative;display:grid;grid-template-columns:190px 1fr;gap:24px;
  padding:24px 30px 24px 34px;border-bottom:1px solid var(--line);
}
.brow::before{ /* 进入时线条对齐 */
  content:"";position:absolute;left:0;top:20px;bottom:20px;width:3px;border-radius:2px;
  background:linear-gradient(var(--accent),var(--halo));
  transform:scaleY(0);transform-origin:top;
  transition:transform .6s ease calc(var(--d,0)*140ms + .2s);
}
.board.in .brow::before{transform:scaleY(1)}
.brow:last-child{border-bottom:0}
.brow h3{font-size:15px;font-weight:600;display:flex;align-items:flex-start;gap:9px;padding-top:2px}
.brow h3.warn::before{background:linear-gradient(135deg,var(--amber),var(--halo))}
.brow p{font-size:14.5px;color:var(--ink-2)}
.brow .em{color:var(--amber);font-weight:600}
.promise{
  margin-top:26px;padding:24px 30px;position:relative;overflow:hidden;
  background:linear-gradient(120deg,rgba(233,169,134,.16),rgba(255,252,247,.9) 55%);
  border:1px solid rgba(233,169,134,.5);border-radius:var(--radius);
}
.promise::after{content:"";position:absolute;right:-30px;top:50%;width:110px;height:110px;border:1px solid rgba(197,103,75,.22);transform:translateY(-50%) rotate(45deg);border-radius:14px}
.promise h3{font-size:15px;font-weight:600;letter-spacing:.05em;display:flex;align-items:center;gap:9px}
.promise p{margin-top:8px;font-size:15px;color:var(--ink-2);position:relative;z-index:1}

/* ═ 使用文档 ═ */
.doc-grid{margin-top:42px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.doc{
  position:relative;overflow:hidden;
  background-color:var(--card);background-image:var(--lattice);
  border:1px solid rgba(59,46,51,.10);
  border-radius:var(--radius);box-shadow:var(--shadow);
  padding:22px;display:flex;flex-direction:column;gap:9px;
  transition:transform .22s,box-shadow .25s,border-color .22s;
}
.doc::after{
  content:"";position:absolute;top:-20%;bottom:-20%;left:-50%;width:34%;
  background:linear-gradient(105deg,transparent,rgba(255,246,235,.6),transparent);
  transform:skewX(-18deg);transition:left .6s ease;pointer-events:none;
}
.doc:hover{transform:translateY(-3px);border-color:rgba(233,169,134,.7);box-shadow:0 0 0 4px rgba(233,169,134,.18),0 16px 36px rgba(140,84,60,.14)}
.doc:hover::after{left:130%}
.badge{align-self:flex-start;font-size:11px;letter-spacing:.16em;color:var(--accent);border:1px solid rgba(197,103,75,.4);border-radius:999px;padding:3px 12px;transition:background .2s,color .2s}
.doc:hover .badge{background:rgba(197,103,75,.1)}
.doc h3{font-size:15px;font-weight:600}
.doc p{font-size:13px;color:var(--ink-2)}
.doc a{margin-top:auto;font-size:14px;position:relative;z-index:1}
.doc a .arr{display:inline-block;transition:transform .2s}
.doc:hover a .arr{transform:translateX(5px)}
.assist{margin-top:28px;font-size:14px;color:var(--ink-2);text-align:center}

/* ═ 帮助与支持 ═ */
.support-block>p{max-width:44em}
.support-block>p+p{margin-top:10px}
.tg{
  display:inline-flex;align-items:center;gap:9px;margin-top:18px;
  padding:11px 22px;border-radius:999px;font-size:14.5px;
  border:1px solid rgba(197,103,75,.45);color:var(--accent-deep);
  transition:box-shadow .25s,transform .18s,border-color .2s;position:relative;overflow:hidden;
}
.tg::before{content:"";width:7px;height:7px;background:linear-gradient(135deg,var(--accent),var(--halo));transform:rotate(45deg);border-radius:1px;flex:none}
.tg::after{content:"";position:absolute;top:0;bottom:0;left:-45%;width:34%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);transition:left .55s ease;pointer-events:none}
.tg:hover{border-color:var(--accent);box-shadow:0 0 0 4px rgba(233,169,134,.22);transform:translateY(-1px)}
.tg:hover::after{left:125%}
.faq{margin-top:38px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer;padding:16px 0;font-size:15px;font-weight:600;
  list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;
  transition:color .2s;
}
.faq summary:hover{color:var(--accent-deep)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";width:8px;height:8px;flex:none;margin-right:4px;
  border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);
  transform:rotate(45deg);transition:transform .3s ease;
}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq .a{padding:0 0 16px;font-size:14px;color:var(--ink-2)}
.faq details[open] .a{animation:faqin .35s ease}
@keyframes faqin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ═ 收口 ═ */
.closing{text-align:center;background:linear-gradient(180deg,var(--paper) 0%,#E9D5B4 100%)}
.closing p{font-size:clamp(18px,2.2vw,22px);font-weight:600;letter-spacing:.03em}
.closing .orn{margin:22px auto 0}
.closing-cta{margin-top:26px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap;align-items:center}

/* ═ 页脚 ═ */
footer{
  background:linear-gradient(180deg,#3A281D 0%,var(--night) 100%);
  border-top:1px solid rgba(201,155,95,.35);
  padding:56px 24px 42px;color:var(--ondark-2);
}
.footer-inner{max-width:1060px;margin:0 auto}
.footer-top{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr;gap:32px}
.footer-brand{display:inline-flex;align-items:center;gap:9px;font-size:16px;font-weight:600;letter-spacing:.08em;color:var(--ondark)}
.footer-brand::before{content:"";width:8px;height:8px;background:linear-gradient(135deg,var(--gold),var(--core));transform:rotate(45deg);border-radius:1px;box-shadow:3px 3px 0 rgba(201,155,95,.4)}
.tagline{margin-top:6px;font-size:13px;color:var(--ondark-3);letter-spacing:.08em}
.fgroup h4{font-size:12px;font-weight:600;letter-spacing:.16em;color:var(--ondark-3);margin-bottom:8px}
.fgroup a,.fgroup .soon{display:block;padding:7px 0;font-size:14px}
.fgroup a{color:var(--ondark-2);transition:color .2s}
.fgroup a:hover{color:var(--core)}
.fgroup .soon{color:var(--ondark-3);cursor:default}
.fgroup .soon small{font-size:11px;letter-spacing:.06em}
.copyright{margin-top:36px;padding-top:20px;border-top:1px solid rgba(244,234,218,.14);font-size:12px;color:var(--ondark-3)}

/* ═ 响应式 ═ */
@media (max-width:960px){
  .plan-grid{grid-template-columns:1fr;max-width:460px;margin-left:auto;margin-right:auto}
  .doc-grid{grid-template-columns:repeat(2,1fr)}
  .brow{grid-template-columns:1fr;gap:6px;padding:20px 24px 20px 28px}
  .section{padding:72px 24px}
  .footer-top{grid-template-columns:1fr 1fr}
  .rim-2,.pillar-3,.dots-r,.g3{display:none}
}
@media (max-width:700px){
  .rim,.pillar,.spokes,.glyph,.dots,.frag,.mote,.sea,.h-chain,.r-orb,.r-script-a,.r-script-b,.r-sheen,.r-outer{display:none}
  .device{width:320px;height:320px;top:0%;transform:translateX(-50%) rotate(-3deg)}
  .sun{inset:84px}
  .seal{inset:104px}
  .r-core{inset:96px}
  .r-frac1{inset:40px}
  .r-frac2{inset:27px}
  .r-frac3{inset:51px}
  .r-card{inset:12px}
  .hero{min-height:auto;justify-content:flex-start;padding:18px 20px 32px}
  .hero::before{display:none}
  .hero-copy::before{display:none}
  .hero-copy{margin-top:160px}
  .hero-sub{font-size:15px;color:var(--ondark-2)}
  .hero-cta{flex-direction:column;align-items:stretch;gap:14px}
  .hero-cta .btn{width:100%}
  .hero-cta .link-cta{text-align:center}
  .scroll-hint{display:none}
  .sun,.r-core,.r-card,.r-frac1,.r-frac2,.r-frac3{animation:none !important;opacity:1}
  .seal{animation:none !important;opacity:.38}
}
@media (max-width:640px){
  .nav-links{display:none}
  .doc-grid{grid-template-columns:1fr}
  .closing-cta .btn{width:100%}
  .closing-cta{flex-direction:column}
  .footer-top{grid-template-columns:1fr}
  .fgroup a,.fgroup .soon{padding:11px 0}
}



/* mobile-decision-layer final: mobile CTA priority and redundant content removal; desktop unchanged. */
.mobile-hero-only{display:none}
@media(max-width:640px){
 .hero-cta>.mobile-hero-only{display:inline-block}
 .hero-cta .btn.mobile-hero-only{font-size:13px;padding:11px 26px;width:75%;align-self:center;opacity:.87}
 .hero-cta .link-cta.mobile-hero-only{font-size:13.5px}
 .hero-cta>.btn:not(.mobile-hero-only),.hero-cta>.link-cta:not(.mobile-hero-only),.hero .clients{display:none}
 #start{display:none}
 footer{padding:34px 24px 28px}
 .footer-top{gap:20px}.copyright{margin-top:24px}
}

/* mobile-decision-layer batch 2: nodes stay in-place so existing rv reveal remains valid. */
.mobile-section-toggle{display:none}
@media(max-width:640px){
 .mobile-section-toggle{display:block;width:100%;margin:16px 0 0;border:1px solid rgba(184,92,63,.42);background:transparent;color:var(--accent-deep);border-radius:999px;padding:10px 16px;font:inherit;font-size:14px;cursor:pointer}
 #plans:not(.mobile-more-plans-open) .plan-grid>.plan:nth-child(n+2):nth-child(-n+4){display:none}
 #plans .plan-grid>.plan:nth-child(1){order:1}#plans .plan-grid>.plan:nth-child(5){order:2}#plans .plan-grid>.plan:nth-child(2){order:3}#plans .plan-grid>.plan:nth-child(3){order:4}#plans .plan-grid>.plan:nth-child(4){order:5}
 #rules:not(.mobile-rules-open) .board,#rules:not(.mobile-rules-open) .promise{display:none}
 #docs:not(.mobile-docs-open) .doc-grid>.doc:nth-child(n+3){display:none}
 #support:not(.mobile-faq-open) .faq{display:none}
}

/* mobile-advantages-sample: preserve existing rv/reveal nodes; only toggle visibility after reveal. */
.mobile-adv-toggle{display:none}
@media(max-width:640px){#advantages:not(.mobile-advantages-open) .brow:nth-child(n+2){display:none}#advantages .mobile-adv-toggle{display:block;margin:14px auto 0;border:1px solid rgba(184,92,63,.45);background:transparent;color:var(--accent-deep);border-radius:999px;padding:9px 16px;font:inherit;font-size:14px;cursor:pointer}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
  html{scroll-behavior:auto}
  .wake{display:none}
  .hero-copy>*{opacity:1;transform:none;filter:none}
  .r-core,.r-script-a,.r-script-b,.r-sheen,.r-frac1,.r-frac2,.r-frac3,.r-card,.r-orb,.r-outer,.seal,.sun,.glyph,.dots{opacity:1}
  .rv{opacity:1;transform:none}
  .board .brow::before{transform:scaleY(1)}
}

/* 首页优势段：复用既有 board / brow 视觉系统，不影响其它区块 */
.advantages{padding-top:70px;padding-bottom:70px}
.advantages .board{margin-top:0}
.advantages .brow{grid-template-columns:250px 1fr}
.advantages .brow h3{font-size:17px;line-height:1.55}
.advantages .adv-num{display:inline-block;margin-right:12px;color:var(--accent);font-size:24px;letter-spacing:.12em;font-variant-numeric:tabular-nums}
.advantages .brow p{line-height:1.9}
@media (max-width:960px){.advantages .brow{grid-template-columns:1fr}.advantages .brow h3{padding-bottom:0}}
.hero::before{content:"";position:absolute;inset:0;z-index:0;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'600'%3E%3Cfilter%20id%3D'p'%3E%3CfeTurbulence%20type%3D'fractalNoise'%20baseFrequency%3D'0.015'%20numOctaves%3D'4'%20seed%3D'8'%20stitchTiles%3D'stitch'%2F%3E%3CfeColorMatrix%20type%3D'saturate'%20values%3D'0'%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D'100%25'%20height%3D'100%25'%20filter%3D'url%28%23p%29'%2F%3E%3C%2Fsvg%3E");background-size:600px 600px;opacity:.35;mix-blend-mode:soft-light;pointer-events:none}
