/* roulang page: index */
:root{
  --ink:#121514;
  --lime:#C9F24D;
  --ember:#FF5A2A;
  --paper:#F7F5EF;
  --panel:#141715;
  --white:#FFFFFF;
  --sub:#5D635E;
  --line:#DDE2D8;
  --r-sm:8px;
  --r-md:16px;
  --r-lg:22px;
  --shadow-card:0 1px 0 rgba(17,19,18,.06), 0 12px 30px rgba(17,19,18,.06);
  --shadow-lift:0 18px 50px rgba(17,19,18,.12);
  --section:clamp(56px,8vw,112px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  font-size:17px;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:none}
input,textarea,select{font-family:inherit;font-size:inherit}
h1,h2,h3,h4{margin:0;font-weight:800;letter-spacing:-0.02em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
.wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 20px}
.section{padding-top:var(--section);padding-bottom:var(--section)}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:12.5px;font-weight:700;letter-spacing:.08em;
  background:rgba(201,242,77,.16);
  color:var(--ink);
  padding:6px 14px;border-radius:999px;
}
.eyebrow i{color:#7da512}
.h-display{
  font-size:clamp(2.4rem,6vw,5.2rem);
  line-height:1.06;
  letter-spacing:-0.035em;
  font-weight:900;
}
.h-sec{
  font-size:clamp(1.8rem,4vw,3.2rem);
  line-height:1.15;
  letter-spacing:-0.03em;
  font-weight:900;
}
.h-card{font-size:1.28rem;line-height:1.35;font-weight:800}
.lead{color:var(--sub);font-size:1.06rem;line-height:1.85}
.muted{color:var(--sub)}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  border-radius:11px;
  padding:13px 24px;
  font-weight:700;
  font-size:15.5px;
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease, color .22s ease;
  white-space:nowrap;
}
.btn i{transition:transform .22s ease}
.btn:hover{transform:translateY(-1px)}
.btn:hover i{transform:translateX(3px)}
.btn-primary{background:var(--ink);color:var(--lime);box-shadow:0 10px 24px rgba(17,19,18,.18)}
.btn-primary:hover{box-shadow:0 16px 34px rgba(17,19,18,.26)}
.btn-lime{background:var(--lime);color:var(--ink);box-shadow:0 10px 24px rgba(160,200,40,.28)}
.btn-lime:hover{box-shadow:0 16px 34px rgba(160,200,40,.38)}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn-ghost:hover{border-color:var(--lime);background:rgba(201,242,77,.14)}
.btn-outline-light{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.35)}
.btn-outline-light:hover{border-color:var(--lime);color:var(--lime);background:rgba(201,242,77,.08)}

.card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--r-md);
  box-shadow:var(--shadow-card);
  transition:transform .26s ease, box-shadow .26s ease, border-color .26s ease;
}
.card:hover{transform:translateY(-2px);border-color:var(--lime);box-shadow:var(--shadow-lift)}
.chip{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(201,242,77,.18);
  color:var(--ink);
  font-size:12.5px;font-weight:700;
  padding:5px 12px;border-radius:999px;
}
.chip-ember{background:rgba(255,90,42,.14);color:#b83a15}
.chip-dark{background:rgba(255,255,255,.1);color:var(--lime)}

.navshell{
  position:sticky;top:12px;z-index:60;
}
.navcard{
  background:rgba(255,255,255,.96);
  backdrop-filter:saturate(150%) blur(6px);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:0 1px 0 rgba(17,19,18,.05), 0 14px 34px rgba(17,19,18,.08);
}
.navlink{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 14px;border-radius:11px;
  font-size:14.5px;font-weight:700;color:var(--ink);
  position:relative;
  transition:background .2s ease, color .2s ease;
}
.navlink:hover{background:rgba(201,242,77,.18)}
.navlink.active{background:rgba(201,242,77,.22)}
.navlink.active::after{
  content:"";position:absolute;left:14px;right:14px;bottom:3px;height:2.5px;
  background:var(--lime);border-radius:2px;
  animation:navbar .35s ease;
}
@keyframes navbar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.brandmark{
  width:38px;height:38px;border-radius:11px;
  background:var(--ink);color:var(--lime);
  display:grid;place-items:center;
  font-weight:900;font-size:17px;letter-spacing:-0.04em;
  box-shadow:inset 0 0 0 1px rgba(201,242,77,.25);
}

.hero-wrap{
  position:relative;overflow:hidden;border-radius:var(--r-lg);
  background:
    linear-gradient(180deg, rgba(247,245,239,0) 0%, rgba(247,245,239,.65) 100%),
    repeating-linear-gradient(115deg, rgba(18,21,20,.035) 0 1px, transparent 1px 22px);
}
.grid-lines{
  background-image:
    linear-gradient(rgba(18,21,20,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18,21,20,.05) 1px, transparent 1px);
  background-size:44px 44px;
}
.stat-card{
  background:var(--white);border:1px solid var(--line);border-radius:14px;
  padding:16px 18px;box-shadow:var(--shadow-card);
  transition:transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}
.stat-card:hover{transform:translateY(-2px);border-color:var(--lime);box-shadow:var(--shadow-lift)}
.stat-num{font-size:clamp(1.6rem,2.6vw,2.2rem);font-weight:900;line-height:1.05;letter-spacing:-0.03em}

.imgframe{overflow:hidden;border-radius:var(--r-md);position:relative}
.imgframe img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.card:hover .imgframe img, .imgframe:hover img{transform:scale(1.03)}

.tagline{height:1px;background:var(--line);border:0;margin:0}
.link-more{
  display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:14.5px;
  color:var(--ink);position:relative;
}
.link-more::after{
  content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;
  background:var(--lime);transform:scaleX(0);transform-origin:left;
  transition:transform .28s ease;
}
.link-more:hover::after{transform:scaleX(1)}
.link-more i{transition:transform .24s ease}
.link-more:hover i{transform:translateX(3px)}

.price-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-card)}
.price-card.recommend{
  background:var(--panel);color:#fff;border-color:transparent;
  box-shadow:0 26px 60px rgba(17,19,18,.28);
}
.price-card.recommend .muted{color:rgba(255,255,255,.7)}
.price-num{font-size:clamp(2rem,3.4vw,2.8rem);font-weight:900;letter-spacing:-0.03em;line-height:1.05}
.feat-row{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.7}
.feat-row i{margin-top:5px}
.feat-on i{color:#7da512}
.feat-off{color:var(--sub);text-decoration:line-through;text-decoration-color:rgba(93,99,94,.4)}
.price-card.recommend .feat-on i{color:var(--lime)}
.price-card.recommend .feat-off{color:rgba(255,255,255,.5)}

details.faq{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--shadow-card);overflow:hidden;
  transition:border-color .24s ease, box-shadow .24s ease;
}
details.faq + details.faq{margin-top:14px}
details.faq[open]{border-color:var(--lime);box-shadow:var(--shadow-lift)}
details.faq summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:20px 22px;font-weight:800;font-size:1.05rem;line-height:1.5;
}
details.faq summary::-webkit-details-marker{display:none}
.faq-plus{
  flex:0 0 auto;width:30px;height:30px;border-radius:9px;
  background:rgba(201,242,77,.25);color:var(--ink);
  display:grid;place-items:center;font-size:13px;
  transition:transform .3s ease, background .3s ease;
}
details.faq[open] .faq-plus{transform:rotate(135deg);background:var(--lime)}
.faq-body{padding:0 22px 22px;color:var(--sub);font-size:15.6px;line-height:1.85}

.cta-panel{
  background:var(--panel);color:#fff;border-radius:var(--r-lg);
  position:relative;overflow:hidden;
  box-shadow:0 26px 60px rgba(17,19,18,.26);
}
.cta-panel::before{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(115deg, rgba(201,242,77,.09) 0 2px, transparent 2px 34px);
  pointer-events:none;
}

.site-footer{background:var(--panel);color:#fff;margin-top:var(--section)}
.site-footer a{color:rgba(255,255,255,.74);transition:color .2s ease}
.site-footer a:hover{color:var(--lime)}
.foot-title{font-size:13px;font-weight:800;letter-spacing:.1em;color:rgba(255,255,255,.55)}

.reveal{opacity:0;transform:translateY(16px);transition:opacity .55s ease, transform .55s ease}
.reveal.in{opacity:1;transform:none}

.mobile-drawer{
  position:fixed;inset:0;z-index:80;display:none;
}
.mobile-drawer.open{display:block}
.drawer-panel{
  position:absolute;right:0;top:0;bottom:0;width:min(86vw,360px);
  background:var(--white);border-left:1px solid var(--line);
  padding:22px 20px;display:flex;flex-direction:column;gap:12px;
  box-shadow:-20px 0 50px rgba(17,19,18,.18);
  overflow-y:auto;
}
.drawer-link{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;border-radius:12px;border:1px solid var(--line);
  font-weight:700;background:var(--paper);
}
.drawer-link.active{background:rgba(201,242,77,.24);border-color:var(--lime)}
.drawer-mask{position:absolute;inset:0;background:rgba(18,21,20,.5)}

@media (max-width:1023px){
  body{font-size:16.5px}
  .navshell{top:8px}
}
@media (max-width:640px){
  .wrap{padding:0 18px}
  .btn{width:100%}
  .hero-cta{flex-direction:column;width:100%}
}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
  .reveal{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* roulang page: article */
:root{
  --ink:#121514;
  --lime:#C9F24D;
  --spark:#FF5A2A;
  --bg:#F7F5EF;
  --card:#FFFFFF;
  --panel:#141715;
  --text:#111312;
  --muted:#5D635E;
  --line:#DDE2D8;
  --r-sm:8px;
  --r-md:12px;
  --r-lg:16px;
  --r-xl:22px;
  --shadow-card:0 1px 0 rgba(17,19,18,.06), 0 12px 30px rgba(17,19,18,.06);
  --shadow-lift:0 18px 50px rgba(17,19,18,.12);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg);
  color:var(--text);
  font-size:16.5px;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--lime);outline-offset:2px;border-radius:6px}
.wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 20px}
.muted{color:var(--muted)}
.tagline{height:1px;border:0;background:var(--line)}

/* 导航 */
.navshell{position:sticky;top:12px;z-index:60}
.navcard{
  background:rgba(255,255,255,.94);
  border:1px solid var(--line);
  border-radius:var(--r-xl);
  box-shadow:var(--shadow-card);
  backdrop-filter:saturate(1.2);
}
.brandmark{
  width:38px;height:38px;border-radius:12px;display:grid;place-items:center;
  background:var(--ink);color:var(--lime);font-weight:900;font-size:14px;letter-spacing:.04em;
}
.navlink{
  display:inline-flex;align-items:center;gap:7px;
  padding:9px 14px;border-radius:11px;font-size:14.5px;font-weight:600;color:#2b2f2c;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
.navlink:hover{background:rgba(201,242,77,.35);color:var(--ink);transform:translateY(-1px)}
.navlink.active{background:rgba(201,242,77,.55);color:var(--ink);box-shadow:inset 0 -2px 0 var(--lime)}
.drawer{display:none}
.drawer.open{display:block}
.drawer-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lift);padding:12px;
}
.drawer-link{
  display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;
  font-weight:650;border:1px solid transparent;
}
.drawer-link:hover,.drawer-link.active{background:rgba(201,242,77,.28);border-color:var(--line)}

/* 按钮 */
.btn{
  display:inline-flex;align-items:center;gap:8px;justify-content:center;
  padding:13px 26px;border-radius:var(--r-md);font-weight:700;font-size:15px;
  border:1px solid transparent;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease;
}
.btn i{transition:transform .2s ease}
.btn:hover i{transform:translateX(3px)}
.btn-dark{background:var(--ink);color:var(--lime);box-shadow:0 10px 24px rgba(17,19,18,.18)}
.btn-dark:hover{transform:translateY(-1px);box-shadow:var(--shadow-lift)}
.btn-lime{background:var(--lime);color:#111312;box-shadow:0 10px 24px rgba(201,242,77,.28)}
.btn-lime:hover{transform:translateY(-1px);box-shadow:var(--shadow-lift)}
.btn-ghost{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn-ghost:hover{background:rgba(201,242,77,.18);border-color:var(--lime)}
.linkline{
  font-weight:650;border-bottom:2px solid rgba(201,242,77,.9);padding-bottom:2px;
  transition:background .2s ease;
}
.linkline:hover{background:rgba(201,242,77,.28)}

/* 通用卡片与标签 */
.card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-card);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.card:hover{transform:translateY(-2px);border-color:var(--lime);box-shadow:var(--shadow-lift)}
.badge{
  display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;
  background:rgba(201,242,77,.22);color:#1d2119;font-size:12.5px;font-weight:700;
}
.badge-orange{background:rgba(255,90,42,.14);color:#B8380F}
.eyebrow{
  font-size:12.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#7A817A;
}
.grid-mesh{
  background-image:linear-gradient(rgba(17,19,18,.055) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(17,19,18,.055) 1px,transparent 1px);
  background-size:46px 46px;
}
.section{padding:clamp(52px,7vw,96px) 0}
.h1{font-size:clamp(1.9rem,4.4vw,3.3rem);font-weight:900;letter-spacing:-.03em;line-height:1.14;margin:0}
.h2{font-size:clamp(1.55rem,3vw,2.4rem);font-weight:850;letter-spacing:-.02em;line-height:1.2;margin:0}
.h3{font-size:1.22rem;font-weight:800;line-height:1.35;margin:0}

/* 面包屑 */
.crumb{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13.5px;color:var(--muted);
  background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 16px;
  box-shadow:var(--shadow-card);width:fit-content;max-width:100%;
}
.crumb a{font-weight:650;color:#2b2f2c}
.crumb a:hover{color:#000;background:rgba(201,242,77,.35);border-radius:8px;padding:2px 6px;margin:-2px -6px}

/* 文章正文排版 */
.article-shell{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);
  box-shadow:var(--shadow-card);padding:clamp(22px,4vw,52px);
}
.prose{max-width:790px;font-size:17.5px;line-height:1.92;color:#191c19}
.prose > * + *{margin-top:1.08em}
.prose h2{
  font-size:clamp(1.35rem,2.4vw,1.8rem);font-weight:850;line-height:1.3;letter-spacing:-.01em;
  margin-top:2em;padding-top:1em;border-top:1px solid var(--line);
}
.prose h3{font-size:1.2rem;font-weight:800;margin-top:1.6em}
.prose p{margin:0}
.prose a{font-weight:650;border-bottom:2px solid rgba(201,242,77,.9)}
.prose a:hover{background:rgba(201,242,77,.28)}
.prose ul,.prose ol{padding-left:1.35em;margin:0}
.prose li{margin:.45em 0}
.prose li::marker{color:#6B7460;font-weight:700}
.prose blockquote{
  margin:1.6em 0;padding:14px 20px;border-left:4px solid var(--lime);
  background:#FAFAF5;border-radius:0 var(--r-md) var(--r-md) 0;color:#2a2e2a;
}
.prose img{border-radius:var(--r-md);margin:1.4em 0;width:100%;object-fit:cover}
.prose table{width:100%;border-collapse:collapse;font-size:15.5px;margin:1.6em 0;display:block;overflow-x:auto}
.prose th,.prose td{border:1px solid var(--line);padding:10px 14px;text-align:left}
.prose th{background:#F3F4EE;font-weight:750}
.prose code{background:#F1F2EC;border-radius:6px;padding:2px 6px;font-size:15px}
.prose pre{background:#F1F2EC;border:1px solid var(--line);border-radius:var(--r-md);padding:16px;overflow:auto}
.prose pre code{background:none;padding:0}
.prose hr{border:0;height:1px;background:var(--line);margin:2em 0}

.empty-state{
  background:#fff;border:1px dashed var(--line);border-radius:var(--r-xl);
  padding:clamp(28px,5vw,56px);text-align:center;
}
.empty-state .icon{
  width:56px;height:56px;border-radius:18px;display:grid;place-items:center;margin:0 auto 16px;
  background:rgba(201,242,77,.28);color:#181B17;font-size:20px;
}

/* 推荐 & 侧栏 */
.mini-card{
  display:flex;gap:14px;align-items:flex-start;padding:14px;border-radius:var(--r-md);
  border:1px solid var(--line);background:#fff;transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease;
}
.mini-card:hover{border-color:var(--lime);transform:translateY(-2px);box-shadow:var(--shadow-card)}
.mini-thumb{width:76px;height:60px;border-radius:10px;object-fit:cover;flex:0 0 auto}
.side-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-card);padding:20px;
}
.toc a{
  display:block;padding:9px 12px;border-radius:10px;font-size:14.5px;color:#3A3F3A;font-weight:600;
}
.toc a:hover{background:rgba(201,242,77,.3);color:#111}

/* FAQ */
details.faq{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:16px 20px;box-shadow:var(--shadow-card);transition:border-color .2s ease;
}
details.faq + details.faq{margin-top:12px}
details.faq[open]{border-color:var(--lime)}
details.faq summary{
  cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:14px;
  align-items:center;font-weight:750;font-size:16.5px;
}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary .plus{
  width:26px;height:26px;border-radius:8px;background:rgba(201,242,77,.35);
  display:grid;place-items:center;font-weight:800;flex:0 0 auto;transition:transform .25s ease;
}
details.faq[open] summary .plus{transform:rotate(180deg)}
details.faq p{margin:12px 0 0;color:#3C413C;font-size:15.8px;line-height:1.85}

/* CTA 面板 */
.cta-panel{
  background:var(--panel);color:#fff;border-radius:var(--r-xl);
  padding:clamp(26px,4.6vw,54px);position:relative;overflow:hidden;
}
.cta-panel::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(201,242,77,.12),transparent 55%);
}

/* 页脚 */
.site-footer{background:var(--panel);color:#fff;margin-top:clamp(46px,6vw,88px)}
.site-footer a{color:rgba(255,255,255,.78)}
.site-footer a:hover{color:var(--lime)}
.foot-title{font-weight:800;font-size:15px;color:#fff;letter-spacing:.02em}

/* 动效 */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .card:hover,.mini-card:hover,.btn:hover{transform:none}
  .btn:hover i{transform:none}
}
@media (max-width:1023px){
  .navshell{top:8px}
}
@media (max-width:640px){
  body{font-size:16px}
  .wrap{padding:0 16px}
  .btn{padding:12px 20px;width:auto}
  .article-shell{padding:20px 18px}
  .prose{font-size:16.5px}
}

/* roulang page: category1 */
:root{
    --ink:#111312;
    --graphite:#121514;
    --panel:#141715;
    --lime:#C9F24D;
    --orange:#FF5A2A;
    --bg:#F7F5EF;
    --card:#FFFFFF;
    --muted:#5D635E;
    --line:#DDE2D8;
    --r-s:8px;
    --r-m:16px;
    --r-l:22px;
    --sh-1:0 1px 0 rgba(17,19,18,.06), 0 12px 30px rgba(17,19,18,.06);
    --sh-2:0 18px 50px rgba(17,19,18,.12);
    --font:"Inter","DIN Alternate",-apple-system,BlinkMacSystemFont,"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  }
  *,*::before,*::after{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%}
  body{
    margin:0;
    font-family:var(--font);
    background:var(--bg);
    color:var(--ink);
    font-size:17px;
    line-height:1.8;
    letter-spacing:.005em;
  }
  img{max-width:100%;display:block}
  a{color:inherit;text-decoration:none}
  button{font-family:inherit}
  p{margin:0 0 1.05em}
  h1,h2,h3,h4{margin:0;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
  ul{margin:0;padding:0;list-style:none}
  :focus-visible{outline:3px solid rgba(201,242,77,.9);outline-offset:2px;border-radius:6px}

  .wrap{max-width:1240px;margin:0 auto;padding:0 20px}
  .muted{color:var(--muted)}
  .linecol{border-color:var(--line)}

  /* ---------- 导航 ---------- */
  .navshell{position:sticky;top:12px;z-index:50;padding:0 16px}
  .navcard{
    max-width:1240px;margin:0 auto;
    background:rgba(255,255,255,.97);
    border:1px solid var(--line);
    border-radius:20px;
    box-shadow:var(--sh-1);
    backdrop-filter:saturate(120%) blur(6px);
  }
  .brandmark{
    width:38px;height:38px;border-radius:11px;background:var(--graphite);color:var(--lime);
    display:grid;place-items:center;font-weight:900;font-size:13px;letter-spacing:.06em;
    flex:0 0 auto;
  }
  .navlink{
    display:inline-flex;align-items:center;gap:8px;
    padding:9px 13px;border-radius:11px;
    font-size:14.5px;font-weight:650;color:#3c433e;
    border:1px solid transparent;transition:background .22s,color .22s,border-color .22s,box-shadow .22s;
    white-space:nowrap;
  }
  .navlink:hover{background:rgba(201,242,77,.16);border-color:rgba(201,242,77,.55);color:var(--graphite)}
  .navlink.active{background:rgba(201,242,77,.24);border-color:rgba(201,242,77,.9);color:var(--graphite);box-shadow:inset 0 -2px 0 var(--lime)}

  /* ---------- 按钮 ---------- */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:9px;
    padding:13px 26px;border-radius:11px;
    font-size:15px;font-weight:750;line-height:1;
    border:1px solid transparent;cursor:pointer;
    transition:transform .2s, box-shadow .2s, background .2s, color .2s, border-color .2s;
  }
  .btn i{transition:transform .2s}
  .btn:hover{transform:translateY(-1px)}
  .btn:hover i{transform:translateX(3px)}
  .btn-lime{background:var(--lime);color:var(--graphite);box-shadow:0 8px 22px rgba(201,242,77,.35)}
  .btn-lime:hover{box-shadow:0 14px 32px rgba(201,242,77,.45)}
  .btn-dark{background:var(--graphite);color:var(--lime);box-shadow:0 8px 22px rgba(18,21,20,.22)}
  .btn-dark:hover{box-shadow:0 14px 34px rgba(18,21,20,.3)}
  .btn-ghost{background:transparent;color:var(--graphite);border-color:#C7CDC2}
  .btn-ghost:hover{border-color:var(--lime);background:rgba(201,242,77,.1)}
  .btn-block{width:100%}

  /* ---------- 通用组件 ---------- */
  .badge{
    display:inline-flex;align-items:center;gap:6px;
    padding:5px 12px;border-radius:999px;
    background:rgba(201,242,77,.18);color:#2c3129;
    font-size:12.5px;font-weight:700;letter-spacing:.02em;
  }
  .badge-orange{background:rgba(255,90,42,.13);color:#B23413}
  .card{
    background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);
    box-shadow:var(--sh-1);
    transition:transform .25s, box-shadow .25s, border-color .25s;
  }
  .card:hover{transform:translateY(-2px);border-color:rgba(201,242,77,.9);box-shadow:var(--sh-2)}
  .section{padding:clamp(56px,8vw,104px) 0}
  .eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    font-size:12.5px;font-weight:800;letter-spacing:.16em;color:#5a6157;
    text-transform:uppercase;
  }
  .eyebrow::before{content:"";width:22px;height:2px;background:var(--lime);display:block}
  .h2{font-size:clamp(1.75rem,3.6vw,2.7rem);line-height:1.16;font-weight:850}
  .h3{font-size:clamp(1.2rem,1.6vw,1.42rem);line-height:1.3;font-weight:800}
  .lead{font-size:clamp(1.02rem,1.4vw,1.13rem);color:#41473f;line-height:1.85}
  .num{font-variant-numeric:tabular-nums;font-weight:900;letter-spacing:-.03em}

  .gridline{background-image:linear-gradient(rgba(17,19,18,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(17,19,18,.045) 1px,transparent 1px);background-size:44px 44px}

  .imgframe{border-radius:var(--r-m);overflow:hidden;border:1px solid var(--line);background:#ecebe5}
  .imgframe img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
  .imgframe:hover img{transform:scale(1.03)}

  /* ---------- Hero ---------- */
  .cat-hero{position:relative;overflow:hidden;padding:clamp(36px,5vw,64px) 0 clamp(20px,3vw,32px)}
  .cat-hero::after{
    content:"";position:absolute;right:-140px;top:-90px;width:460px;height:460px;border-radius:50%;
    background:radial-gradient(circle,rgba(201,242,77,.32),rgba(201,242,77,0) 68%);
    pointer-events:none;
  }
  .hero-h1{font-size:clamp(2.1rem,5.2vw,4.2rem);line-height:1.06;letter-spacing:-.035em;font-weight:900}
  .hero-h1 .accent{color:#1d211c;background:linear-gradient(transparent 62%, rgba(201,242,77,.85) 62%)}
  .statcard{
    background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;
    box-shadow:var(--sh-1);transition:transform .22s,border-color .22s,box-shadow .22s;
  }
  .statcard:hover{transform:translateY(-2px);border-color:rgba(201,242,77,.9);box-shadow:var(--sh-2)}
  .statcard .v{font-size:clamp(1.5rem,2.6vw,1.95rem);line-height:1;font-variant-numeric:tabular-nums;font-weight:900;letter-spacing:-.03em}

  /* ---------- 编号特性卡 ---------- */
  .feature-big{position:relative;overflow:hidden;background:var(--graphite);color:#fff;border-radius:var(--r-l);border:1px solid #232823}
  .feature-big .idx{font-size:13px;font-weight:800;letter-spacing:.2em;color:var(--lime)}
  .feature-small{background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:26px;box-shadow:var(--sh-1);transition:transform .25s,border-color .25s,box-shadow .25s}
  .feature-small:hover{transform:translateY(-2px);border-color:rgba(201,242,77,.9);box-shadow:var(--sh-2)}
  .iconbox{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(201,242,77,.2);color:#232823;font-size:16px}

  /* ---------- 清单 ---------- */
  .checklist li{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px dashed var(--line);font-size:16px}
  .checklist li:last-child{border-bottom:0}
  .checklist i{color:#3f4a33;background:rgba(201,242,77,.28);width:22px;height:22px;border-radius:7px;display:grid;place-items:center;font-size:11px;flex:0 0 auto;margin-top:4px}

  /* ---------- 步骤 ---------- */
  .step{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:24px;box-shadow:var(--sh-1);transition:transform .25s,border-color .25s,box-shadow .25s}
  .step:hover{transform:translateY(-2px);border-color:rgba(201,242,77,.9);box-shadow:var(--sh-2)}
  .step .sn{font-size:13px;font-weight:900;letter-spacing:.18em;color:var(--orange)}

  /* ---------- FAQ ---------- */
  .faq-item{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-1);overflow:hidden;transition:border-color .22s,box-shadow .22s}
  .faq-item[open]{border-color:rgba(201,242,77,.95);box-shadow:var(--sh-2)}
  .faq-item summary{
    list-style:none;cursor:pointer;padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;
    font-weight:750;font-size:16.5px;
  }
  .faq-item summary::-webkit-details-marker{display:none}
  .faq-item summary .plus{
    width:30px;height:30px;border-radius:9px;background:rgba(201,242,77,.24);display:grid;place-items:center;
    font-size:13px;flex:0 0 auto;transition:transform .28s,background .28s;
  }
  .faq-item[open] summary .plus{transform:rotate(180deg);background:var(--lime)}
  .faq-body{padding:0 22px 22px;color:#464c45;font-size:15.8px;line-height:1.85}

  /* ---------- CTA ---------- */
  .cta-panel{background:var(--panel);border-radius:var(--r-l);padding:clamp(30px,5vw,58px);position:relative;overflow:hidden}
  .cta-panel::before{
    content:"";position:absolute;inset:0;
    background-image:repeating-linear-gradient(115deg,rgba(201,242,77,.07) 0 2px,transparent 2px 26px);
    pointer-events:none;
  }

  /* ---------- 页脚 ---------- */
  .site-footer{background:var(--panel);color:#fff;margin-top:clamp(48px,7vw,96px)}
  .site-footer a{color:rgba(255,255,255,.74);transition:color .2s}
  .site-footer a:hover{color:var(--lime)}
  .foot-title{font-size:12.5px;font-weight:800;letter-spacing:.18em;color:var(--lime)}
  .tagline{height:1px;border:0;margin:0}

  /* ---------- 移动端抽屉 ---------- */
  .drawer{position:fixed;inset:0;z-index:70;background:rgba(18,21,20,.52);opacity:0;pointer-events:none;transition:opacity .26s}
  .drawer.open{opacity:1;pointer-events:auto}
  .drawer-panel{
    position:absolute;right:0;top:0;bottom:0;width:min(88vw,350px);background:#fff;
    border-radius:22px 0 0 22px;padding:22px;display:flex;flex-direction:column;gap:10px;
    transform:translateX(18px);transition:transform .28s;overflow-y:auto;
  }
  .drawer.open .drawer-panel{transform:none}
  .drawer-panel .navlink{width:100%;justify-content:flex-start;padding:14px 14px;border:1px solid var(--line);background:#FBFBF7}

  /* ---------- 动效 ---------- */
  .reveal{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}
  .reveal.in{opacity:1;transform:none}

  @media (max-width:640px){
    body{font-size:16px}
    .navshell{top:8px;padding:0 12px}
    .btn{padding:12px 20px;font-size:14.5px}
  }
  @media (prefers-reduced-motion: reduce){
    .reveal{opacity:1;transform:none;transition:none}
    *{animation:none!important;transition:none!important}
  }

/* roulang page: category2 */
:root{
    --ink:#121514;
    --lime:#C9F24D;
    --spark:#FF5A2A;
    --warm:#F7F5EF;
    --panel:#141715;
    --line:#DDE2D8;
    --muted:#5D635E;
    --card:#FFFFFF;
    --r-sm:8px;
    --r-md:12px;
    --r-lg:18px;
    --r-xl:22px;
    --shadow-1:0 1px 0 rgba(17,19,18,.06), 0 12px 30px rgba(17,19,18,.06);
    --shadow-2:0 18px 50px rgba(17,19,18,.12);
  }

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

  html{scroll-behavior:smooth;}

  body{
    margin:0;
    background:var(--warm);
    color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
    font-size:16px;
    line-height:1.8;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
  }

  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  button,input,select,textarea{font:inherit;color:inherit;}

  h1,h2,h3,h4{margin:0;letter-spacing:-0.02em;line-height:1.2;}
  p{margin:0;}

  :focus-visible{
    outline:2px solid var(--lime);
    outline-offset:2px;
    border-radius:6px;
  }

  .wrap{
    width:100%;
    max-width:1240px;
    margin:0 auto;
    padding-left:18px;
    padding-right:18px;
  }

  .muted{color:var(--muted);}

  /* ---------- 导航 ---------- */
  .navshell{
    position:sticky;
    top:12px;
    z-index:60;
    padding-top:12px;
  }

  .navcard{
    background:rgba(255,255,255,.97);
    border:1px solid var(--line);
    border-radius:20px;
    box-shadow:var(--shadow-1);
    backdrop-filter:blur(8px);
  }

  .brandmark{
    width:40px;
    height:40px;
    border-radius:12px;
    display:grid;
    place-items:center;
    background:var(--ink);
    color:var(--lime);
    font-weight:900;
    font-size:14px;
    letter-spacing:.03em;
    flex:0 0 auto;
  }

  .navlink{
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:9px 13px;
    border-radius:11px;
    font-size:14.5px;
    font-weight:600;
    color:#2a2f2c;
    transition:background .22s ease,color .22s ease,box-shadow .22s ease;
    white-space:nowrap;
  }
  .navlink:hover{background:rgba(201,242,77,.22);color:var(--ink);}
  .navlink.active{
    background:rgba(201,242,77,.28);
    color:var(--ink);
    box-shadow:inset 0 -2px 0 var(--lime);
  }

  /* ---------- 按钮 ---------- */
  .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border-radius:11px;
    padding:13px 24px;
    font-weight:700;
    font-size:15px;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .22s ease,box-shadow .22s ease,background .22s ease,border-color .22s ease,color .22s ease;
    line-height:1.2;
  }
  .btn i{transition:transform .22s ease;}
  .btn:hover{transform:translateY(-1px);}
  .btn:hover i{transform:translateX(3px);}

  .btn-lime{background:var(--lime);color:var(--ink);}
  .btn-lime:hover{box-shadow:0 12px 26px rgba(201,242,77,.42);}

  .btn-dark{background:var(--ink);color:var(--lime);}
  .btn-dark:hover{box-shadow:0 14px 30px rgba(17,19,18,.28);}

  .btn-ghost{background:transparent;border-color:var(--ink);color:var(--ink);}
  .btn-ghost:hover{background:rgba(201,242,77,.16);border-color:var(--lime);}

  /* ---------- 徽章 / 标签 ---------- */
  .badge{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 12px;
    border-radius:999px;
    background:rgba(201,242,77,.2);
    color:var(--ink);
    font-size:12.5px;
    font-weight:700;
    letter-spacing:.02em;
  }
  .badge-outline{
    background:transparent;
    border:1px solid var(--line);
    color:var(--muted);
  }
  .badge-spark{
    background:rgba(255,90,42,.12);
    color:#B93812;
  }

  /* ---------- 卡片 ---------- */
  .card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:var(--r-lg);
    box-shadow:var(--shadow-1);
    transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
  }
  .card:hover{
    transform:translateY(-2px);
    border-color:var(--lime);
    box-shadow:var(--shadow-2);
  }

  .card-static:hover{transform:none;border-color:var(--line);box-shadow:var(--shadow-1);}

  /* ---------- 板块 ---------- */
  .sect{padding:clamp(56px,7.5vw,104px) 0;}
  .sect-tight{padding:clamp(40px,5vw,64px) 0;}

  .h2{
    font-size:clamp(1.7rem,3.6vw,2.7rem);
    font-weight:900;
    line-height:1.16;
  }
  .h3{
    font-size:clamp(1.15rem,1.6vw,1.4rem);
    font-weight:800;
    line-height:1.3;
  }
  .lead{
    font-size:clamp(1rem,1.3vw,1.08rem);
    line-height:1.9;
    color:var(--muted);
  }

  .rule-line{
    height:1px;
    background:var(--line);
    border:0;
    margin:0;
  }

  /* ---------- 面包屑 ---------- */
  .crumbs{
    display:flex;
    align-items:center;
    gap:9px;
    font-size:13px;
    color:var(--muted);
    margin-bottom:22px;
    flex-wrap:wrap;
  }
  .crumbs a{
    padding:5px 11px;
    border-radius:9px;
    background:#fff;
    border:1px solid var(--line);
    font-weight:600;
    transition:.2s;
  }
  .crumbs a:hover{background:rgba(201,242,77,.2);border-color:var(--lime);}
  .crumbs span{font-weight:700;color:var(--ink);}

  /* ---------- Hero ---------- */
  .hero-sect{
    padding:clamp(36px,5vw,64px) 0 clamp(48px,6vw,84px);
    background:
      linear-gradient(180deg, rgba(247,245,239,0) 0%, rgba(247,245,239,1) 100%),
      repeating-linear-gradient(115deg, rgba(18,21,20,.045) 0 1px, transparent 1px 26px),
      #F2F0E8;
  }
  .hero-h1{
    font-size:clamp(2rem,4.6vw,3.6rem);
    font-weight:900;
    letter-spacing:-0.03em;
    line-height:1.1;
  }
  .hero-sub{
    font-size:clamp(1rem,1.4vw,1.14rem);
    line-height:1.9;
    color:#41463f;
    max-width:44em;
  }
  .hero-media{
    border-radius:var(--r-xl);
    overflow:hidden;
    border:1px solid var(--line);
    box-shadow:var(--shadow-1);
    background:#fff;
  }
  .hero-media img{
    width:100%;
    height:clamp(210px,34vw,380px);
    object-fit:cover;
    transition:transform .6s ease;
  }
  .hero-media:hover img{transform:scale(1.03);}

  .anchor-card{
    position:sticky;
    top:104px;
  }
  .anchlink{
    display:flex;
    align-items:center;
    gap:9px;
    padding:10px 12px;
    border-radius:11px;
    font-size:14.5px;
    font-weight:600;
    color:#2a2f2c;
    transition:background .2s ease,color .2s ease,transform .2s ease;
  }
  .anchlink:hover{
    background:rgba(201,242,77,.22);
    color:var(--ink);
    transform:translateX(2px);
  }

  .stat-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--r-lg);
    padding:20px 22px;
    box-shadow:var(--shadow-1);
    transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
  }
  .stat-card:hover{transform:translateY(-2px);border-color:var(--lime);box-shadow:var(--shadow-2);}
  .stat-num{
    font-size:clamp(1.5rem,2.6vw,2rem);
    font-weight:900;
    font-variant-numeric:tabular-nums;
    letter-spacing:-0.02em;
    line-height:1.1;
  }

  /* ---------- 对比 ---------- */
  .compare-card{
    border-radius:var(--r-lg);
    border:1px solid var(--line);
    background:#fff;
    padding:clamp(22px,3vw,32px);
    box-shadow:var(--shadow-1);
    height:100%;
  }
  .compare-card.problem{border-top:4px solid var(--spark);}
  .compare-card.solved{border-top:4px solid var(--lime);}
  .compare-list{list-style:none;margin:22px 0 0;padding:0;}
  .compare-list li{
    display:flex;
    gap:11px;
    align-items:flex-start;
    padding:11px 0;
    border-bottom:1px dashed var(--line);
    font-size:15px;
    line-height:1.75;
    color:#3a3f39;
  }
  .compare-list li:last-child{border-bottom:0;}
  .mark{
    flex:0 0 auto;
    width:22px;height:22px;
    border-radius:7px;
    display:grid;place-items:center;
    font-size:11px;
    margin-top:3px;
  }
  .mark-problem{background:rgba(255,90,42,.14);color:#B93812;}
  .mark-solved{background:rgba(201,242,77,.32);color:#3F5306;}

  /* ---------- 服务模块网格 ---------- */
  .mod-card{
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  .mod-card img{
    width:100%;
    height:186px;
    object-fit:cover;
    transition:transform .5s ease;
  }
  .mod-card:hover img{transform:scale(1.03);}
  .mod-body{padding:20px 22px 24px;display:flex;flex-direction:column;flex:1;}
  .mod-body p{font-size:14.8px;line-height:1.8;color:var(--muted);}
  .mod-link{
    margin-top:auto;
    padding-top:16px;
    font-size:14px;
    font-weight:700;
    color:var(--ink);
    display:inline-flex;
    align-items:center;
    gap:7px;
  }
  .mod-link i{transition:transform .22s ease;}
  .mod-card:hover .mod-link i{transform:translateX(4px);}

  /* ---------- 流程 ---------- */
  .flow{
    display:grid;
    gap:16px;
    grid-template-columns:repeat(5,minmax(0,1fr));
  }
  .flow-item{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--r-lg);
    padding:20px 18px;
    box-shadow:var(--shadow-1);
    transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
  }
  .flow-item:hover{transform:translateY(-2px);border-color:var(--lime);box-shadow:var(--shadow-2);}
  .flow-step{
    font-size:13px;
    font-weight:900;
    font-variant-numeric:tabular-nums;
    color:#3F5306;
    background:rgba(201,242,77,.28);
    border-radius:8px;
    padding:3px 9px;
    display:inline-block;
  }

  /* ---------- 支持区 ---------- */
  .support-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--r-lg);
    padding:24px;
    box-shadow:var(--shadow-1);
    transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
  }
  .support-card:hover{transform:translateY(-2px);border-color:var(--lime);box-shadow:var(--shadow-2);}
  .icon-chip{
    width:42px;height:42px;
    border-radius:12px;
    display:grid;place-items:center;
    background:rgba(201,242,77,.24);
    color:#3F5306;
    font-size:15px;
    margin-bottom:16px;
  }

  /* ---------- 表单 ---------- */
  .field{display:flex;flex-direction:column;gap:8px;}
  .field label{
    font-size:14px;
    font-weight:700;
    color:#2a2f2c;
  }
  .field input,.field select,.field textarea{
    width:100%;
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
    padding:12px 14px;
    font-size:15px;
    line-height:1.6;
    transition:border-color .2s ease,box-shadow .2s ease;
    appearance:none;
  }
  .field select{
    background-image:linear-gradient(45deg,transparent 50%,#5D635E 50%),linear-gradient(135deg,#5D635E 50%,transparent 50%);
    background-position:calc(100% - 20px) calc(50% - 2px),calc(100% - 15px) calc(50% - 2px);
    background-size:5px 5px,5px 5px;
    background-repeat:no-repeat;
    padding-right:40px;
  }
  .field textarea{min-height:132px;resize:vertical;}
  .field input:focus,.field select:focus,.field textarea:focus{
    outline:none;
    border-color:var(--lime);
    box-shadow:0 0 0 4px rgba(201,242,77,.24);
  }
  .field input.invalid,.field select.invalid,.field textarea.invalid{
    border-color:var(--spark);
    box-shadow:0 0 0 4px rgba(255,90,42,.14);
  }
  .err{
    font-size:12.8px;
    color:#B93812;
    min-height:18px;
    display:none;
  }
  .err.show{display:block;}

  .form-note{
    font-size:13px;
    color:var(--muted);
    line-height:1.8;
  }
  .ok-box{
    display:none;
    align-items:flex-start;
    gap:12px;
    background:rgba(201,242,77,.2);
    border:1px solid var(--lime);
    border-radius:var(--r-md);
    padding:16px 18px;
    font-size:14.5px;
    line-height:1.75;
    color:#2c3a08;
  }
  .ok-box.show{display:flex;}

  /* ---------- FAQ ---------- */
  .faq-item{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--r-lg);
    box-shadow:var(--shadow-1);
    overflow:hidden;
    transition:border-color .25s ease,box-shadow .25s ease;
  }
  .faq-item[open]{
    border-color:var(--lime);
    box-shadow:var(--shadow-2);
  }
  .faq-item summary{
    list-style:none;
    cursor:pointer;
    padding:19px 22px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    font-weight:800;
    font-size:15.5px;
    line-height:1.6;
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-plus{
    flex:0 0 auto;
    width:28px;height:28px;
    border-radius:9px;
    display:grid;place-items:center;
    background:rgba(201,242,77,.28);
    color:#2c3a08;
    font-size:16px;
    font-weight:900;
    line-height:1;
    transition:transform .3s ease;
  }
  .faq-item[open] .faq-plus{transform:rotate(135deg);}
  .faq-answer{
    padding:0 22px 22px;
    font-size:15px;
    line-height:1.9;
    color:var(--muted);
  }

  /* ---------- CTA ---------- */
  .cta-panel{
    background:
      repeating-linear-gradient(115deg, rgba(201,242,77,.07) 0 1px, transparent 1px 30px),
      var(--panel);
    color:#fff;
    border-radius:var(--r-xl);
    padding:clamp(30px,5vw,56px);
    display:flex;
    flex-wrap:wrap;
    gap:26px;
    align-items:center;
    justify-content:space-between;
  }

  /* ---------- 页脚 ---------- */
  .site-footer{
    background:var(--panel);
    color:#fff;
    margin-top:clamp(40px,6vw,80px);
  }
  .foot-title{
    font-size:14px;
    font-weight:800;
    letter-spacing:.04em;
    color:#fff;
  }
  .site-footer ul{list-style:none;margin:0;padding:0;}
  .site-footer a{
    color:rgba(255,255,255,.74);
    transition:color .2s ease;
  }
  .site-footer a:hover{color:var(--lime);}
  hr.tagline{
    height:1px;
    border:0;
    margin:0;
  }

  /* ---------- 移动菜单 ---------- */
  .mobile-menu{
    position:fixed;
    inset:0;
    z-index:90;
    background:rgba(18,21,20,.55);
    display:none;
  }
  .mobile-menu.open{display:block;}
  .mobile-panel{
    position:absolute;
    top:0;right:0;bottom:0;
    width:min(86vw,340px);
    background:#fff;
    padding:22px 20px 26px;
    overflow-y:auto;
    border-radius:22px 0 0 22px;
    display:flex;
    flex-direction:column;
    gap:14px;
    animation:slideIn .28s ease;
  }
  @keyframes slideIn{from{transform:translateX(16px);opacity:.4}to{transform:none;opacity:1}}

  .drawer-link{
    display:flex;
    align-items:center;
    gap:10px;
    padding:13px 15px;
    border-radius:12px;
    border:1px solid var(--line);
    font-weight:700;
    font-size:15px;
    background:#fff;
    transition:.2s;
  }
  .drawer-link:hover{background:rgba(201,242,77,.2);border-color:var(--lime);}
  .drawer-link.active{background:rgba(201,242,77,.28);border-color:var(--lime);}

  /* ---------- 入场动画 ---------- */
  .reveal{
    opacity:0;
    transform:translateY(16px);
    transition:opacity .5s ease,transform .5s ease;
  }
  .reveal.in{opacity:1;transform:none;}

  @media (prefers-reduced-motion: reduce){
    *{animation:none !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
    .reveal{opacity:1;transform:none;}
  }

  /* ---------- 响应式 ---------- */
  @media (max-width:1024px){
    .flow{grid-template-columns:repeat(2,minmax(0,1fr));}
    .anchor-card{position:static;}
  }
  @media (max-width:640px){
    .flow{grid-template-columns:1fr;}
    .btn{width:100%;}
    .btn-inline-auto{width:auto;}
    .hero-media img{height:220px;}
    .crumbs{gap:7px;}
  }