/* 青策文枢 官网 — 国风底子 + 克制的现代 SaaS 骨架 */
:root{
  --paper:oklch(0.978 0.006 90);
  --paper-2:oklch(0.962 0.008 88);
  --paper-3:oklch(0.944 0.010 86);
  --card:oklch(0.998 0.002 95);
  --ink:oklch(0.245 0.012 75);
  --ink-2:oklch(0.380 0.012 75);
  --muted:oklch(0.508 0.016 78);
  --faint:oklch(0.628 0.014 80);
  --line:oklch(0.900 0.009 88);
  --line-soft:oklch(0.934 0.007 88);
  --primary:oklch(0.470 0.078 185);
  --primary-d:oklch(0.405 0.072 185);
  --primary-l:oklch(0.640 0.070 185);
  --tint:color-mix(in oklab,var(--primary),transparent 92%);
  --tint-2:color-mix(in oklab,var(--primary),transparent 84%);
  --on-primary:oklch(0.988 0.005 95);
  --gold:oklch(0.610 0.090 80);
  --gold-d:oklch(0.520 0.085 78);
  --seal:oklch(0.505 0.135 28);
  --pine:oklch(0.278 0.038 176);
  --pine-2:oklch(0.212 0.030 178);
  --ok:oklch(0.545 0.098 155);
  --serif:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif;
  --sans:"Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --mono:"SF Mono","JetBrains Mono",ui-monospace,"Cascadia Code",monospace;
  --r:14px;
  --sh:0 1px 2px oklch(0.35 0.02 75/.04),0 8px 26px oklch(0.35 0.02 75/.055);
  --sh-2:0 2px 6px oklch(0.3 0.02 75/.06),0 24px 60px oklch(0.3 0.02 75/.12);
  --ease:cubic-bezier(.2,.7,.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-size:16px;line-height:1.7;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--primary);text-decoration:none}
a:hover{color:var(--primary-d)}
button{font-family:inherit;cursor:pointer}
h1,h2,h3,h4{margin:0;font-weight:600;line-height:1.28;letter-spacing:.005em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
::selection{background:var(--tint-2)}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-thumb{background:oklch(0.5 0.01 78/.22);border-radius:9px;border:3px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:oklch(0.5 0.01 78/.38);border:3px solid transparent;background-clip:padding-box}

.wrap{width:min(1200px,calc(100% - 56px));margin-inline:auto}
.narrow{width:min(920px,calc(100% - 56px));margin-inline:auto}
.disp{font-family:var(--serif)}
.mono{font-family:var(--mono)}

/* ── 顶栏 ───────────────────────────────── */
.nav{position:sticky;top:0;z-index:60;backdrop-filter:blur(14px) saturate(1.5);-webkit-backdrop-filter:blur(14px) saturate(1.5);background:color-mix(in oklab,var(--paper),transparent 22%);border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
.nav:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,color-mix(in oklab,var(--gold),transparent 45%) 18%,color-mix(in oklab,var(--gold),transparent 45%) 82%,transparent);opacity:.55;pointer-events:none}
.nav.stuck{border-bottom-color:var(--line);background:color-mix(in oklab,var(--paper),transparent 8%)}
.nav-in{display:flex;align-items:center;gap:40px;height:78px}
.brand{display:flex;align-items:center;gap:12px;color:var(--ink)}
.brand:hover{color:var(--ink)}
.mark{width:36px;height:36px;border-radius:8px;background:var(--pine);color:oklch(0.96 0.02 90);font-family:var(--serif);font-weight:700;font-size:19px;display:grid;place-items:center;flex:none;box-shadow:inset 0 0 0 1px oklch(1 0 0/.32),inset 0 0 0 2px color-mix(in oklab,var(--pine),oklch(0 0 0) 12%),0 1px 3px oklch(0 0 0/.14)}
.brand b{font-family:var(--serif);font-size:22px;font-weight:700;letter-spacing:.09em}
.brand i{font-style:normal;font-size:12.5px;color:var(--gold-d);font-weight:500;letter-spacing:.16em;border-left:1px solid var(--line);padding-left:12px;margin-left:4px}
.nav-links{display:flex;gap:34px;font-size:15px;letter-spacing:.02em}
.nav-links a{color:var(--ink-2);position:relative;padding:4px 0}
.nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:1.5px;background:var(--gold);transition:right .3s var(--ease)}
.nav-links a:hover:after,.nav-links a[aria-current]:after{right:0}
.nav-links a[aria-current]{color:var(--ink);font-weight:500}
.nav-cta{margin-left:auto;display:flex;align-items:center;gap:12px}
.nav-cta .btn{padding:12px 24px;font-size:15px}
.navtog{display:none;width:38px;height:38px;border:1px solid var(--line);border-radius:9px;background:var(--card);align-items:center;justify-content:center}
.navtog span{display:block;width:16px;height:1.5px;background:var(--ink-2);position:relative}
.navtog span:before,.navtog span:after{content:"";position:absolute;left:0;width:16px;height:1.5px;background:var(--ink-2)}
.navtog span:before{top:-5px}.navtog span:after{top:5px}

/* ── 按钮 ───────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:10px;padding:11px 20px;font-size:14.5px;font-weight:500;border:1px solid transparent;transition:transform .18s var(--ease),background .2s,border-color .2s,box-shadow .2s;white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn-p{background:var(--pine);color:oklch(0.97 0.01 90);box-shadow:0 1px 2px oklch(0.25 0.02 175/.2),0 8px 20px oklch(0.25 0.03 175/.18)}
.btn-p:hover{background:var(--pine-2);color:oklch(0.98 0.01 90);box-shadow:0 2px 4px oklch(0.25 0.02 175/.22),0 14px 30px oklch(0.25 0.03 175/.24)}
.btn-g{background:var(--card);border-color:var(--line);color:var(--ink-2)}
.btn-g:hover{border-color:var(--faint);background:var(--paper-2);color:var(--ink)}
.btn-lg{padding:14px 26px;font-size:15.5px;border-radius:11px}
.btn-w{background:oklch(0.97 0.01 90);color:var(--pine-2)}
.btn-w:hover{background:#fff;color:var(--pine-2)}
.btn-o{background:transparent;border-color:oklch(1 0 0/.28);color:oklch(0.94 0.01 90)}
.btn-o:hover{border-color:oklch(1 0 0/.5);background:oklch(1 0 0/.07);color:#fff}
.arrow{transition:transform .22s var(--ease)}
.btn:hover .arrow{transform:translateX(3px)}

/* ── 区块骨架 ───────────────────────────── */
section{position:relative}
.sec{padding:84px 0}
.sec-sm{padding:60px 0}
.lab{display:inline-flex;align-items:center;gap:11px;font-size:12px;font-weight:600;letter-spacing:.22em;color:var(--gold-d);text-transform:uppercase;margin-bottom:20px}
.lab:before{content:"";width:22px;height:1px;background:var(--gold);opacity:.7}
.h2{font-family:var(--serif);font-size:clamp(28px,3.3vw,42px);line-height:1.3;letter-spacing:.01em;font-weight:700}
.lede{margin-top:16px;font-size:17px;color:var(--muted);max-width:60ch;text-wrap:pretty}
.sec-head{max-width:780px}
.rule{height:1px;background:linear-gradient(90deg,var(--gold),transparent);opacity:.5;margin:0}
.hr{border:0;height:1px;background:var(--line-soft);margin:0}

/* ── 卡片 ───────────────────────────────── */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:26px;position:relative;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.card:hover{transform:translateY(-3px);box-shadow:var(--sh-2);border-color:oklch(0.86 0.012 86)}
.card h3{font-size:18px;font-family:var(--serif);font-weight:700;letter-spacing:.02em}
.card p{margin-top:10px;font-size:14.5px;color:var(--muted);line-height:1.78;text-wrap:pretty}
.tick{position:absolute;width:9px;height:9px;border-color:var(--gold);opacity:.55}
.tick.tl{top:9px;left:9px;border-top:1.5px solid;border-left:1.5px solid}
.tick.br{bottom:9px;right:9px;border-bottom:1.5px solid;border-right:1.5px solid}
.num{font-family:var(--mono);font-size:12px;letter-spacing:.12em;color:var(--gold-d);font-weight:600}
.grid{display:grid;gap:20px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}

.chip{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-2);background:var(--paper-2);border:1px solid var(--line-soft);border-radius:999px;padding:5px 13px}
.chip .pip{width:5px;height:5px;border-radius:50%;background:var(--ok)}

/* ── 深色带 ─────────────────────────────── */
.dark{background:linear-gradient(165deg,var(--pine),var(--pine-2) 68%,oklch(0.185 0.024 180));color:oklch(0.935 0.010 90);overflow:hidden;isolation:isolate}
.dark .h2,.dark h3{color:oklch(0.965 0.010 90)}
.dark .lede,.dark p{color:oklch(0.815 0.014 90)}
.dark .lab{color:var(--gold)}
.dark .lab:before{background:var(--gold)}
.dark .hr{background:oklch(1 0 0/.11)}
.mtn{position:absolute;left:0;right:0;bottom:0;height:min(300px,44%);pointer-events:none;z-index:-1;background-repeat:no-repeat;background-size:100% 100%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 220' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' fill-opacity='.055' d='M0,168 C130,104 214,196 336,146 C452,98 528,190 648,142 C768,94 848,182 968,138 C1088,94 1186,178 1306,138 C1372,116 1412,148 1440,138 L1440,220 L0,220 Z'/%3E%3Cpath fill='%23ffffff' fill-opacity='.045' d='M0,196 C112,158 206,214 330,182 C458,150 540,206 664,180 C788,154 866,204 986,178 C1106,152 1200,206 1320,180 C1382,167 1414,186 1440,180 L1440,220 L0,220 Z'/%3E%3C/svg%3E")}
.wmk{position:absolute;pointer-events:none;z-index:-1;font-family:var(--serif);font-weight:700;color:oklch(1 0 0/.035);line-height:.82;letter-spacing:.06em;user-select:none;white-space:nowrap}
.wmk-r{right:-2%;top:6%;font-size:clamp(180px,26vw,330px)}
.glow{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(760px 420px at 82% -8%,oklch(0.72 0.10 178/.18),transparent 62%),radial-gradient(620px 400px at 4% 104%,oklch(0.62 0.08 80/.10),transparent 60%)}

/* ── 页脚 ───────────────────────────────── */
.foot{background:oklch(0.955 0.008 88);border-top:1px solid var(--line);padding:60px 0 30px;font-size:14px;color:var(--muted)}
.foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px;padding-bottom:38px}
.foot h4{font-size:12.5px;letter-spacing:.16em;color:var(--faint);font-weight:600;margin-bottom:14px;text-transform:uppercase}
.foot li{margin-bottom:9px}
.foot a{color:var(--ink-2)}
.foot a:hover{color:var(--primary)}
.foot-bot{border-top:1px solid var(--line);padding-top:22px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;font-size:13px;color:var(--faint)}
.foot-bot .spacer{flex:1}
.foot-bot .beian{color:var(--faint);display:inline-flex;align-items:center;gap:5px}
.foot-bot .beian:hover{color:var(--primary)}
.foot-bot .beian img{height:14px;width:auto;display:block;flex:none}

/* ── 滚动淡入 ───────────────────────────── */
[data-rv]{opacity:0;transform:translateY(20px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:calc(var(--d,0)*80ms)}
[data-rv].in{opacity:1;transform:none}

/* ── 响应式 ─────────────────────────────── */
@media(max-width:1080px){.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:1220px){
  .brand i{display:none}
  .nav-in{gap:24px}
  .nav-links{gap:20px;font-size:14px}
  .nav-cta .btn{padding:10px 18px;font-size:14px}
}
@media(max-width:900px){
  .wrap,.narrow{width:calc(100% - 40px)}
  .sec{padding:64px 0}
  .g3,.g2{grid-template-columns:1fr}
  .foot-top{grid-template-columns:1fr 1fr}
  .nav-links{position:absolute;top:78px;left:0;right:0;flex-direction:column;gap:0;background:var(--card);border-bottom:1px solid var(--line);padding:8px 20px 16px;box-shadow:var(--sh);display:none}
  .nav-links.open{display:flex}
  .nav-links a{padding:12px 0;border-bottom:1px solid var(--line-soft)}
  .nav-links a:after{display:none}
  .navtog{display:flex}
  .nav-cta .btn-g{display:none}
}
@media(max-width:560px){.g4{grid-template-columns:1fr}.foot-top{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  [data-rv]{opacity:1;transform:none;transition:none}
  *{animation-duration:.001ms!important;animation-iteration-count:1!important}
}