/* ==========================================================================
   干活呗财税 · 站点共享样式（设计系统单一来源）
   由 index.html 抽取：tokens → base → header → buttons → footer → tabbar
   所有内页均引用本文件，确保格式 / 色调 / 字体与首页完全一致。
   ========================================================================== */
/* =============================================================
   Design Tokens (1:1 from .ardot design file 724293997191119)
   ============================================================= */
:root{
  --green-900:#14422F;
  --green-700:#1D5B46;
  --green-600:#2A7459;
  --green-500:#3E8C70;
  --green-200:#D5E4DC;
  --green-100:#EDF2EE;
  --green-50:#F4F8F6;

  --ink-900:#1A1A17;
  --ink-700:#3A3A35;
  --ink-500:#55554E;
  --ink-400:#8A8A82;
  --ink-300:#B6B6AE;
  --ink-200:#D6D6CE;

  --bg:#FAFAF7;
  --card:#FFFFFF;
  --footer:#1F2A24;

  --radius-card:20px;
  --radius-input:14px;
  --radius-button:999px;
  --radius-tag:8px;

  --shadow-card:0 1px 2px rgba(20,66,47,.04),0 8px 24px rgba(20,66,47,.05);
  --shadow-cta:0 18px 50px -12px rgba(20,66,47,.45);

  --max-w:1440px;
  --pad-x:64px;

  --font:"Noto Sans SC","PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,sans-serif;
}

@media (max-width:1100px){
  :root{ --pad-x:40px; }
}
@media (max-width:900px){
  :root{ --pad-x:32px; }
}
@media (max-width:600px){
  :root{
    --pad-x:20px;
    --radius-card:18px;
  }
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--ink-900);font-family:var(--font);-webkit-font-smoothing:antialiased;font-feature-settings:"tnum" 1}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select{font:inherit;color:inherit;background:transparent;border:0;outline:0}

/* =============================================================
   Layout primitives
   ============================================================= */
.container{max-width:var(--max-w);margin:0 auto;padding-left:var(--pad-x);padding-right:var(--pad-x);width:100%}
.section{padding:96px 0}
@media (max-width:900px){.section{padding:64px 0}}
@media (max-width:600px){.section{padding:48px 0}}

/* eyebrow + heading + lead */
.eyebrow{font-size:14px;color:var(--green-700);font-weight:600;letter-spacing:.06em;margin-bottom:14px}
.heading{font-size:34px;font-weight:700;color:var(--ink-900);line-height:1.3;letter-spacing:-.01em}
.lead{margin-top:14px;font-size:16px;color:var(--ink-500);line-height:1.7;max-width:720px}
@media (max-width:900px){.heading{font-size:28px}.lead{font-size:15px}}
@media (max-width:600px){.heading{font-size:24px}.lead{font-size:14px}}

/* =============================================================
   Header / Nav
   ============================================================= */
.header{
  position:sticky;top:0;z-index:50;
  background:rgba(250,250,247,.85);
  backdrop-filter:saturate(1.4) blur(14px);
  -webkit-backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid rgba(20,66,47,.06);
}
.nav{
  height:76px;display:flex;align-items:center;gap:24px;
}
.brand{display:flex;align-items:center;flex:0 0 auto}
.brand img{height:38px;width:auto}
.nav-list{display:flex;gap:14px;flex:1;justify-content:center;flex-wrap:nowrap;min-width:0;overflow:hidden}
.nav-list a{font-size:13px;color:var(--ink-700);font-weight:500;padding:6px 1px;position:relative;transition:color .15s;white-space:nowrap;flex-shrink:0}
.nav-list a:hover,.nav-list a.is-active{color:var(--green-700)}
.nav-list a.is-active::after{content:"";position:absolute;left:50%;bottom:-2px;transform:translateX(-50%);width:18px;height:2px;border-radius:2px;background:var(--green-700)}
.nav-actions{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  font-weight:600;letter-spacing:.02em;
  border-radius:var(--radius-button);
  transition:transform .12s, box-shadow .15s, background .15s, color .15s;
  white-space:nowrap;
}
.btn:active{transform:translateY(1px)}
.btn-primary{
  padding:13px 22px;background:var(--green-700);color:#fff;font-size:15px;
  box-shadow:0 6px 18px -6px rgba(29,91,70,.55);
}
.btn-primary:hover{background:var(--green-600)}
.btn-ghost{
  padding:13px 22px;background:#fff;color:var(--ink-900);font-size:15px;border:1px solid var(--ink-200);
}
.btn-ghost:hover{border-color:var(--green-700);color:var(--green-700)}
.btn-lg{padding:16px 28px;font-size:16px}
.btn-xl{padding:18px 30px;font-size:16px}
.btn-white{background:#fff;color:var(--green-700)}

/* tablet */
@media (max-width:1100px){
  .nav{height:64px;gap:14px}
  .brand img{height:36px}
  .nav-list{gap:10px}
  .nav-list a{font-size:12px;padding:6px 0}
}
/* mobile */
@media (max-width:900px){
  .nav{height:60px;gap:16px}
  .brand img{height:35px}
  .nav-list{display:none}
  .nav-actions .btn-ghost{display:none}
  .nav-actions .btn-primary{padding:9px 14px;font-size:14px}
}

/* burger */
.burger{
  width:36px;height:36px;border-radius:10px;border:1px solid var(--ink-200);background:#fff;
  display:none;align-items:center;justify-content:center;gap:4px;flex-direction:column;
}
.burger span{width:16px;height:1.6px;background:var(--ink-900);border-radius:1px;display:block}
@media (max-width:900px){.burger{display:flex}}

/* =============================================================
   Footer
   ============================================================= */
.footer{
  background:var(--footer);color:rgba(255,255,255,.78);padding:64px 0 0;
  margin-top:96px;
}
.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:48px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.08)}
.footer-brand .brand img{height:40px;filter:brightness(0) invert(1);margin-bottom:18px}
.footer-brand p{font-size:14px;line-height:1.7;color:rgba(255,255,255,.6);margin-bottom:8px}
.footer-brand .addr{font-size:13px;color:rgba(255,255,255,.66)}
.footer-col h3,
.footer-col h4,
.footer-col h5{font-size:15px;color:#fff;font-weight:600;margin-bottom:18px;letter-spacing:.04em}
.footer-col ul{display:flex;flex-direction:column;gap:12px}
.footer-col a{font-size:14px;color:rgba(255,255,255,.6);transition:color .15s}
.footer-col a:hover{color:#fff}
.footer-bottom{padding:22px 0;text-align:center;font-size:13px;color:rgba(255,255,255,.66);display:flex;flex-direction:column;gap:10px}
.footer-bottom .links{display:flex;justify-content:center;gap:18px;margin-bottom:6px}
.footer-bottom .links a{color:rgba(255,255,255,.66)}
.footer-bottom .links a:hover{color:#fff}
.footer-bottom .icp{font-size:12px;color:rgba(255,255,255,.66)}

@media (max-width:1100px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
  .footer-brand{grid-column:1 / -1}
  .footer{margin-top:64px;padding-top:48px}
}
@media (max-width:600px){
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .footer{margin-top:48px;padding:40px 0 0}
  .footer-bottom{padding:18px 0 20px}
}

/* =============================================================
   Mobile bottom Tab bar
   ============================================================= */
.tab-bar{display:none;position:fixed;left:0;right:0;bottom:0;height:64px;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-top:1px solid var(--ink-200);z-index:60;padding-bottom:env(safe-area-inset-bottom)}
.tab-bar-inner{display:grid;grid-template-columns:repeat(5,1fr);height:100%}
.tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--ink-400)}
.tab .ic{width:22px;height:22px;display:grid;place-items:center}
.tab .lb{font-size:11px;font-weight:500;color:var(--ink-500)}
.tab.is-active{color:var(--green-700)}
.tab.is-active .lb{font-weight:600}

@media (max-width:600px){
  .tab-bar{display:block}
  /* pad body so tab bar doesn't cover content */
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0))}
}

/* =============================================================
   Helpers
   ============================================================= */
/* 整卡可点：卡片设为 position:relative 后，在卡内放置一个铺满的链接 */
.card-link{position:absolute;inset:0;z-index:2;border-radius:inherit}
.center{text-align:center}
.mt-40{margin-top:40px}
.mt-56{margin-top:56px}

/* simple icon style for inline SVG */
.ico-svg{width:1em;height:1em;display:inline-block;vertical-align:-2px;fill:currentColor}

/* scrollbar polish */
::selection{background:var(--green-100);color:var(--green-900)}

/* =============================================================
   Inner pages — shared components
   (breadcrumb / page hero / doc layout / feed list / article)
   All values derive from the tokens above, so inner pages stay
   visually identical to the homepage.
   ============================================================= */

/* ---------- breadcrumb ---------- */
.breadcrumb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--ink-400);padding:22px 0 0}
.breadcrumb a{color:var(--ink-500);transition:color .15s}
.breadcrumb a:hover{color:var(--green-700)}
.breadcrumb .sep{color:var(--ink-300)}
.breadcrumb .cur{color:var(--ink-900);font-weight:500}

/* ---------- page hero (light, sub pages) ---------- */
.page-hero{
  padding:52px 0 56px;
  background:
    radial-gradient(1000px 400px at 108% -20%, var(--green-100) 0%, transparent 60%),
    radial-gradient(700px 320px at -8% 40%, #F1F4E8 0%, transparent 55%),
    linear-gradient(180deg,#FDFCF7 0%, var(--bg) 100%);
  border-bottom:1px solid rgba(20,66,47,.06);
}
.page-hero .badge{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--green-700);background:var(--green-100);padding:6px 14px;border-radius:999px;font-weight:500;margin-bottom:20px}
.page-hero .badge .dot{width:6px;height:6px;border-radius:50%;background:var(--green-700)}
.page-hero h1{font-size:46px;font-weight:700;line-height:1.22;letter-spacing:-.02em;max-width:900px}
.page-hero h1 em{font-style:normal;color:var(--green-700)}
.page-hero .sub{margin-top:18px;font-size:17px;color:var(--ink-500);line-height:1.7;max-width:760px}
.page-hero .hero-facts{margin-top:34px;display:flex;flex-wrap:wrap;gap:14px}
.page-hero .fact{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-700);background:#fff;border:1px solid var(--green-100);border-radius:999px;padding:9px 16px;box-shadow:var(--shadow-card)}
.page-hero .fact b{color:var(--green-700);font-weight:700}
@media (max-width:1100px){.page-hero{padding:40px 0 44px}.page-hero h1{font-size:36px}.page-hero .sub{font-size:16px}}
@media (max-width:900px){.page-hero h1{font-size:30px}.page-hero{padding:32px 0 36px}}
@media (max-width:600px){.page-hero h1{font-size:26px}.page-hero .sub{font-size:15px}.page-hero .badge{font-size:12px}}

/* ---------- doc layout: content + sticky sidebar ---------- */
.doc-wrap{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:start}
@media (max-width:1100px){.doc-wrap{grid-template-columns:1fr;gap:36px}}

/* ---------- article prose ---------- */
.doc{background:#fff;border:1px solid var(--green-100);border-radius:var(--radius-card);padding:44px 48px;box-shadow:var(--shadow-card)}
.doc h2{font-size:24px;font-weight:700;color:var(--ink-900);line-height:1.4;margin:40px 0 14px;padding-left:14px;position:relative}
.doc h2::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:4px;border-radius:4px;background:linear-gradient(180deg,var(--green-600),var(--green-900))}
.doc h2:first-child{margin-top:0}
.doc h3{font-size:18px;font-weight:600;color:var(--ink-900);margin:26px 0 10px}
.doc p{font-size:16px;line-height:1.85;color:var(--ink-700);margin-bottom:16px}
.doc p.muted{font-size:15px;color:var(--ink-500)}
.doc ul,.doc ol{margin:0 0 18px;padding-left:22px;display:flex;flex-direction:column;gap:10px}
.doc li{font-size:16px;line-height:1.8;color:var(--ink-700)}
.doc strong{color:var(--ink-900);font-weight:600}
.doc a{color:var(--green-700);font-weight:500;border-bottom:1px solid var(--green-200)}
.doc blockquote{margin:0 0 20px;padding:18px 22px;background:var(--green-50);border-left:3px solid var(--green-700);border-radius:0 12px 12px 0;font-size:15px;line-height:1.8;color:var(--ink-700)}
.doc .divider{height:1px;background:var(--green-100);margin:36px 0}
@media (max-width:900px){.doc{padding:28px 22px;border-radius:18px}.doc h2{font-size:20px}.doc p,.doc li{font-size:15px}}
@media (max-width:600px){.doc{padding:24px 18px}}

/* ---------- info cards grid (service content) ---------- */
.info-grid{margin:22px 0 6px;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.info{background:var(--green-50);border:1px solid var(--green-100);border-radius:16px;padding:20px 20px}
.info .ico{width:40px;height:40px;border-radius:12px;background:#fff;border:1px solid var(--green-100);display:grid;place-items:center;color:var(--green-700);margin-bottom:12px}
.info h4{font-size:16px;font-weight:600;color:var(--ink-900);margin-bottom:8px}
.info p{font-size:14px;line-height:1.7;color:var(--ink-500);margin:0}
@media (max-width:900px){.info-grid{grid-template-columns:1fr}}

/* ---------- steps ---------- */
.steps{margin:22px 0 6px;display:flex;flex-direction:column;gap:0;counter-reset:s}
.step{display:flex;gap:18px;padding:0 0 26px;position:relative}
.step:last-child{padding-bottom:0}
.step .n{flex:0 0 44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--green-200);display:grid;place-items:center;font-weight:700;font-size:16px;color:var(--green-700);position:relative;z-index:1}
.step:not(:last-child)::before{content:"";position:absolute;left:21px;top:44px;bottom:0;width:2px;background:var(--green-100)}
.step h4{font-size:16px;font-weight:600;color:var(--ink-900);margin:10px 0 6px}
.step p{font-size:15px;line-height:1.75;color:var(--ink-500);margin:0}
@media (max-width:600px){.step .n{flex:0 0 38px;height:38px;font-size:15px}.step:not(:last-child)::before{left:18px;top:38px}}

/* ---------- checklist ---------- */
.checklist{margin:22px 0 6px;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.check{display:flex;align-items:flex-start;gap:10px;font-size:15px;line-height:1.65;color:var(--ink-700);background:#fff;border:1px solid var(--green-100);border-radius:12px;padding:14px 16px}
.check .ck{flex:0 0 18px;height:18px;margin-top:2px;border-radius:50%;background:var(--green-100);display:grid;place-items:center;color:var(--green-700)}
@media (max-width:900px){.checklist{grid-template-columns:1fr}}

/* ---------- FAQ ---------- */
.faq{margin-top:22px;display:flex;flex-direction:column;gap:12px}
.faq-item{background:#fff;border:1px solid var(--green-100);border-radius:16px;padding:20px 22px;transition:border-color .15s}
.faq-item:hover{border-color:var(--green-200)}
.faq-item h4{font-size:16px;font-weight:600;color:var(--ink-900);display:flex;gap:10px;line-height:1.6}
.faq-item h4 .q{color:var(--green-700);font-weight:700;flex:0 0 auto}
.faq-item p{margin:10px 0 0 26px;font-size:15px;line-height:1.8;color:var(--ink-500)}
@media (max-width:600px){.faq-item{padding:18px}.faq-item h4{font-size:15px}.faq-item p{font-size:14px;margin-left:0}}

/* ---------- sidebar ---------- */
.side{display:flex;flex-direction:column;gap:20px;position:sticky;top:100px}
@media (max-width:1100px){.side{position:static}}
.side-card{background:#fff;border:1px solid var(--green-100);border-radius:var(--radius-card);padding:24px;box-shadow:var(--shadow-card)}
.side-card h5{font-size:15px;font-weight:700;color:var(--ink-900);margin-bottom:16px;display:flex;align-items:center;gap:8px}
.side-card h5::before{content:"";width:4px;height:14px;border-radius:3px;background:var(--green-700)}
.side-nav{display:flex;flex-direction:column;gap:2px}
.side-nav a{font-size:14px;color:var(--ink-500);padding:9px 12px;border-radius:10px;transition:all .15s;display:flex;justify-content:space-between;gap:8px}
.side-nav a:hover{background:var(--green-50);color:var(--green-700)}
.side-nav a.is-on{background:var(--green-100);color:var(--green-700);font-weight:600}
.side-cta{background:linear-gradient(160deg,var(--green-700),var(--green-900));color:#fff;border-radius:var(--radius-card);padding:26px 24px;position:relative;overflow:hidden}
.side-cta::after{content:"";position:absolute;width:180px;height:180px;right:-60px;bottom:-70px;background:radial-gradient(closest-side,rgba(255,255,255,.12),transparent 70%);border-radius:50%;pointer-events:none}
.side-cta h5{font-size:17px;font-weight:700;margin-bottom:8px;position:relative}
.side-cta p{font-size:13px;line-height:1.7;color:rgba(255,255,255,.78);margin-bottom:18px;position:relative}
.side-cta .btn{position:relative;width:100%}
.side-cta .tel{margin-top:12px;font-size:13px;color:rgba(255,255,255,.6);text-align:center;position:relative}

/* ---------- category tabs ---------- */
.cat-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px;border-bottom:1px solid var(--green-100);padding-bottom:16px}
.cat-tab{font-size:14px;font-weight:500;color:var(--ink-500);padding:8px 16px;border-radius:999px;border:1px solid transparent;transition:all .15s;cursor:pointer}
.cat-tab:hover{color:var(--green-700);background:var(--green-50)}
.cat-tab.is-on{background:var(--green-700);color:#fff;border-color:var(--green-700);font-weight:600}
@media (max-width:600px){.cat-tabs{gap:8px;overflow-x:auto;flex-wrap:nowrap;padding-bottom:14px;scrollbar-width:none}.cat-tabs::-webkit-scrollbar{display:none}.cat-tab{white-space:nowrap;font-size:13px;padding:7px 14px}}

/* ---------- feed list (36kr-style list) ---------- */
.feed{display:flex;flex-direction:column}
.feed-item{display:grid;grid-template-columns:1fr 200px;gap:24px;padding:26px 0;border-bottom:1px solid var(--green-100);align-items:start;transition:opacity .15s}
.feed-item:hover{opacity:.86}
.feed-item:first-child{padding-top:0}
.feed-item.no-thumb{grid-template-columns:1fr}
.feed-item .cat{display:inline-block;font-size:12px;font-weight:600;color:var(--green-700);background:var(--green-100);padding:4px 10px;border-radius:999px;margin-bottom:12px}
.feed-item h2,
.feed-item h3{font-size:20px;font-weight:700;color:var(--ink-900);line-height:1.45;margin-bottom:10px}
.feed-item h3 a:hover{color:var(--green-700)}
.feed-item .exc{font-size:15px;line-height:1.75;color:var(--ink-500);margin-bottom:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.feed-item .meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--ink-400)}
.feed-item .meta .src{color:var(--ink-500);font-weight:500}
.feed-item .meta .sep{color:var(--ink-200)}
.feed-thumb{aspect-ratio:16/10;border-radius:14px;overflow:hidden;position:relative;background:linear-gradient(160deg,#2A7459,#14422F)}
.feed-thumb::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 28% 28%,rgba(255,255,255,.20),transparent 58%),radial-gradient(circle at 82% 88%,rgba(29,91,70,.65),transparent 62%)}
.feed-thumb .lbl{position:absolute;left:14px;bottom:14px;z-index:1;font-size:13px;font-weight:700;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.32)}
.feed-thumb .pill{position:absolute;left:14px;top:14px;z-index:1;font-size:11px;font-weight:600;color:#fff;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:4px 9px;border-radius:999px}
@media (max-width:1100px){.feed-item{grid-template-columns:1fr 170px;gap:18px}}
@media (max-width:600px){
  .feed-item{grid-template-columns:1fr;gap:0;padding:22px 0}
  .feed-item h3{font-size:17px}
  .feed-item .exc{font-size:14px;-webkit-line-clamp:2}
  .feed-thumb{display:none}
}

/* ---------- article (36kr-style detail) ---------- */
.art-wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:52px;align-items:start;max-width:1200px;margin:0 auto}
@media (max-width:1100px){.art-wrap{grid-template-columns:1fr;gap:36px}}
.art-head{padding:44px 0 0}
.art-head .cat{display:inline-block;font-size:12px;font-weight:600;color:var(--green-700);background:var(--green-100);padding:5px 12px;border-radius:999px;margin-bottom:18px}
.art-head h1{font-size:40px;font-weight:700;line-height:1.3;letter-spacing:-.02em;color:var(--ink-900)}
.art-head .sub{margin-top:16px;font-size:17px;color:var(--ink-500);line-height:1.7}
.art-head .byline{margin-top:24px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:14px;color:var(--ink-400);padding-bottom:22px;border-bottom:1px solid var(--green-100)}
.art-head .byline .av{width:34px;height:34px;border-radius:50%;background:linear-gradient(150deg,var(--green-600),var(--green-900));display:grid;place-items:center;color:#fff;font-size:13px;font-weight:700}
.art-head .byline .who{color:var(--ink-700);font-weight:500}
.art-head .byline .sep{color:var(--ink-200)}
@media (max-width:900px){
  .art-head{padding:28px 0 0}
  .art-head h1{font-size:27px}
  .art-head .sub{font-size:15px}
}
.art-cover{margin:32px 0;aspect-ratio:16/9;border-radius:var(--radius-card);position:relative;overflow:hidden;background:linear-gradient(160deg,#2A7459 0%,#14422F 80%)}
.art-cover::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 26% 26%,rgba(255,255,255,.20),transparent 55%),radial-gradient(circle at 78% 84%,rgba(29,91,70,.7),transparent 60%)}
.art-cover .cap{position:absolute;left:24px;bottom:22px;z-index:1;font-size:18px;font-weight:700;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.3)}
.art-cover .cap small{display:block;margin-top:6px;font-size:12px;font-weight:500;color:rgba(255,255,255,.72);text-shadow:none}

.art-body{background:#fff;border:1px solid var(--green-100);border-radius:var(--radius-card);padding:44px 48px;box-shadow:var(--shadow-card)}
.art-body p{font-size:17px;line-height:1.95;color:var(--ink-700);margin-bottom:22px}
.art-body p strong{color:var(--ink-900);font-weight:600}
.art-body h2{font-size:22px;font-weight:700;color:var(--ink-900);margin:38px 0 16px;line-height:1.45;position:relative;padding-left:14px}
.art-body h2::before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:4px;border-radius:4px;background:linear-gradient(180deg,var(--green-600),var(--green-900))}
.art-body h2:first-child{margin-top:0}
.art-body ul,.art-body ol{margin:0 0 22px;padding-left:24px;display:flex;flex-direction:column;gap:12px}
.art-body li{font-size:17px;line-height:1.85;color:var(--ink-700)}
.art-body blockquote{margin:0 0 24px;padding:20px 24px;background:var(--green-50);border-left:3px solid var(--green-700);border-radius:0 14px 14px 0;font-size:16px;line-height:1.85;color:var(--ink-700);font-weight:500}
.art-body .figure{margin:28px 0;padding:22px;background:var(--green-50);border:1px dashed var(--green-200);border-radius:14px;text-align:center;font-size:13px;color:var(--ink-400);line-height:1.7}
.art-body .figure b{display:block;color:var(--green-700);font-size:14px;margin-bottom:6px;font-weight:600}
@media (max-width:900px){
  .art-body{padding:28px 22px}
  .art-body p,.art-body li{font-size:15px;line-height:1.9}
  .art-body h2{font-size:19px}
}
@media (max-width:600px){.art-body{padding:24px 18px}}

.art-tags{margin-top:32px;padding-top:24px;border-top:1px solid var(--green-100);display:flex;gap:10px;flex-wrap:wrap}
.art-tags .t{font-size:13px;color:var(--ink-500);background:var(--green-50);border:1px solid var(--green-100);padding:6px 14px;border-radius:999px;transition:all .15s}
.art-tags .t:hover{color:var(--green-700);border-color:var(--green-200)}

/* author / source card */
.author-card{margin-top:28px;background:#fff;border:1px solid var(--green-100);border-radius:var(--radius-card);padding:26px;display:flex;gap:18px;align-items:flex-start;box-shadow:var(--shadow-card)}
.author-card .av{flex:0 0 54px;height:54px;border-radius:50%;background:linear-gradient(150deg,var(--green-600),var(--green-900));display:grid;place-items:center;color:#fff;font-size:18px;font-weight:700}
.author-card h4{font-size:17px;font-weight:700;color:var(--ink-900);margin-bottom:6px;display:flex;align-items:center;gap:8px}
.author-card h4 .vt{font-size:11px;font-weight:600;color:var(--green-700);background:var(--green-100);padding:3px 8px;border-radius:999px}
.author-card p{font-size:14px;line-height:1.7;color:var(--ink-500);margin:0 0 14px}
@media (max-width:600px){.author-card{padding:20px;gap:14px}.author-card .av{flex:0 0 44px;height:44px;font-size:15px}}

/* related */
.related{margin-top:52px;padding-top:36px;border-top:1px solid var(--green-100)}
.related-grid{margin-top:24px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.rel{background:#fff;border:1px solid var(--green-100);border-radius:var(--radius-card);overflow:hidden;display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s}
.rel:hover{transform:translateY(-3px);box-shadow:var(--shadow-card)}
.rel .cv{aspect-ratio:16/9;position:relative;background:linear-gradient(160deg,#2A7459,#14422F)}
.rel .cv::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.18),transparent 55%)}
.rel .bd{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}
.rel .bd .cat{font-size:12px;color:var(--green-700);font-weight:600}
.rel .bd h4{font-size:16px;font-weight:600;color:var(--ink-900);line-height:1.5}
.rel .bd .mt{font-size:12px;color:var(--ink-400);margin-top:auto}
@media (max-width:900px){.related-grid{grid-template-columns:1fr;gap:16px}}

/* ---------- rank list (sidebar 热榜) ---------- */
.rank{display:flex;flex-direction:column;gap:2px}
.rank a{display:flex;gap:12px;align-items:flex-start;padding:11px 10px;border-radius:10px;font-size:14px;line-height:1.6;color:var(--ink-700);transition:background .15s}
.rank a:hover{background:var(--green-50);color:var(--green-700)}
.rank .rk{flex:0 0 20px;height:20px;border-radius:6px;background:var(--green-50);color:var(--ink-400);font-size:12px;font-weight:700;display:grid;place-items:center;font-feature-settings:"tnum" 1}
.rank a:nth-child(1) .rk{background:var(--green-700);color:#fff}
.rank a:nth-child(2) .rk{background:var(--green-500);color:#fff}
.rank a:nth-child(3) .rk{background:var(--green-200);color:var(--green-900)}

/* ---------- misc ---------- */
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:26px 0 6px}
.stat-box{background:var(--green-50);border:1px solid var(--green-100);border-radius:16px;padding:20px;text-align:center}
.stat-box .n{font-size:28px;font-weight:800;color:var(--green-700);letter-spacing:-.01em;font-feature-settings:"tnum" 1}
.stat-box .l{margin-top:6px;font-size:13px;color:var(--ink-500);line-height:1.5}
@media (max-width:600px){.stat-row{grid-template-columns:1fr;gap:12px}.stat-box{display:flex;align-items:center;gap:14px;text-align:left;padding:16px}.stat-box .n{font-size:22px}.stat-box .l{margin-top:0}}


/* =============================================================
   干活呗财税 · v2 动效系统 (motion.css)
   2026-09-11 — T1 设计系统升级
   ============================================================= */

/* === motion tokens === */
:root{
  --ease-out: cubic-bezier(.22, .61, .36, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ease-soft: cubic-bezier(.16, 1, .3, 1);
  --dur-fast: 180ms;
  --dur-base: 320ms;
  --dur-slow: 620ms;
  --reveal-distance: 24px;
}

/* === 滚动 reveal (IntersectionObserver 触发动效) === */
[data-reveal]{
  opacity: 0;
  transform: translateY(var(--reveal-distance));
  transition: opacity var(--dur-slow) var(--ease-soft),
              transform var(--dur-slow) var(--ease-soft);
  will-change: opacity, transform;
}
[data-reveal].is-revealed{
  opacity: 1;
  transform: translateY(0);
}
/* delay helpers */
[data-reveal-delay="1"]{ transition-delay: 80ms; }
[data-reveal-delay="2"]{ transition-delay: 160ms; }
[data-reveal-delay="3"]{ transition-delay: 240ms; }
[data-reveal-delay="4"]{ transition-delay: 320ms; }
[data-reveal-delay="5"]{ transition-delay: 400ms; }

/* === 数字 count-up (动效库自动处理) === */
[data-count]{
  font-feature-settings: "tnum" 1;
  font-variant-numeric: tabular-nums;
}
[data-count]::after{
  content: attr(data-suffix);
  font-size: 0.6em;
  margin-left: 0.05em;
  color: var(--ink-400);
  font-weight: 500;
  vertical-align: baseline;
}

/* === 卡片 3D tilt (鼠标位置驱动) === */
[data-tilt]{
  transform-style: preserve-3d;
  transition: transform var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out);
  will-change: transform;
}
[data-tilt]:hover{
  box-shadow: 0 24px 56px -16px rgba(20, 66, 47, .18),
              0 6px 20px -8px rgba(20, 66, 47, .08);
}

/* === 渐变光斑背景（hero 装饰）=== */
.bg-blobs{
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 0;
}
.bg-blobs::before,
.bg-blobs::after{
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.45;
  will-change: transform;
}
.bg-blobs::before{
  background: radial-gradient(circle, #3E8C70 0%, transparent 70%);
  top: -180px;
  right: -120px;
  animation: blob-drift 18s var(--ease-in-out) infinite;
}
.bg-blobs::after{
  background: radial-gradient(circle, #2A7459 0%, transparent 70%);
  bottom: -200px;
  left: -160px;
  width: 600px;
  height: 600px;
  animation: blob-drift 22s var(--ease-in-out) infinite reverse;
}
@keyframes blob-drift{
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%      { transform: translate(60px, -40px) scale(1.08); }
  66%      { transform: translate(-40px, 60px) scale(0.95); }
}

/* === 几何装饰 === */
.bg-grid{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    linear-gradient(rgba(29, 91, 70, .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(29, 91, 70, .04) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 30%, #000 30%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 30%, #000 30%, transparent 80%);
}

/* === 按钮 ripple 增强 === */
.btn-primary{ position: relative; overflow: hidden; }
.btn-primary::after{
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .35);
  transform: translate(-50%, -50%);
  transition: width 500ms var(--ease-out), height 500ms var(--ease-out), opacity 600ms;
  opacity: 0;
  pointer-events: none;
}
.btn-primary:active::after{
  width: 240px;
  height: 240px;
  opacity: 1;
  transition: 0s;
}

/* === 卡片 hover 重排（3D tilt 轻量版）=== */
.tilt-card{
  position: relative;
  transition: transform var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out);
  will-change: transform;
}
.tilt-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 20px 40px -16px rgba(20, 66, 47, .15);
}

/* === 链接下划线动画 === */
.nav-list a{
  position: relative;
  overflow: visible;
}
.nav-list a::before{
  content: "";
  position: absolute;
  left: 50%;
  bottom: -2px;
  width: 0;
  height: 2px;
  border-radius: 2px;
  background: var(--green-700);
  transform: translateX(-50%);
  transition: width var(--dur-base) var(--ease-soft);
}
.nav-list a.is-active::before,
.nav-list a:hover::before{
  width: 18px;
}

/* === 段落渐入（自动应用到 section） === */
.section{
  position: relative;
}

/* === 滚动条美化（更细的现代感） === */
::-webkit-scrollbar{
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track{
  background: transparent;
}
::-webkit-scrollbar-thumb{
  background: var(--ink-200);
  border-radius: 5px;
  border: 2px solid var(--bg);
}
::-webkit-scrollbar-thumb:hover{
  background: var(--ink-300);
}

/* === 文本选区 === */
::selection{
  background: var(--green-200);
  color: var(--green-900);
}

/* === 装饰滚动驱动渐变（hero 标题） === */
.gradient-text{
  background: linear-gradient(135deg, var(--green-700) 0%, var(--green-500) 60%, #4a9c7e 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* === 关键帧：可复用 === */
@keyframes float-y{
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}
@keyframes fade-in{
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes slide-up{
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* === a11y: prefers-reduced-motion 全局禁用 === */
@media (prefers-reduced-motion: reduce){
  *,
  *::before,
  *::after{
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal]{
    opacity: 1 !important;
    transform: none !important;
  }
  .bg-blobs::before,
  .bg-blobs::after{
    animation: none !important;
  }
  .feed-item,
  .cat-tab,
  .rel,
  .side-card{
    transition: none !important;
    transform: none !important;
  }
}

/* =============================================================
   v3 列表页动效 (T3 列表页升级)
   2026-09-11 — 卡片 hover 重排 + chip 滑动指示器 + 滚动入场
   ============================================================= */

/* === chip 滑动指示器 (跟随激活 tab) === */
.cat-tabs{
  position: relative;
  isolation: isolate;
}
/* indicator 用 absolute 定位到 cat-tabs 的位置（通过 JS 设置 top/left/transform） */
.chip-indicator{
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  background: var(--green-700);
  border-radius: 999px;
  z-index: -1;
  pointer-events: none;
  transition: transform var(--dur-base) var(--ease-soft),
              width var(--dur-base) var(--ease-soft),
              top var(--dur-base) var(--ease-soft),
              height var(--dur-base) var(--ease-soft);
  box-shadow: 0 6px 16px -4px rgba(20, 66, 47, .35);
}
.cat-tab{
  position: relative;
  z-index: 1;
  transition: color var(--dur-fast) var(--ease-out),
              background var(--dur-fast) var(--ease-out);
}
.cat-tab.is-on{ color: #fff; background: transparent; }
.cat-tab:not(.is-on):hover{ color: var(--green-700); }

/* === feed-item 卡片化 === */
.feed-item{
  background: #fff;
  border: 1px solid var(--green-100);
  border-radius: var(--radius-card);
  padding: 24px 24px;
  margin-bottom: 16px;
  position: relative;
  transition: transform var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out),
              border-color var(--dur-base) var(--ease-out);
  opacity: 1;  /* 覆盖原 opacity transition */
}
.feed-item:hover{
  transform: translateX(4px);
  border-color: var(--green-200);
  box-shadow: 0 16px 36px -16px rgba(20, 66, 47, .14),
              0 4px 12px -6px rgba(20, 66, 47, .08);
  opacity: 1;
}
.feed-item:first-child{ padding-top: 24px; }
.feed-item:last-child{ margin-bottom: 0; }
.feed-item::before{
  content: "";
  position: absolute;
  left: 0; top: 24px; bottom: 24px;
  width: 3px;
  background: var(--green-700);
  border-radius: 0 3px 3px 0;
  transform: scaleY(0);
  transform-origin: center;
  transition: transform var(--dur-base) var(--ease-soft);
}
.feed-item:hover::before{ transform: scaleY(1); }

/* === feed-thumb 悬浮缩放 === */
.feed-thumb{
  transition: transform var(--dur-slow) var(--ease-soft);
  transform: translateZ(0);
}
.feed-item:hover .feed-thumb{ transform: scale(1.04); }
.feed-thumb::after{
  transition: opacity var(--dur-base) var(--ease-out);
}
.feed-item:hover .feed-thumb::after{ opacity: .85; }
.feed-thumb .lbl,
.feed-thumb .pill{
  transition: transform var(--dur-base) var(--ease-out);
}
.feed-item:hover .feed-thumb .lbl{ transform: translateY(-2px); }
.feed-item:hover .feed-thumb .pill{ transform: translateY(-2px); }

/* === side-card 微微浮起 === */
.side-card{
  transition: transform var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out),
              border-color var(--dur-base) var(--ease-out);
}
.side-card:hover{
  transform: translateY(-3px);
  border-color: var(--green-200);
  box-shadow: 0 20px 44px -18px rgba(20, 66, 47, .18);
}

/* === rank 列表 hover 左侧绿条 === */
.rank a{
  position: relative;
  transition: background var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out),
              padding-left var(--dur-fast) var(--ease-out);
}
.rank a::before{
  content: "";
  position: absolute;
  left: 0; top: 50%;
  width: 3px;
  height: 0;
  background: var(--green-700);
  border-radius: 0 2px 2px 0;
  transform: translateY(-50%);
  transition: height var(--dur-fast) var(--ease-out);
}
.rank a:hover{
  background: var(--green-50);
  color: var(--green-700);
  padding-left: 14px;
}
.rank a:hover::before{ height: 60%; }

/* === 日历列表 hover 日期块翻转 === */
.cal a{
  transition: background var(--dur-fast) var(--ease-out);
}
.cal a:hover{ background: var(--green-50); }
.cal .d{
  transition: background var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out);
}
.cal a:hover .d{
  background: var(--green-700);
  border-color: var(--green-700);
}
.cal a:hover .d b,
.cal a:hover .d span{ color: #fff; }
.cal a:hover .t{ color: var(--green-700); }
.cal .d b,
.cal .d span{
  transition: color var(--dur-fast) var(--ease-out);
}

/* === side-cta 装饰光斑微微脉冲 === */
.side-cta::before{
  content: "";
  position: absolute;
  width: 240px;
  height: 240px;
  left: -80px;
  top: -100px;
  background: radial-gradient(closest-side, rgba(255,255,255,.10), transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  animation: blob-drift 14s var(--ease-in-out) infinite;
}

/* === 列表数 count 数字微微放大 === */
.list-count b{
  display: inline-block;
  transition: transform var(--dur-base) var(--ease-out),
              color var(--dur-base) var(--ease-out);
}
.list-count b.is-pulse{
  animation: count-pulse 600ms var(--ease-out);
}
@keyframes count-pulse{
  0%   { transform: scale(1); }
  50%  { transform: scale(1.18); color: var(--green-900); }
  100% { transform: scale(1); }
}

/* === hero-facts 数字 count-up 视觉强化 === */
.hero-facts .fact b{
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

/* =============================================================
   v4 详情页动效 (T4 详情页升级)
   2026-09-11 — hero 滚动驱动 + 段落错位入场 + 相关推荐 hover
   ============================================================= */

/* === hero 滚动驱动缩放（通过 JS 设置 --scroll 变量）=== */
.page-hero[data-scroll-hero],
.art-head[data-scroll-hero]{
  --scroll: 0;
  transform: scale(calc(1 - var(--scroll) * .04));
  opacity: calc(1 - var(--scroll) * .55);
  transform-origin: center top;
  will-change: transform, opacity;
}

/* === 内容区块 stagger reveal（自动给段落加 data-reveal 后由 motion.js 处理）=== */
.doc h2,
.doc p,
.doc ul,
.doc ol,
.art-body h2,
.art-body p,
.art-body ul,
.art-body ol,
.art-body blockquote,
.cms-lead,
.cms-list li,
.cms-subsection,
.cms-faq,
.info-grid,
.steps,
.faq-item,
.checklist,
.stat-row{
  opacity: 1; /* 默认可见；配合 data-reveal 时由 motion.css 接管 */
}

/* === 相关推荐卡片增强 === */
.rel{
  transition: transform var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out);
}
.rel:hover{
  transform: translateY(-6px);
  box-shadow: 0 20px 40px -16px rgba(20, 66, 47, .16);
}
.rel .cv{
  overflow: hidden;
  position: relative;
}
.rel .cv .pill{
  position: absolute;
  left: 14px; top: 14px; z-index: 2;
  font-size: 11px; font-weight: 600; color: #fff;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  padding: 4px 9px; border-radius: 999px;
}
.rel .cv .cap{
  position: absolute;
  left: 18px; bottom: 16px; z-index: 2;
  font-size: 16px; font-weight: 700; color: #fff;
  line-height: 1.35; padding-right: 18px;
  text-shadow: 0 2px 10px rgba(0,0,0,.32);
}
.rel .cv::after{
  transition: opacity var(--dur-base) var(--ease-out);
}
.rel:hover .cv::after{
  opacity: .7;
}

/* === 详情页 side-card 强化 === */
.side-card .side-nav a{
  position: relative;
  transition: background var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out),
              padding-left var(--dur-fast) var(--ease-out);
}
.side-card .side-nav a.is-on,
.side-card .side-nav a:hover{
  padding-left: 18px;
}
.side-card .side-nav a::before{
  content: "";
  position: absolute;
  left: 0; top: 50%;
  width: 3px;
  height: 0;
  background: var(--green-700);
  border-radius: 0 2px 2px 0;
  transform: translateY(-50%);
  transition: height var(--dur-fast) var(--ease-out);
}
.side-card .side-nav a.is-on::before,
.side-card .side-nav a:hover::before{
  height: 55%;
}

/* === art-cover 视差容器 === */
.art-cover[data-parallax]{
  overflow: hidden;
}
.art-cover[data-parallax] .cap{
  transform: translateY(calc(var(--parallax, 0) * -20px));
  transition: transform .1s linear;
}

/* === page-hero / art-head 装饰：给详情页补 bg-blobs === */
.page-hero,
.art-head{
  position: relative;
  overflow: hidden;
}
.page-hero > .bg-blobs,
.art-head > .bg-blobs{
  z-index: 0;
}
.page-hero > .container,
.art-head > *:not(.bg-blobs){
  position: relative;
  z-index: 1;
}

/* === 移动端适配：滚动驱动在窄屏减弱 === */
@media (max-width:600px){
  .page-hero[data-scroll-hero],
  .art-head[data-scroll-hero]{
    transform: none;
    opacity: 1;
  }
}

/* =============================================================
   v5 子频道动效 (T5 子频道升级)
   2026-09-11 — 大字 tagline 滚动标记 + 流程步骤错位入场
   ============================================================= */

/* === 大字 tagline 标记：滚动入场时从左划开 === */
.park-hero h1 em::after,
.mall-hero h1 em::after,
.ai-hero h1 em::after{
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 900ms var(--ease-soft) 300ms;
}
h1.is-revealed em::after,
.is-revealed h1 em::after{
  transform: scaleX(1);
}

/* === hero 容器定位（供 bg-blobs 装饰）=== */
.park-hero,
.mall-hero,
.ai-hero,
.pd-hero,
.md-hero{
  position: relative;
  overflow: hidden;
}
.pd-hero > .bg-blobs,
.md-hero > .bg-blobs{
  z-index: 0;
}
.pd-hero > .container,
.md-hero > .container{
  position: relative;
  z-index: 1;
}

/* === 4 步流程：连接线进度动画 === */
.flow-steps[data-reveal]::before{
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 1.4s var(--ease-soft) 500ms;
}
.flow-steps[data-reveal].is-revealed::before{
  transform: scaleX(1);
}

/* === 子频道卡片 hover 增强 === */
.park-card,
.mall-card,
.agent{
  transition: transform var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out),
              border-color var(--dur-base) var(--ease-out);
}
.park-card:hover,
.mall-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 20px 44px -16px rgba(20, 66, 47, .18);
}

/* === ai-hero 深色背景下的 count-up 后缀可读性 === */
.ai-hero .stats .n[data-count]::after{
  color: rgba(255, 255, 255, .72);
}

/* === 子频道详情页 hero 滚动驱动 === */
.pd-hero[data-scroll-hero],
.md-hero[data-scroll-hero],
.ad-hero[data-scroll-hero],
.geo-hero[data-scroll-hero]{
  --scroll: 0;
  transform: scale(calc(1 - var(--scroll) * .04));
  opacity: calc(1 - var(--scroll) * .55);
  transform-origin: center top;
  will-change: transform, opacity;
}
@media (max-width:600px){
  .pd-hero[data-scroll-hero],
  .md-hero[data-scroll-hero],
  .ad-hero[data-scroll-hero],
  .geo-hero[data-scroll-hero]{
    transform: none;
    opacity: 1;
  }
}

/* === a11y：v5 动效禁用 === */
@media (prefers-reduced-motion: reduce){
  .park-hero h1 em::after,
  .mall-hero h1 em::after,
  .ai-hero h1 em::after,
  .flow-steps[data-reveal]::before{
    transform: scaleX(1) !important;
    transition: none !important;
  }
}

/* === v6: feed 异步渲染前的空态占位（防 CLS）=== */
.feed:empty{min-height:1000px}
@media (max-width:600px){.feed:empty{min-height:1400px}}
.side:empty{min-height:420px}

/* =============================================================
   v7: 注册/登录弹窗（36kr 风格，auth-modal.js 注入）
   ============================================================= */
.auth-mask{
  position:fixed;inset:0;z-index:1200;
  background:rgba(20,26,23,.48);
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  animation:authFadeIn .18s ease;
}
.auth-mask[hidden]{display:none}
@keyframes authFadeIn{from{opacity:0}to{opacity:1}}
@keyframes authPop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}

.auth-modal{
  position:relative;width:400px;max-width:100%;
  background:#fff;border-radius:18px;
  box-shadow:0 24px 80px -16px rgba(20,66,47,.35);
  padding:34px 34px 26px;
  animation:authPop .22s cubic-bezier(.2,.8,.3,1);
  max-height:calc(100vh - 40px);overflow-y:auto;
}
.auth-close{
  position:absolute;top:12px;right:12px;width:32px;height:32px;
  border:none;background:transparent;border-radius:50%;
  font-size:22px;color:var(--ink-400);cursor:pointer;line-height:1;
  transition:background .15s,color .15s;
}
.auth-close:hover{background:var(--green-50);color:var(--ink-900)}

.auth-logo{text-align:center;margin-bottom:6px}
.auth-logo img{height:34px;width:auto;object-fit:contain}
.auth-hi{text-align:center;font-size:18px;font-weight:700;color:var(--ink-900);margin:4px 0 24px;letter-spacing:-.01em}

/* 输入区 */
.auth-field{
  display:flex;align-items:center;gap:10px;
  background:var(--green-50);border:1px solid transparent;border-radius:var(--radius-input);
  padding:0 14px;height:48px;margin-bottom:14px;
  transition:border-color .15s,background .15s;
}
.auth-field:focus-within{background:#fff;border-color:var(--green-200)}
.auth-code-prefix{
  flex:0 0 auto;font-size:14px;font-weight:600;color:var(--ink-700);
  padding-right:10px;border-right:1px solid var(--ink-200);
}
.auth-field input{
  flex:1;min-width:0;border:none;background:transparent;outline:none;
  font-size:15px;color:var(--ink-900);height:100%;
}
.auth-field input::placeholder{color:var(--ink-300)}
.auth-send{
  flex:0 0 auto;border:none;background:transparent;cursor:pointer;
  font-size:13px;font-weight:600;color:var(--green-700);padding:6px 2px;white-space:nowrap;
}
.auth-send:disabled{color:var(--ink-300);cursor:not-allowed}

/* 主按钮（36kr 大圆角通栏） */
.auth-submit{
  width:100%;height:46px;margin-top:4px;
  border:none;border-radius:999px;cursor:pointer;
  background:linear-gradient(135deg,var(--green-700),var(--green-500));
  color:#fff;font-size:16px;font-weight:600;letter-spacing:.06em;
  transition:opacity .15s,transform .15s;
  box-shadow:0 10px 26px -10px rgba(29,91,70,.55);
}
.auth-submit:hover{opacity:.92}
.auth-submit:active{transform:translateY(1px)}
.auth-submit:disabled{opacity:.55;cursor:not-allowed;transform:none}
/* 会员视图：GEO 工作台主按钮 + 退出登录次级按钮 */
.auth-logout-btn{
  display:block;width:100%;height:40px;margin-top:12px;
  border:1px solid var(--ink-200);border-radius:999px;background:#fff;cursor:pointer;
  color:var(--ink-400);font-size:14px;font-weight:600;
  transition:border-color .15s,color .15s;
}
.auth-logout-btn:hover{border-color:var(--green-200);color:var(--green-700)}

.auth-alt{
  text-align:center;font-size:13px;color:var(--green-700);font-weight:500;
  margin-top:16px;cursor:pointer;
}
.auth-alt:hover{text-decoration:underline}
.auth-hint{
  text-align:center;font-size:12px;color:var(--green-600);
  margin-top:10px;line-height:1.5;
}

/* 其他登录方式 */
.auth-others{
  display:flex;align-items:center;gap:12px;
  margin:26px 0 18px;
}
.auth-others-label{flex:0 0 auto;font-size:12px;color:var(--ink-400)}
.auth-others-line{flex:1;height:1px;background:var(--ink-200)}
.auth-icons{display:flex;justify-content:center;gap:36px;margin-bottom:22px}
.auth-icon-btn{
  width:48px;height:48px;border-radius:50%;
  border:1px solid var(--ink-200);background:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:border-color .15s,transform .15s,box-shadow .15s;
}
.auth-icon-btn:hover{
  border-color:var(--green-200);transform:translateY(-2px);
  box-shadow:var(--shadow-card);
}

/* 协议 */
.auth-agreement{
  text-align:center;font-size:12px;color:var(--ink-400);line-height:1.7;
  border-top:1px solid var(--green-50);padding-top:16px;margin:0;
}
.auth-agreement a{color:var(--green-700)}
.auth-agreement a:hover{text-decoration:underline}

/* 已登录：会员信息视图 */
.auth-profile{text-align:center}
.auth-avatar{
  width:64px;height:64px;border-radius:50%;margin:4px auto 12px;
  background:linear-gradient(135deg,var(--green-700),var(--green-500));
  color:#fff;font-size:26px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.auth-p-name{font-size:19px;font-weight:700;color:var(--ink-900)}
.auth-p-mobile{font-size:13px;color:var(--ink-400);margin-top:4px}
.auth-p-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
  margin:22px 0 14px;
}
.auth-p-item{
  background:var(--green-50);border-radius:12px;padding:14px 10px;
  display:flex;flex-direction:column;gap:6px;
}
.auth-p-item .k{font-size:12px;color:var(--ink-400)}
.auth-p-item .v{font-size:16px;font-weight:700;color:var(--green-700);font-feature-settings:"tnum" 1}
.auth-p-tip{font-size:12px;color:var(--ink-400);margin-bottom:18px;line-height:1.6}

/* Toast */
.auth-toast{
  position:fixed;left:50%;bottom:48px;transform:translate(-50%,20px);
  z-index:1300;max-width:82vw;
  background:rgba(26,26,23,.9);color:#fff;
  font-size:13px;line-height:1.5;padding:10px 18px;border-radius:10px;
  opacity:0;pointer-events:none;
  transition:opacity .2s,transform .2s;
}
.auth-toast.show{opacity:1;transform:translate(-50%,0)}
.auth-toast.err{background:rgba(160,47,42,.92)}

@media (max-width:600px){
  .auth-modal{padding:26px 20px 20px;border-radius:14px}
  .auth-hi{font-size:16px}
  .auth-icons{gap:24px}
}