/* roulang page: index */
:root{
  --bg:#0e1014;
  --bg-soft:#151922;
  --bg-card:#1a1f2a;
  --bg-card-2:#20262f;
  --line:#2a313d;
  --line-soft:#232a35;
  --text:#eef1f6;
  --text-2:#c3cbd8;
  --muted:#8b95a6;
  --primary:#ff5c2b;
  --primary-soft:#ff7c4d;
  --amber:#ffb020;
  --mint:#28d8a8;
  --violet:#8b7cff;
  --radius-s:10px;
  --radius:16px;
  --radius-l:24px;
  --shadow-s:0 4px 14px rgba(0,0,0,.28);
  --shadow:0 14px 40px rgba(0,0,0,.42);
  --shadow-glow:0 18px 48px rgba(255,92,43,.22);
  --gap:clamp(18px,2.4vw,30px);
  --section:clamp(56px,7vw,104px);
  --font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font);
  background:var(--bg);
  color:var(--text);
  font-size:16px;
  line-height:1.75;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto;}
a{color:inherit;text-decoration:none;transition:color .2s ease,border-color .2s ease,background-color .2s ease,transform .2s ease;}
button,input,textarea,select{font:inherit;color:inherit;}
button{cursor:pointer;border:0;background:none;}
h1,h2,h3,h4{margin:0;line-height:1.3;font-weight:700;letter-spacing:.005em;}
p{margin:0;}
ul,ol{margin:0;padding:0;list-style:none;}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:6px;}
::selection{background:rgba(255,92,43,.35);color:#fff;}

.container{width:100%;max-width:1220px;margin:0 auto;padding:0 clamp(18px,4vw,34px);}
.section{padding:var(--section) 0;}
.section--tight{padding:clamp(38px,4.6vw,64px) 0;}
.section--soft{background:var(--bg-soft);}
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);border:0;margin:0;}

/* ---------- 顶部导航 ---------- */
.site-header{
  position:sticky;top:0;z-index:60;
  background:rgba(14,16,20,.86);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-soft);
}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;height:72px;}
.brand{display:flex;align-items:center;gap:12px;flex:none;}
.brand-mark{
  width:42px;height:42px;border-radius:13px;flex:none;
  background:linear-gradient(140deg,var(--primary),var(--amber));
  display:grid;place-items:center;
  font-weight:800;font-size:19px;color:#16110c;letter-spacing:-.02em;
  box-shadow:0 8px 22px rgba(255,92,43,.3);
}
.brand-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-name{font-size:19px;font-weight:800;letter-spacing:.02em;}
.brand-sub{font-size:11px;color:var(--muted);letter-spacing:.16em;text-transform:uppercase;}
.nav{display:flex;align-items:center;gap:6px;}
.nav a{
  padding:9px 16px;border-radius:999px;font-size:15px;color:var(--text-2);
  border:1px solid transparent;
}
.nav a:hover{color:#fff;background:rgba(255,255,255,.06);}
.nav a.is-active{
  color:#fff;background:rgba(255,92,43,.14);border-color:rgba(255,92,43,.42);
}
.nav-cta{
  flex:none;display:inline-flex;align-items:center;gap:8px;
  padding:11px 20px;border-radius:999px;font-size:15px;font-weight:600;
  background:linear-gradient(135deg,var(--primary),var(--amber));color:#1a120b;
  box-shadow:0 10px 24px rgba(255,92,43,.26);
}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 16px 30px rgba(255,92,43,.34);}
.nav-toggle{
  display:none;width:44px;height:44px;border-radius:12px;
  border:1px solid var(--line);background:var(--bg-card);
  place-items:center;
}
.nav-toggle span{display:block;width:18px;height:2px;background:var(--text);border-radius:2px;position:relative;}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--text);border-radius:2px;}
.nav-toggle span::before{top:-6px;}
.nav-toggle span::after{top:6px;}
.mobile-nav{display:none;border-top:1px solid var(--line-soft);background:rgba(14,16,20,.98);}
.mobile-nav.open{display:block;}
.mobile-nav a{display:block;padding:15px 4px;border-bottom:1px solid var(--line-soft);font-size:16px;color:var(--text-2);}
.mobile-nav a.is-active{color:var(--primary-soft);}

/* ---------- 首屏 ---------- */
.hero{
  position:relative;overflow:hidden;
  padding:clamp(64px,9vw,118px) 0 clamp(56px,7vw,92px);
  background-image:linear-gradient(180deg,rgba(9,11,15,.9),rgba(9,11,15,.82) 45%,rgba(14,16,20,.98)),url('/assets/images/96a8d13c3f93c7cb.jpg');
  background-size:cover;background-position:center;
  border-bottom:1px solid var(--line-soft);
}
.hero::after{
  content:"";position:absolute;inset:auto -10% -40% -10%;height:320px;
  background:radial-gradient(60% 100% at 50% 0,rgba(255,92,43,.18),transparent 70%);
  pointer-events:none;
}
.hero-inner{position:relative;z-index:2;max-width:900px;margin:0 auto;text-align:center;}
.hero-tag{
  display:inline-flex;align-items:center;gap:9px;
  padding:7px 16px;border-radius:999px;font-size:13px;color:var(--text-2);
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);
  margin-bottom:22px;
}
.hero-tag i{width:7px;height:7px;border-radius:50%;background:var(--mint);display:block;box-shadow:0 0 0 4px rgba(40,216,168,.18);}
.hero h1{
  font-size:clamp(30px,5vw,58px);
  line-height:1.22;letter-spacing:-.01em;
}
.hero h1 em{
  font-style:normal;
  background:linear-gradient(120deg,var(--primary),var(--amber) 65%,var(--mint));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-lead{
  margin:22px auto 0;max-width:760px;
  font-size:clamp(15px,1.35vw,17.5px);color:var(--text-2);
}
.hero-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:34px;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 28px;border-radius:999px;font-size:15.5px;font-weight:600;
  border:1px solid transparent;transition:all .22s ease;
}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--amber));color:#1a120b;box-shadow:var(--shadow-glow);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 22px 46px rgba(255,92,43,.3);}
.btn-ghost{border-color:var(--line);background:rgba(255,255,255,.03);color:var(--text);}
.btn-ghost:hover{border-color:rgba(255,92,43,.5);background:rgba(255,92,43,.1);transform:translateY(-3px);}
.btn-mint{background:rgba(40,216,168,.14);border-color:rgba(40,216,168,.42);color:#c6fff0;}
.btn-mint:hover{background:rgba(40,216,168,.22);transform:translateY(-3px);}

.hero-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  margin-top:52px;border-radius:var(--radius-l);overflow:hidden;
  background:var(--line-soft);border:1px solid var(--line-soft);
}
.hero-stat{background:rgba(21,25,34,.88);padding:22px 18px;text-align:left;}
.hero-stat strong{display:block;font-size:clamp(20px,2.4vw,28px);color:#fff;letter-spacing:-.01em;}
.hero-stat span{font-size:13px;color:var(--muted);}

/* ---------- 热词滚动条 ---------- */
.ticker{
  border-bottom:1px solid var(--line-soft);
  background:linear-gradient(90deg,rgba(255,92,43,.08),rgba(139,124,255,.06));
  overflow:hidden;
}
.ticker-inner{display:flex;align-items:center;gap:26px;padding:14px 0;white-space:nowrap;}
.ticker-label{
  flex:none;font-size:12.5px;letter-spacing:.14em;color:var(--amber);
  border:1px solid rgba(255,176,32,.4);border-radius:999px;padding:4px 12px;
}
.ticker-list{display:flex;gap:26px;overflow-x:auto;scrollbar-width:none;}
.ticker-list::-webkit-scrollbar{display:none;}
.ticker-list a{font-size:14px;color:var(--text-2);}
.ticker-list a:hover{color:var(--primary-soft);}
.ticker-list a b{color:var(--primary-soft);font-weight:600;margin-right:6px;}

/* ---------- 通用标题 ---------- */
.head{margin-bottom:clamp(28px,3.4vw,46px);max-width:760px;}
.head--center{margin-left:auto;margin-right:auto;text-align:center;}
.eyebrow{
  display:inline-block;font-size:12.5px;letter-spacing:.2em;color:var(--primary-soft);
  text-transform:uppercase;margin-bottom:12px;
}
.head h2{font-size:clamp(23px,3vw,36px);letter-spacing:-.01em;}
.head p{margin-top:14px;color:var(--text-2);font-size:15.5px;}

/* ---------- 卡片网格 ---------- */
.grid{display:grid;gap:var(--gap);}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}

.card{
  background:var(--bg-card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:26px;
  transition:transform .26s ease,border-color .26s ease,box-shadow .26s ease,background-color .26s ease;
}
.card:hover{transform:translateY(-6px);border-color:rgba(255,92,43,.42);box-shadow:var(--shadow);background:var(--bg-card-2);}
.card-num{
  width:46px;height:46px;border-radius:14px;display:grid;place-items:center;
  font-size:15px;font-weight:800;color:#1a120b;
  background:linear-gradient(140deg,var(--amber),var(--primary));margin-bottom:18px;
}
.card h3{font-size:18.5px;margin-bottom:10px;}
.card p{color:var(--text-2);font-size:14.8px;}
.card-meta{margin-top:18px;display:flex;flex-wrap:wrap;gap:8px;}

.tag{
  display:inline-flex;align-items:center;padding:5px 12px;border-radius:999px;
  font-size:12.5px;color:var(--text-2);
  background:rgba(255,255,255,.05);border:1px solid var(--line);
}
.tag:hover{border-color:rgba(255,92,43,.5);color:var(--primary-soft);}
.tag--amber{color:#ffd58a;border-color:rgba(255,176,32,.36);background:rgba(255,176,32,.1);}
.tag--mint{color:#a9f4de;border-color:rgba(40,216,168,.34);background:rgba(40,216,168,.1);}
.tag--violet{color:#cfc7ff;border-color:rgba(139,124,255,.38);background:rgba(139,124,255,.12);}

/* ---------- 频道入口 ---------- */
.channel-card{
  position:relative;display:block;overflow:hidden;border-radius:var(--radius-l);
  border:1px solid var(--line);background:var(--bg-card);min-height:280px;
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.channel-card img{width:100%;height:190px;object-fit:cover;opacity:.82;transition:transform .5s ease,opacity .3s ease;}
.channel-card:hover{transform:translateY(-6px);border-color:rgba(255,92,43,.46);box-shadow:var(--shadow);}
.channel-card:hover img{transform:scale(1.05);opacity:.95;}
.channel-body{padding:22px 24px 26px;}
.channel-body h3{font-size:19px;margin-bottom:9px;}
.channel-body p{color:var(--text-2);font-size:14.6px;}
.channel-more{margin-top:16px;font-size:14px;color:var(--primary-soft);display:inline-flex;align-items:center;gap:6px;}
.channel-card:hover .channel-more{gap:11px;}

/* ---------- 语录精选卡 ---------- */
.quote-card{
  background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;
  transition:transform .26s ease,border-color .26s ease,box-shadow .26s ease;
}
.quote-card:hover{transform:translateY(-6px);border-color:rgba(255,176,32,.44);box-shadow:var(--shadow);}
.quote-card img{width:100%;height:172px;object-fit:cover;}
.quote-body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:12px;flex:1;}
.quote-body h3{font-size:17px;line-height:1.5;}
.quote-body p{color:var(--muted);font-size:14px;flex:1;}
.quote-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12.8px;color:var(--muted);}
.strength{display:inline-flex;gap:3px;}
.strength i{width:14px;height:5px;border-radius:3px;background:var(--line);display:block;}
.strength i.on{background:linear-gradient(90deg,var(--amber),var(--primary));}

/* ---------- 场景标签墙 ---------- */
.scene-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.scene-item{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:17px 20px;border-radius:var(--radius-s);
  background:var(--bg-card);border:1px solid var(--line);font-size:15px;
  transition:all .22s ease;
}
.scene-item span{color:var(--muted);font-size:12.5px;}
.scene-item:hover{border-color:rgba(40,216,168,.5);background:rgba(40,216,168,.07);transform:translateX(4px);}

/* ---------- 图文区块 ---------- */
.feature{
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,3.6vw,58px);
  align-items:center;
}
.feature-media{
  position:relative;border-radius:var(--radius-l);overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--shadow);
}
.feature-media img{width:100%;height:clamp(260px,34vw,420px);object-fit:cover;}
.feature-media figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:22px 24px;
  background:linear-gradient(0deg,rgba(9,11,15,.94),rgba(9,11,15,0));
  font-size:14px;color:var(--text-2);
}
.feature-list{margin-top:24px;display:grid;gap:14px;}
.feature-list li{display:flex;gap:13px;align-items:flex-start;font-size:15px;color:var(--text-2);}
.feature-list li b{color:#fff;font-weight:600;}
.dot{
  flex:none;width:22px;height:22px;border-radius:7px;margin-top:3px;
  display:grid;place-items:center;font-size:11px;font-weight:800;color:#1a120b;
  background:linear-gradient(140deg,var(--mint),var(--amber));
}

/* ---------- 工具列表 ---------- */
.tool-row{
  display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;
  padding:26px 28px;border-radius:var(--radius);
  background:var(--bg-card);border:1px solid var(--line);
  transition:all .24s ease;
}
.tool-row + .tool-row{margin-top:14px;}
.tool-row:hover{border-color:rgba(139,124,255,.46);background:var(--bg-card-2);transform:translateY(-3px);}
.tool-row .idx{
  font-size:14px;font-weight:800;color:var(--violet);
  width:44px;height:44px;border-radius:13px;display:grid;place-items:center;
  background:rgba(139,124,255,.12);border:1px solid rgba(139,124,255,.3);
}
.tool-row h3{font-size:17.5px;margin-bottom:6px;}
.tool-row p{color:var(--text-2);font-size:14.6px;}
.tool-row .link{font-size:14px;color:var(--primary-soft);white-space:nowrap;}

/* ---------- 数据面板 ---------- */
.metrics{
  display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);
}
.metric{
  padding:30px 26px;border-radius:var(--radius-l);
  background:linear-gradient(160deg,var(--bg-card-2),var(--bg-card));
  border:1px solid var(--line);position:relative;overflow:hidden;
}
.metric::before{
  content:"";position:absolute;top:-40px;right:-40px;width:120px;height:120px;
  border-radius:50%;background:radial-gradient(circle,rgba(255,92,43,.22),transparent 70%);
}
.metric strong{display:block;font-size:clamp(26px,3.4vw,40px);letter-spacing:-.02em;color:#fff;}
.metric span{display:block;margin-top:8px;color:var(--muted);font-size:14px;}

/* ---------- 时间线 ---------- */
.timeline{position:relative;padding-left:34px;}
.timeline::before{content:"";position:absolute;left:9px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--primary),var(--violet),transparent);}
.tl-item{position:relative;padding-bottom:28px;}
.tl-item:last-child{padding-bottom:0;}
.tl-item::before{
  content:"";position:absolute;left:-32px;top:8px;width:12px;height:12px;border-radius:50%;
  background:var(--bg);border:2px solid var(--primary);box-shadow:0 0 0 4px rgba(255,92,43,.14);
}
.tl-item time{font-size:13px;color:var(--amber);letter-spacing:.08em;}
.tl-item h3{font-size:17px;margin:6px 0 6px;}
.tl-item p{color:var(--text-2);font-size:14.6px;}

/* ---------- 评价 ---------- */
.review{
  background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);
  padding:28px;display:flex;flex-direction:column;gap:16px;height:100%;
  transition:all .24s ease;
}
.review:hover{border-color:rgba(40,216,168,.42);transform:translateY(-5px);box-shadow:var(--shadow);}
.review p{color:var(--text-2);font-size:15px;flex:1;}
.review-user{display:flex;align-items:center;gap:12px;}
.avatar{
  width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center;
  font-weight:800;color:#1a120b;background:linear-gradient(140deg,var(--amber),var(--primary));
}
.review-user b{display:block;font-size:14.8px;}
.review-user span{font-size:12.5px;color:var(--muted);}

/* ---------- 标签云 ---------- */
.cloud{display:flex;flex-wrap:wrap;gap:12px;}
.cloud a{
  padding:10px 18px;border-radius:999px;font-size:14.5px;
  background:var(--bg-card);border:1px solid var(--line);color:var(--text-2);
  transition:all .2s ease;
}
.cloud a:nth-child(3n+1):hover{border-color:rgba(255,92,43,.55);color:var(--primary-soft);transform:translateY(-2px);}
.cloud a:nth-child(3n+2):hover{border-color:rgba(40,216,168,.5);color:#a9f4de;transform:translateY(-2px);}
.cloud a:nth-child(3n):hover{border-color:rgba(139,124,255,.55);color:#cfc7ff;transform:translateY(-2px);}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:14px;}
.faq details{
  background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 24px;transition:border-color .22s ease,background-color .22s ease;
}
.faq details[open]{border-color:rgba(255,92,43,.42);background:var(--bg-card-2);}
.faq summary{
  cursor:pointer;list-style:none;font-size:16.5px;font-weight:600;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{
  content:"+";flex:none;font-size:20px;font-weight:400;color:var(--primary-soft);
  transition:transform .22s ease;
}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq p{margin-top:14px;color:var(--text-2);font-size:14.9px;}

/* ---------- 订阅转化 ---------- */
.cta{
  position:relative;overflow:hidden;border-radius:var(--radius-l);
  border:1px solid rgba(255,92,43,.32);
  background-image:linear-gradient(120deg,rgba(20,14,10,.94),rgba(14,16,20,.9)),url('/assets/images/fc0426ec2adda0fc.webp');
  background-size:cover;background-position:center;
  padding:clamp(32px,4.6vw,60px);
  display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,3vw,48px);align-items:center;
}
.cta h2{font-size:clamp(22px,2.8vw,32px);}
.cta p{margin-top:14px;color:var(--text-2);font-size:15.3px;max-width:560px;}
.subscribe{display:flex;gap:12px;flex-wrap:wrap;}
.subscribe input{
  flex:1;min-width:200px;padding:14px 18px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--text);
  transition:border-color .2s ease,background-color .2s ease;
}
.subscribe input::placeholder{color:var(--muted);}
.subscribe input:focus{outline:none;border-color:rgba(255,92,43,.6);background:rgba(255,255,255,.1);}
.hint{margin-top:12px;font-size:12.8px;color:var(--muted);}

/* ---------- 列表区 ---------- */
.list-block{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-l);overflow:hidden;}
.list-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:22px 26px;border-bottom:1px solid var(--line-soft);
}
.list-head h3{font-size:18px;}
.list-head a{font-size:14px;color:var(--primary-soft);}
.list-item{
  display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;
  padding:18px 26px;border-bottom:1px solid var(--line-soft);transition:background-color .2s ease;
}
.list-item:last-child{border-bottom:0;}
.list-item:hover{background:rgba(255,255,255,.03);}
.list-item .no{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums;}
.list-item b{font-weight:600;font-size:15.4px;}
.list-item small{color:var(--muted);font-size:13px;}

/* ---------- 页脚 ---------- */
.site-footer{
  background:linear-gradient(180deg,var(--bg-soft),#0a0c10);
  border-top:1px solid var(--line-soft);
  padding:clamp(44px,5vw,72px) 0 28px;
  margin-top:0;
}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:var(--gap);}
.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.footer-brand .brand-mark{width:38px;height:38px;border-radius:11px;font-size:17px;}
.footer-text{color:var(--muted);font-size:14.2px;max-width:340px;}
.footer-col h4{font-size:15px;margin-bottom:16px;color:#fff;}
.footer-col li + li{margin-top:11px;}
.footer-col a{font-size:14.2px;color:var(--muted);}
.footer-col a:hover{color:var(--primary-soft);}
.footer-bottom{
  margin-top:clamp(32px,4vw,52px);padding-top:22px;border-top:1px solid var(--line-soft);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;
  color:var(--muted);font-size:13.2px;
}
.footer-bottom a{color:var(--text-2);}
.footer-bottom a:hover{color:var(--primary-soft);}

/* ---------- 响应式 ---------- */
@media (max-width:1080px){
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .metrics{grid-template-columns:repeat(2,1fr);}
  .hero-stats{grid-template-columns:repeat(2,1fr);}
  .scene-grid{grid-template-columns:repeat(3,1fr);}
  .footer-grid{grid-template-columns:1.4fr 1fr 1fr;}
}
@media (max-width:980px){
  .nav,.nav-cta{display:none;}
  .nav-toggle{display:grid;}
  .feature{grid-template-columns:1fr;}
  .cta{grid-template-columns:1fr;}
  .grid-3{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:768px){
  body{font-size:15.4px;}
  .scene-grid{grid-template-columns:repeat(2,1fr);}
  .tool-row{grid-template-columns:auto 1fr;gap:16px;}
  .tool-row .link{grid-column:2;}
  .list-item{grid-template-columns:auto 1fr;}
  .list-item small{grid-column:2;}
}
@media (max-width:560px){
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}
  .metrics{grid-template-columns:1fr;}
  .hero-stats{grid-template-columns:1fr;}
  .scene-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .hero-actions .btn{width:100%;}
  .subscribe input{min-width:100%;}
  .list-head{flex-direction:column;align-items:flex-start;}
  .card{padding:22px;}
  .feature-media img{height:220px;}
}

/* roulang page: category2 */
:root{
 --bg:#0e1014;
 --bg-soft:#151922;
 --bg-card:#1a1f2a;
 --bg-card-2:#20262f;
 --line:#2a313d;
 --line-soft:#232a35;
 --text:#eef1f6;
 --text-2:#c3cbd8;
 --muted:#8b95a6;
 --primary:#ff5c2b;
 --primary-soft:#ff7c4d;
 --amber:#ffb020;
 --mint:#28d8a8;
 --violet:#8b7cff;
 --radius-s:10px;
 --radius:16px;
 --radius-l:24px;
 --shadow-s:0 4px 14px rgba(0,0,0,.28);
 --shadow:0 14px 40px rgba(0,0,0,.42);
 --shadow-glow:0 18px 48px rgba(255,92,43,.22);
 --gap:clamp(18px,2.4vw,30px);
 --section:clamp(56px,7vw,104px);
 --font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
 margin:0;
 font-family:var(--font);
 background:var(--bg);
 color:var(--text);
 font-size:16px;
 line-height:1.75;
 letter-spacing:.01em;
 -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto;}
a{color:inherit;text-decoration:none;transition:color .2s ease,border-color .2s ease,background-color .2s ease,transform .2s ease,box-shadow .2s ease;}
button,input,textarea,select{font:inherit;color:inherit;}
button{cursor:pointer;border:0;background:none;}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--primary-soft);outline-offset:2px;border-radius:8px;}
h1,h2,h3,h4{margin:0;line-height:1.28;letter-spacing:-.01em;font-weight:800;}
p{margin:0;}
ul{margin:0;padding:0;list-style:none;}
.container{width:100%;max-width:1220px;margin:0 auto;padding:0 clamp(18px,4vw,34px);}
.section{padding:var(--section) 0;}
.section--tight{padding:clamp(38px,4.6vw,64px) 0;}
.section--soft{background:var(--bg-soft);}
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);border:0;margin:0;}
.section-head{max-width:760px;margin-bottom:clamp(28px,3.4vw,46px);}
.section-head--center{margin-left:auto;margin-right:auto;text-align:center;}
.eyebrow{
 display:inline-flex;align-items:center;gap:8px;
 font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;
 color:var(--primary-soft);font-weight:700;margin-bottom:14px;
}
.eyebrow::before{content:"";width:18px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--primary),var(--amber));}
.section-title{font-size:clamp(23px,2.9vw,34px);}
.section-desc{margin-top:14px;color:var(--text-2);font-size:15.5px;}
/* ---------- 顶部导航 ---------- */
.site-header{
 position:sticky;top:0;z-index:60;
 background:rgba(14,16,20,.86);
 backdrop-filter:blur(14px);
 border-bottom:1px solid var(--line-soft);
}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;height:72px;}
.brand{display:flex;align-items:center;gap:12px;flex:none;}
.brand-mark{
 width:42px;height:42px;border-radius:13px;flex:none;
 background:linear-gradient(140deg,var(--primary),var(--amber));
 display:grid;place-items:center;
 font-weight:800;font-size:19px;color:#16110c;letter-spacing:-.02em;
 box-shadow:0 8px 22px rgba(255,92,43,.3);
}
.brand-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-name{font-size:19px;font-weight:800;letter-spacing:.02em;}
.brand-sub{font-size:11px;color:var(--muted);letter-spacing:.16em;text-transform:uppercase;}
.nav{display:flex;align-items:center;gap:6px;}
.nav a{
 padding:9px 16px;border-radius:999px;font-size:15px;color:var(--text-2);
 border:1px solid transparent;
}
.nav a:hover{color:#fff;background:rgba(255,255,255,.06);}
.nav a.is-active{
 color:#fff;background:rgba(255,92,43,.14);border-color:rgba(255,92,43,.42);
}
.nav-cta{
 flex:none;display:inline-flex;align-items:center;gap:8px;
 padding:11px 20px;border-radius:999px;font-size:15px;font-weight:600;
 background:linear-gradient(135deg,var(--primary),var(--amber));color:#1a120b;
 box-shadow:0 10px 24px rgba(255,92,43,.26);
}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 16px 30px rgba(255,92,43,.34);}
.nav-toggle{
 display:none;width:44px;height:44px;border-radius:12px;
 border:1px solid var(--line);background:var(--bg-card);
 place-items:center;
}
.nav-toggle span{display:block;width:18px;height:2px;background:var(--text);border-radius:2px;position:relative;}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--text);border-radius:2px;}
.nav-toggle span::before{top:-6px;}
.nav-toggle span::after{top:6px;}
.mobile-nav{display:none;border-top:1px solid var(--line-soft);background:rgba(14,16,20,.98);}
.mobile-nav.open{display:block;}
.mobile-nav a{display:block;padding:15px 4px;border-bottom:1px solid var(--line-soft);font-size:16px;color:var(--text-2);}
.mobile-nav a.is-active{color:var(--primary-soft);}
/* ---------- 内页横幅 ---------- */
.page-hero{
 position:relative;overflow:hidden;
 padding:clamp(58px,7.6vw,96px) 0 clamp(48px,6vw,80px);
 background-image:linear-gradient(100deg,rgba(9,11,15,.94) 8%,rgba(9,11,15,.78) 48%,rgba(14,16,20,.92)),url('/assets/images/57d99c3f9c064365.webp');
 background-size:cover;background-position:center;
 border-bottom:1px solid var(--line-soft);
}
.page-hero::after{
 content:"";position:absolute;right:-12%;top:-30%;width:520px;height:520px;border-radius:50%;
 background:radial-gradient(circle,rgba(255,92,43,.2),transparent 68%);
 pointer-events:none;
}
.page-hero-inner{position:relative;z-index:2;max-width:840px;}
.crumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13.5px;color:var(--muted);margin-bottom:20px;}
.crumb a:hover{color:var(--primary-soft);}
.crumb span.sep{opacity:.5;}
.page-hero h1{font-size:clamp(28px,4.4vw,50px);}
.page-hero h1 em{
 font-style:normal;
 background:linear-gradient(120deg,var(--primary),var(--amber) 62%,var(--mint));
 -webkit-background-clip:text;background-clip:text;color:transparent;
}
.page-lead{margin-top:20px;max-width:740px;color:var(--text-2);font-size:clamp(15px,1.3vw,17px);}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px;}
.btn{
 display:inline-flex;align-items:center;justify-content:center;gap:9px;
 padding:14px 28px;border-radius:999px;font-size:15.5px;font-weight:600;
 border:1px solid transparent;transition:all .22s ease;
}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--amber));color:#1a120b;box-shadow:var(--shadow-glow);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 22px 46px rgba(255,92,43,.3);}
.btn-ghost{border-color:var(--line);background:rgba(255,255,255,.03);color:var(--text);}
.btn-ghost:hover{border-color:rgba(255,92,43,.5);background:rgba(255,92,43,.1);transform:translateY(-3px);}
.btn-mint{background:rgba(40,216,168,.14);border-color:rgba(40,216,168,.42);color:#c6fff0;}
.btn-mint:hover{background:rgba(40,216,168,.22);transform:translateY(-3px);}
/* ---------- 数据条 ---------- */
.stat-band{
 display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
 background:var(--line-soft);border:1px solid var(--line-soft);
 border-radius:var(--radius-l);overflow:hidden;
}
.stat-item{background:var(--bg-card);padding:clamp(20px,2.4vw,30px);transition:background .2s ease;}
.stat-item:hover{background:var(--bg-card-2);}
.stat-num{font-size:clamp(24px,2.8vw,34px);font-weight:800;letter-spacing:-.02em;}
.stat-num i{font-style:normal;font-size:.55em;color:var(--muted);margin-left:3px;font-weight:600;}
.stat-label{margin-top:6px;font-size:13.5px;color:var(--muted);}
.stat-item:nth-child(1) .stat-num{color:var(--primary-soft);}
.stat-item:nth-child(2) .stat-num{color:var(--amber);}
.stat-item:nth-child(3) .stat-num{color:var(--mint);}
.stat-item:nth-child(4) .stat-num{color:var(--violet);}
/* ---------- 频道矩阵 ---------- */
.channel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);}
.channel-card{
 position:relative;display:flex;flex-direction:column;gap:12px;
 padding:26px;border-radius:var(--radius-l);
 background:var(--bg-card);border:1px solid var(--line);
 transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
.channel-card:hover{transform:translateY(-6px);border-color:rgba(255,92,43,.45);box-shadow:var(--shadow);}
.channel-badge{
 align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.08em;
 padding:5px 12px;border-radius:999px;
 background:rgba(139,124,255,.16);color:#cfc8ff;border:1px solid rgba(139,124,255,.34);
}
.channel-card:nth-child(2) .channel-badge{background:rgba(255,92,43,.16);color:#ffbfa6;border-color:rgba(255,92,43,.36);}
.channel-card:nth-child(3) .channel-badge{background:rgba(40,216,168,.14);color:#b8f5e4;border-color:rgba(40,216,168,.32);}
.channel-card h3{font-size:19px;}
.channel-card p{color:var(--text-2);font-size:14.5px;}
.channel-link{margin-top:auto;font-size:14.5px;font-weight:600;color:var(--primary-soft);display:inline-flex;align-items:center;gap:7px;}
.channel-card:hover .channel-link{color:#fff;}
/* ---------- 卡片网格 ---------- */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);}
.card{
 display:flex;flex-direction:column;overflow:hidden;
 background:var(--bg-card);border:1px solid var(--line);
 border-radius:var(--radius-l);
 transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
.card:hover{transform:translateY(-6px);border-color:rgba(255,92,43,.42);box-shadow:var(--shadow);}
.card-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-card-2);}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.card:hover .card-media img{transform:scale(1.06);}
.card-media::after{
 content:"";position:absolute;inset:0;
 background:linear-gradient(180deg,rgba(10,12,16,0) 40%,rgba(10,12,16,.66));
}
.card-tag{
 position:absolute;left:14px;top:14px;z-index:2;
 font-size:12px;font-weight:700;padding:5px 12px;border-radius:999px;
 background:rgba(14,16,20,.78);border:1px solid rgba(255,255,255,.16);color:var(--text);
 backdrop-filter:blur(6px);
}
.card-body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1;}
.card-title{font-size:18px;}
.card-text{color:var(--text-2);font-size:14.5px;}
.card-meta{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px;padding-top:12px;border-top:1px solid var(--line-soft);}
.tag{
 font-size:12.5px;color:var(--muted);
 padding:4px 11px;border-radius:999px;
 background:rgba(255,255,255,.04);border:1px solid var(--line);
}
.tag--hot{color:#ffbfa6;border-color:rgba(255,92,43,.36);background:rgba(255,92,43,.12);}
.tag--mint{color:#b8f5e4;border-color:rgba(40,216,168,.3);background:rgba(40,216,168,.1);}
/* ---------- 场景标签墙 ---------- */
.chip-wall{display:flex;flex-wrap:wrap;gap:12px;}
.chip{
 display:inline-flex;align-items:center;gap:8px;
 padding:10px 18px;border-radius:999px;font-size:14.5px;color:var(--text-2);
 background:var(--bg-card);border:1px solid var(--line);
 transition:all .2s ease;
}
.chip:hover{color:#fff;border-color:rgba(255,92,43,.5);background:rgba(255,92,43,.1);transform:translateY(-2px);}
.chip i{font-style:normal;font-size:12px;color:var(--muted);}
.chip--count i{color:var(--amber);}
/* ---------- 图文分栏 ---------- */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,3.4vw,52px);align-items:center;}
.split-media{
 position:relative;border-radius:var(--radius-l);overflow:hidden;
 border:1px solid var(--line);box-shadow:var(--shadow);
}
.split-media img{width:100%;aspect-ratio:4/3;object-fit:cover;}
.split-media figcaption{
 position:absolute;left:0;right:0;bottom:0;
 padding:16px 20px;font-size:13.5px;color:var(--text-2);
 background:linear-gradient(180deg,rgba(10,12,16,0),rgba(10,12,16,.86));
}
.split-body h2{font-size:clamp(23px,2.8vw,33px);}
.split-body > p{margin-top:16px;color:var(--text-2);}
.check-list{margin-top:24px;display:grid;gap:14px;}
.check-list li{
 display:flex;gap:12px;align-items:flex-start;
 padding:14px 18px;border-radius:var(--radius);
 background:var(--bg-card);border:1px solid var(--line-soft);
}
.check-list li strong{display:block;font-size:15.5px;margin-bottom:3px;}
.check-list li span{color:var(--text-2);font-size:14.5px;}
.check-list li::before{
 content:"✓";flex:none;width:24px;height:24px;border-radius:8px;
 display:grid;place-items:center;font-size:13px;font-weight:700;
 background:rgba(40,216,168,.16);color:#9ff5da;border:1px solid rgba(40,216,168,.34);
}
/* ---------- 列表区 ---------- */
.list-rows{display:grid;gap:12px;}
.row-item{
 display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;
 padding:18px 22px;border-radius:var(--radius);
 background:var(--bg-card);border:1px solid var(--line-soft);
 transition:all .2s ease;
}
.row-item:hover{border-color:rgba(255,92,43,.4);background:var(--bg-card-2);transform:translateX(4px);}
.row-index{
 width:38px;height:38px;border-radius:12px;display:grid;place-items:center;
 font-weight:800;font-size:15px;color:#1a120b;
 background:linear-gradient(135deg,var(--primary),var(--amber));
}
.row-main strong{display:block;font-size:16px;margin-bottom:4px;}
.row-main span{color:var(--muted);font-size:14px;}
.row-meta{font-size:13.5px;color:var(--text-2);white-space:nowrap;}
.list-more{margin-top:26px;display:flex;justify-content:center;}
/* ---------- 规格清单 ---------- */
.spec-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--gap);}
.spec-card{
 padding:26px;border-radius:var(--radius-l);
 background:var(--bg-card);border:1px solid var(--line);
}
.spec-card h3{font-size:17.5px;margin-bottom:16px;display:flex;align-items:center;gap:10px;}
.spec-card h3::before{content:"";width:4px;height:18px;border-radius:3px;background:linear-gradient(180deg,var(--primary),var(--amber));}
.spec-card dl{margin:0;display:grid;gap:12px;}
.spec-card dt{font-size:14px;color:var(--muted);}
.spec-card dd{margin:2px 0 0;font-size:15.5px;font-weight:600;}
.spec-note{
 margin-top:var(--gap);padding:22px 26px;border-radius:var(--radius-l);
 background:linear-gradient(120deg,rgba(255,92,43,.12),rgba(139,124,255,.1));
 border:1px solid var(--line);
 color:var(--text-2);font-size:14.5px;
}
/* ---------- 转化区 ---------- */
.cta-panel{
 position:relative;overflow:hidden;
 padding:clamp(34px,4.6vw,58px);border-radius:var(--radius-l);
 background-image:linear-gradient(120deg,rgba(15,17,22,.94),rgba(20,16,14,.9)),url('/assets/images/74f463b16395b36b.jpg');
 background-size:cover;background-position:center;
 border:1px solid rgba(255,92,43,.3);
 box-shadow:var(--shadow);
}
.cta-grid{display:grid;grid-template-columns:1fr .9fr;gap:clamp(24px,3.4vw,46px);align-items:start;position:relative;z-index:2;}
.cta-panel h2{font-size:clamp(22px,2.7vw,32px);}
.cta-panel p{margin-top:16px;color:var(--text-2);}
.submit-form{display:grid;gap:14px;background:rgba(20,24,31,.72);padding:24px;border-radius:var(--radius);border:1px solid var(--line);}
.field{display:grid;gap:7px;}
.field label{font-size:13.5px;color:var(--text-2);}
.field input,.field textarea{
 width:100%;padding:12px 15px;border-radius:var(--radius-s);
 background:rgba(10,12,16,.7);border:1px solid var(--line);
 color:var(--text);font-size:15px;transition:border-color .2s ease,background .2s ease;
}
.field input::placeholder,.field textarea::placeholder{color:#68717f;}
.field input:focus,.field textarea:focus{border-color:rgba(255,92,43,.62);background:rgba(10,12,16,.92);outline:none;}
.field textarea{min-height:96px;resize:vertical;}
.form-tip{font-size:13px;color:var(--muted);}
/* ---------- 页脚 ---------- */
.site-footer{background:var(--bg-soft);border-top:1px solid var(--line-soft);padding:clamp(44px,5vw,72px) 0 28px;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:clamp(22px,3vw,44px);}
.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.footer-text{color:var(--muted);font-size:14.5px;max-width:380px;}
.footer-col h4{font-size:15px;margin-bottom:16px;}
.footer-col ul{display:grid;gap:11px;}
.footer-col a{color:var(--muted);font-size:14.5px;}
.footer-col a:hover{color:var(--primary-soft);}
.footer-bottom{
 margin-top:clamp(30px,3.6vw,48px);padding-top:22px;
 border-top:1px solid var(--line-soft);
 display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;
 font-size:13.5px;color:var(--muted);
}
.footer-bottom a{color:var(--text-2);}
.footer-bottom a:hover{color:var(--primary-soft);}
/* ---------- 响应式 ---------- */
@media (max-width:1024px){
 .nav{display:none;}
 .nav-cta{display:none;}
 .nav-toggle{display:grid;}
 .card-grid,.channel-grid{grid-template-columns:repeat(2,1fr);}
 .stat-band{grid-template-columns:repeat(2,1fr);}
 .split,.cta-grid{grid-template-columns:1fr;}
 .footer-grid{grid-template-columns:1.4fr 1fr 1fr;}
}
@media (max-width:768px){
 .section{padding:clamp(44px,9vw,64px) 0;}
 .page-hero{padding:48px 0 44px;}
 .spec-grid{grid-template-columns:1fr;}
 .footer-grid{grid-template-columns:1fr 1fr;gap:26px;}
 .row-item{grid-template-columns:auto 1fr;gap:14px;}
 .row-meta{grid-column:2;white-space:normal;}
}
@media (max-width:520px){
 .card-grid,.channel-grid{grid-template-columns:1fr;}
 .stat-band{grid-template-columns:1fr;}
 .hero-actions .btn{width:100%;}
 .footer-grid{grid-template-columns:1fr;}
 .footer-bottom{flex-direction:column;}
 .brand-sub{display:none;}
}

/* roulang page: category1 */
:root{
 --bg:#0e1014;
 --bg-soft:#151922;
 --bg-card:#1a1f2a;
 --bg-card-2:#20262f;
 --line:#2a313d;
 --line-soft:#232a35;
 --text:#eef1f6;
 --text-2:#c3cbd8;
 --muted:#8b95a6;
 --primary:#ff5c2b;
 --primary-soft:#ff7c4d;
 --amber:#ffb020;
 --mint:#28d8a8;
 --violet:#8b7cff;
 --radius-s:10px;
 --radius:16px;
 --radius-l:24px;
 --shadow-s:0 4px 14px rgba(0,0,0,.28);
 --shadow:0 14px 40px rgba(0,0,0,.42);
 --shadow-glow:0 18px 48px rgba(255,92,43,.22);
 --gap:clamp(18px,2.4vw,30px);
 --section:clamp(56px,7vw,104px);
 --font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
*{box-sizing:border-box;}
body{
 margin:0;
 font-family:var(--font);
 background:var(--bg);
 color:var(--text);
 font-size:16px;
 line-height:1.75;
 letter-spacing:.01em;
 -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto;}
a{color:inherit;text-decoration:none;transition:color .2s ease,border-color .2s ease,background-color .2s ease,transform .2s ease,box-shadow .2s ease;}
button,input,textarea,select{font:inherit;color:inherit;}
button{cursor:pointer;border:0;background:none;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4{margin:0;font-weight:800;letter-spacing:-.01em;line-height:1.28;}
p{margin:0;}
:focus-visible{outline:2px solid var(--primary-soft);outline-offset:3px;border-radius:6px;}
.container{width:100%;max-width:1220px;margin:0 auto;padding:0 clamp(18px,4vw,34px);}
.section{padding:var(--section) 0;}
.section--tight{padding:clamp(38px,4.6vw,64px) 0;}
.section--soft{background:var(--bg-soft);}
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);border:0;margin:0;}
.section-head{max-width:760px;margin-bottom:clamp(26px,3.4vw,44px);}
.section-head h2{font-size:clamp(23px,3vw,34px);}
.section-head p{margin-top:12px;color:var(--muted);font-size:15.5px;}
.eyebrow{
 display:inline-flex;align-items:center;gap:8px;
 font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);
 margin-bottom:14px;
}
.eyebrow::before{content:"";width:22px;height:2px;background:linear-gradient(90deg,var(--primary),var(--amber));border-radius:2px;}

/* ---------- 顶部导航 ---------- */
.site-header{
 position:sticky;top:0;z-index:60;
 background:rgba(14,16,20,.86);
 backdrop-filter:blur(14px);
 border-bottom:1px solid var(--line-soft);
}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;height:72px;}
.brand{display:flex;align-items:center;gap:12px;flex:none;}
.brand-mark{
 width:42px;height:42px;border-radius:13px;flex:none;
 background:linear-gradient(140deg,var(--primary),var(--amber));
 display:grid;place-items:center;
 font-weight:800;font-size:19px;color:#16110c;letter-spacing:-.02em;
 box-shadow:0 8px 22px rgba(255,92,43,.3);
}
.brand-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-name{font-size:19px;font-weight:800;letter-spacing:.02em;}
.brand-sub{font-size:11px;color:var(--muted);letter-spacing:.16em;text-transform:uppercase;}
.nav{display:flex;align-items:center;gap:6px;}
.nav a{
 padding:9px 16px;border-radius:999px;font-size:15px;color:var(--text-2);
 border:1px solid transparent;
}
.nav a:hover{color:#fff;background:rgba(255,255,255,.06);}
.nav a.is-active{
 color:#fff;background:rgba(255,92,43,.14);border-color:rgba(255,92,43,.42);
}
.nav-cta{
 flex:none;display:inline-flex;align-items:center;gap:8px;
 padding:11px 20px;border-radius:999px;font-size:15px;font-weight:600;
 background:linear-gradient(135deg,var(--primary),var(--amber));color:#1a120b;
 box-shadow:0 10px 24px rgba(255,92,43,.26);
}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 16px 30px rgba(255,92,43,.34);}
.nav-toggle{
 display:none;width:44px;height:44px;border-radius:12px;
 border:1px solid var(--line);background:var(--bg-card);
 place-items:center;
}
.nav-toggle span{display:block;width:18px;height:2px;background:var(--text);border-radius:2px;position:relative;}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--text);border-radius:2px;}
.nav-toggle span::before{top:-6px;}
.nav-toggle span::after{top:6px;}
.mobile-nav{display:none;border-top:1px solid var(--line-soft);background:rgba(14,16,20,.98);padding:0 clamp(18px,4vw,34px) 16px;}
.mobile-nav.open{display:block;}
.mobile-nav a{display:block;padding:15px 4px;border-bottom:1px solid var(--line-soft);font-size:16px;color:var(--text-2);}
.mobile-nav a.is-active{color:var(--primary-soft);}

/* ---------- 按钮 ---------- */
.btn{
 display:inline-flex;align-items:center;justify-content:center;gap:9px;
 padding:13px 26px;border-radius:999px;font-size:15.5px;font-weight:600;
 border:1px solid transparent;transition:all .22s ease;
}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--amber));color:#1a120b;box-shadow:var(--shadow-glow);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 22px 46px rgba(255,92,43,.3);}
.btn-ghost{border-color:var(--line);background:rgba(255,255,255,.03);color:var(--text);}
.btn-ghost:hover{border-color:rgba(255,92,43,.5);background:rgba(255,92,43,.1);transform:translateY(-3px);}
.btn-sm{padding:9px 18px;font-size:14px;}

/* ---------- 频道页头 ---------- */
.page-hero{
 position:relative;overflow:hidden;
 padding:clamp(52px,7vw,92px) 0 clamp(46px,5.6vw,72px);
 background-image:linear-gradient(110deg,rgba(9,11,15,.94) 0%,rgba(9,11,15,.82) 48%,rgba(14,16,20,.96) 100%),url('/assets/images/baf695211231a800.webp');
 background-size:cover;background-position:center;
 border-bottom:1px solid var(--line-soft);
}
.page-hero::after{
 content:"";position:absolute;right:-8%;top:-30%;width:52%;height:150%;
 background:radial-gradient(circle at 40% 50%,rgba(255,92,43,.16),transparent 62%);
 pointer-events:none;
}
.page-hero-grid{
 position:relative;z-index:2;
 display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);
 gap:clamp(26px,4vw,56px);align-items:center;
}
.crumb{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:13.5px;color:var(--muted);margin-bottom:20px;}
.crumb a:hover{color:var(--primary-soft);}
.crumb span{opacity:.5;}
.page-hero h1{font-size:clamp(28px,4.4vw,50px);line-height:1.2;}
.page-hero h1 em{
 font-style:normal;
 background:linear-gradient(120deg,var(--primary),var(--amber) 68%,var(--mint));
 -webkit-background-clip:text;background-clip:text;color:transparent;
}
.page-hero-lead{margin-top:20px;max-width:640px;color:var(--text-2);font-size:clamp(15px,1.3vw,17px);}
.tag-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;}
.chip{
 display:inline-flex;align-items:center;gap:7px;
 padding:7px 15px;border-radius:999px;font-size:13.5px;
 color:var(--text-2);border:1px solid var(--line);background:rgba(255,255,255,.04);
 transition:all .2s ease;
}
.chip:hover{border-color:rgba(255,92,43,.5);color:#fff;background:rgba(255,92,43,.12);transform:translateY(-2px);}
.chip.is-on{background:rgba(255,92,43,.16);border-color:rgba(255,92,43,.5);color:#fff;}
.hero-panel{
 background:linear-gradient(160deg,rgba(32,38,47,.92),rgba(21,25,34,.92));
 border:1px solid var(--line);border-radius:var(--radius-l);
 padding:clamp(20px,2.6vw,30px);box-shadow:var(--shadow);
}
.hero-panel h3{font-size:16px;color:var(--text-2);font-weight:700;margin-bottom:16px;}
.panel-stat{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px dashed var(--line);}
.panel-stat:last-of-type{border-bottom:0;}
.panel-stat b{font-size:clamp(20px,2.4vw,26px);color:var(--primary-soft);font-weight:800;letter-spacing:-.01em;}
.panel-stat span{font-size:13.5px;color:var(--muted);}
.panel-note{margin-top:18px;font-size:13.5px;color:var(--muted);line-height:1.7;}

/* ---------- 场景检索 ---------- */
.search-shell{
 display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;
 padding:18px;border-radius:var(--radius-l);
 border:1px solid var(--line);background:var(--bg-card);
 box-shadow:var(--shadow-s);
}
.search-field{
 display:flex;align-items:center;gap:12px;
 padding:0 18px;border-radius:999px;background:var(--bg-card-2);
 border:1px solid var(--line-soft);
}
.search-field input{
 flex:1;border:0;background:transparent;padding:15px 0;font-size:15px;color:var(--text);
}
.search-field input::placeholder{color:var(--muted);}
.search-field input:focus{outline:none;}
.search-icon{width:18px;height:18px;flex:none;border-radius:50%;border:2px solid var(--muted);position:relative;}
.search-icon::after{content:"";position:absolute;right:-5px;bottom:-4px;width:8px;height:2px;background:var(--muted);transform:rotate(45deg);border-radius:2px;}
.quick-label{margin-top:18px;font-size:13.5px;color:var(--muted);margin-bottom:12px;}

/* ---------- 通用网格与卡片 ---------- */
.grid{display:grid;gap:var(--gap);}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr));}
.card{
 background:var(--bg-card);border:1px solid var(--line-soft);border-radius:var(--radius);
 overflow:hidden;transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}
.card:hover{transform:translateY(-6px);border-color:rgba(255,92,43,.4);box-shadow:var(--shadow);}
.card-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-card-2);}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.card:hover .card-media img{transform:scale(1.06);}
.card-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,12,16,0) 35%,rgba(10,12,16,.72) 100%);}
.card-badge{
 position:absolute;left:14px;top:14px;z-index:2;
 padding:5px 12px;border-radius:999px;font-size:12.5px;font-weight:600;
 background:rgba(14,16,20,.78);border:1px solid rgba(255,255,255,.16);color:#fff;
}
.card-body{padding:clamp(16px,2vw,22px);}
.card-body h3{font-size:17.5px;line-height:1.45;}
.card-body p{margin-top:10px;color:var(--muted);font-size:14.5px;line-height:1.72;}
.card-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;}
.tag{
 display:inline-flex;align-items:center;
 padding:4px 11px;border-radius:8px;font-size:12.5px;
 background:rgba(139,124,255,.12);color:#c3bbff;border:1px solid rgba(139,124,255,.28);
}
.tag--amber{background:rgba(255,176,32,.12);color:#ffd894;border-color:rgba(255,176,32,.3);}
.tag--mint{background:rgba(40,216,168,.12);color:#a9f3de;border-color:rgba(40,216,168,.3);}

/* ---------- 场景专题 ---------- */
.scene-card{position:relative;display:block;}
.scene-card .scene-count{
 position:absolute;right:14px;top:14px;z-index:2;
 padding:5px 12px;border-radius:999px;font-size:12.5px;
 background:linear-gradient(135deg,var(--primary),var(--amber));color:#1a120b;font-weight:700;
}
.scene-card .card-body h3{display:flex;align-items:center;gap:8px;}
.scene-card .card-body h3::after{content:"→";color:var(--primary-soft);font-weight:700;transition:transform .24s ease;}
.scene-card:hover .card-body h3::after{transform:translateX(4px);}

/* ---------- 语录墙 ---------- */
.quote-wall{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);}
.quote-card{
 display:flex;flex-direction:column;gap:14px;
 padding:clamp(18px,2.2vw,26px);
 border-radius:var(--radius);
 border:1px solid var(--line-soft);
 background:linear-gradient(165deg,var(--bg-card),var(--bg-card-2));
 transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease;
}
.quote-card:hover{transform:translateY(-6px);border-color:rgba(255,176,32,.4);box-shadow:var(--shadow);}
.quote-mark{font-size:30px;line-height:1;color:var(--primary);font-weight:800;}
.quote-text{font-size:clamp(15.5px,1.45vw,17.5px);line-height:1.8;color:var(--text);font-weight:600;}
.quote-foot{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;}
.quote-scene{font-size:13px;color:var(--muted);}
.quote-like{
 display:inline-flex;align-items:center;gap:6px;
 font-size:13px;color:var(--text-2);
 padding:5px 12px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.03);
 transition:all .2s ease;
}
.quote-like:hover{color:#fff;border-color:rgba(40,216,168,.5);background:rgba(40,216,168,.12);}

/* ---------- 口吻榜 ---------- */
.rank-wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,3.4vw,50px);align-items:start;}
.rank-list{border:1px solid var(--line-soft);border-radius:var(--radius);overflow:hidden;background:var(--bg-card);}
.rank-item{
 display:grid;grid-template-columns:52px minmax(0,1fr) auto;
 align-items:center;gap:16px;
 padding:16px 20px;border-bottom:1px solid var(--line-soft);
 transition:background-color .2s ease;
}
.rank-item:last-child{border-bottom:0;}
.rank-item:hover{background:rgba(255,92,43,.07);}
.rank-no{
 font-size:15px;font-weight:800;color:var(--muted);
 width:34px;height:34px;border-radius:10px;display:grid;place-items:center;
 background:var(--bg-card-2);border:1px solid var(--line);
}
.rank-item:nth-child(1) .rank-no{color:#1a120b;background:linear-gradient(135deg,var(--primary),var(--amber));border-color:transparent;}
.rank-item:nth-child(2) .rank-no{color:#10131a;background:linear-gradient(135deg,#dfe6f0,#9aa6b8);border-color:transparent;}
.rank-item:nth-child(3) .rank-no{color:#1a120b;background:linear-gradient(135deg,#f0b878,#c98a4b);border-color:transparent;}
.rank-main b{display:block;font-size:15.5px;font-weight:700;}
.rank-main span{display:block;font-size:13px;color:var(--muted);margin-top:4px;}
.rank-score{font-size:13.5px;color:var(--mint);font-weight:700;white-space:nowrap;}
.rank-side{
 border:1px solid var(--line);border-radius:var(--radius-l);overflow:hidden;background:var(--bg-card);
 box-shadow:var(--shadow-s);
}
.rank-side img{width:100%;aspect-ratio:16/11;object-fit:cover;}
.rank-side-body{padding:clamp(18px,2.4vw,26px);}
.rank-side-body h3{font-size:19px;}
.rank-side-body p{margin-top:10px;color:var(--muted);font-size:14.5px;}
.mini-list{margin-top:18px;display:grid;gap:10px;}
.mini-list li{display:flex;gap:10px;font-size:14.5px;color:var(--text-2);}
.mini-list li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--primary);flex:none;margin-top:9px;}

/* ---------- 图文区块 ---------- */
.split{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(26px,4vw,58px);align-items:center;}
.split-media{position:relative;border-radius:var(--radius-l);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);}
.split-media img{width:100%;aspect-ratio:4/3;object-fit:cover;}
.split-media .float-card{
 position:absolute;left:18px;bottom:18px;right:18px;
 padding:16px 18px;border-radius:var(--radius);
 background:rgba(14,16,20,.86);border:1px solid rgba(255,255,255,.12);
 backdrop-filter:blur(8px);
}
.float-card b{display:block;font-size:15px;}
.float-card span{display:block;margin-top:6px;font-size:13px;color:var(--text-2);}
.feature-list{display:grid;gap:16px;margin-top:26px;}
.feature-list li{
 display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;
 padding:18px;border-radius:var(--radius);border:1px solid var(--line-soft);
 background:var(--bg-card);transition:border-color .2s ease,transform .2s ease;
}
.feature-list li:hover{border-color:rgba(255,92,43,.42);transform:translateX(4px);}
.feature-ico{
 width:44px;height:44px;border-radius:13px;display:grid;place-items:center;
 background:rgba(255,92,43,.14);border:1px solid rgba(255,92,43,.34);
 color:var(--primary-soft);font-weight:800;font-size:16px;
}
.feature-list b{font-size:16px;}
.feature-list p{margin-top:6px;color:var(--muted);font-size:14.5px;}

/* ---------- 投稿精选 ---------- */
.submit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);}
.submit-card{
 display:grid;grid-template-columns:132px minmax(0,1fr);gap:18px;
 padding:18px;border-radius:var(--radius);
 border:1px solid var(--line-soft);background:var(--bg-card);
 transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease;
}
.submit-card:hover{border-color:rgba(139,124,255,.42);transform:translateY(-4px);box-shadow:var(--shadow-s);}
.submit-card img{width:132px;height:112px;object-fit:cover;border-radius:var(--radius-s);}
.submit-card h3{font-size:16.5px;line-height:1.5;}
.submit-card p{margin-top:8px;color:var(--muted);font-size:14px;}
.submit-from{margin-top:12px;font-size:12.5px;color:var(--violet);}

/* ---------- 频道矩阵 ---------- */
.channel-matrix{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);}
.channel-item{
 display:block;padding:clamp(20px,2.6vw,30px);
 border-radius:var(--radius-l);border:1px solid var(--line);
 background:linear-gradient(155deg,var(--bg-card),var(--bg-soft));
 transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
.channel-item:hover{transform:translateY(-6px);border-color:rgba(255,92,43,.45);box-shadow:var(--shadow);}
.channel-item b{font-size:18px;display:block;}
.channel-item p{margin-top:10px;color:var(--muted);font-size:14.5px;}
.channel-item span{display:inline-flex;margin-top:18px;font-size:13.5px;color:var(--primary-soft);font-weight:600;}

/* ---------- FAQ ---------- */
.faq-list{display:grid;gap:14px;max-width:880px;margin:0 auto;}
.faq-item{
 border:1px solid var(--line-soft);border-radius:var(--radius);
 background:var(--bg-card);overflow:hidden;transition:border-color .2s ease;
}
.faq-item[open]{border-color:rgba(255,92,43,.42);}
.faq-item summary{
 cursor:pointer;list-style:none;
 padding:18px clamp(18px,2.4vw,24px);
 font-size:16px;font-weight:700;
 display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
 content:"+";font-size:20px;color:var(--primary-soft);font-weight:700;flex:none;
 transition:transform .22s ease;
}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item p{padding:0 clamp(18px,2.4vw,24px) 20px;color:var(--text-2);font-size:14.8px;}

/* ---------- 收口行动区 ---------- */
.cta-band{
 position:relative;overflow:hidden;
 border:1px solid var(--line);border-radius:var(--radius-l);
 padding:clamp(30px,4.4vw,58px);
 background-image:linear-gradient(115deg,rgba(14,16,20,.95),rgba(255,92,43,.16)),url('/assets/images/fc0426ec2adda0fc.webp');
 background-size:cover;background-position:center;
 display:grid;grid-template-columns:minmax(0,1.2fr) auto;gap:26px;align-items:center;
}
.cta-band h2{font-size:clamp(22px,2.9vw,32px);}
.cta-band p{margin-top:12px;color:var(--text-2);font-size:15px;max-width:620px;}
.cta-actions{display:flex;flex-wrap:wrap;gap:14px;}

/* ---------- 页脚 ---------- */
.site-footer{background:var(--bg-soft);border-top:1px solid var(--line-soft);padding:clamp(42px,5vw,72px) 0 26px;margin-top:clamp(40px,5vw,80px);}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:clamp(24px,3.4vw,46px);}
.footer-brand{display:flex;align-items:center;gap:12px;}
.footer-brand .brand-mark{width:40px;height:40px;font-size:18px;border-radius:12px;}
.footer-text{margin-top:18px;color:var(--muted);font-size:14.5px;max-width:400px;}
.footer-col h4{font-size:15px;margin-bottom:16px;}
.footer-col li{margin-bottom:11px;}
.footer-col a{color:var(--muted);font-size:14.5px;}
.footer-col a:hover{color:var(--primary-soft);}
.footer-bottom{
 margin-top:clamp(30px,4vw,48px);padding-top:22px;border-top:1px solid var(--line-soft);
 display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;
 color:var(--muted);font-size:13.5px;
}
.footer-bottom a{color:var(--text-2);border-bottom:1px dashed var(--line);}
.footer-bottom a:hover{color:var(--primary-soft);border-color:var(--primary-soft);}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
 .nav{display:none;}
 .nav-cta{display:none;}
 .nav-toggle{display:grid;}
 .page-hero-grid{grid-template-columns:1fr;}
 .grid-4,.grid-3,.quote-wall,.channel-matrix{grid-template-columns:repeat(2,minmax(0,1fr));}
 .rank-wrap{grid-template-columns:1fr;}
 .split{grid-template-columns:1fr;}
 .submit-grid{grid-template-columns:1fr;}
 .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
 .cta-band{grid-template-columns:1fr;}
}
@media (max-width:768px){
 .grid-4,.grid-3,.quote-wall,.channel-matrix,.grid-2{grid-template-columns:1fr;}
 .search-shell{grid-template-columns:1fr;}
 .search-shell .btn{width:100%;}
 .submit-card{grid-template-columns:1fr;}
 .submit-card img{width:100%;height:180px;}
 .rank-item{grid-template-columns:44px minmax(0,1fr);}
 .rank-score{grid-column:2;justify-self:start;}
 .cta-actions .btn{width:100%;}
}
@media (max-width:520px){
 .nav-wrap{height:64px;}
 .brand-mark{width:38px;height:38px;font-size:17px;}
 .brand-name{font-size:17px;}
 .brand-sub{display:none;}
 .footer-grid{grid-template-columns:1fr;}
 .footer-bottom{flex-direction:column;align-items:flex-start;}
 .page-hero{padding-top:40px;}
 .scene-card .scene-count{font-size:12px;padding:4px 10px;}
}

/* roulang page: category3 */
:root{
  --bg:#0e1014;
  --bg-soft:#151922;
  --bg-card:#1a1f2a;
  --bg-card-2:#20262f;
  --line:#2a313d;
  --line-soft:#232a35;
  --text:#eef1f6;
  --text-2:#c3cbd8;
  --muted:#8b95a6;
  --primary:#ff5c2b;
  --primary-soft:#ff7c4d;
  --amber:#ffb020;
  --mint:#28d8a8;
  --violet:#8b7cff;
  --radius-s:10px;
  --radius:16px;
  --radius-l:24px;
  --shadow-s:0 4px 14px rgba(0,0,0,.28);
  --shadow:0 14px 40px rgba(0,0,0,.42);
  --shadow-glow:0 18px 48px rgba(255,92,43,.22);
  --gap:clamp(18px,2.4vw,30px);
  --section:clamp(56px,7vw,104px);
  --font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;font-family:var(--font);background:var(--bg);color:var(--text);
  font-size:16px;line-height:1.75;letter-spacing:.01em;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto;}
a{color:inherit;text-decoration:none;transition:color .2s ease,border-color .2s ease,background-color .2s ease,transform .2s ease,box-shadow .2s ease;}
button,input,textarea,select{font:inherit;color:inherit;}
button{cursor:pointer;border:0;background:none;}
h1,h2,h3,h4{margin:0;font-weight:800;line-height:1.3;letter-spacing:-.01em;}
p{margin:0;}
ul{margin:0;padding:0;list-style:none;}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--primary-soft);outline-offset:3px;border-radius:8px;}
.container{width:100%;max-width:1220px;margin:0 auto;padding:0 clamp(18px,4vw,34px);}
.section{padding:var(--section) 0;}
.section--tight{padding:clamp(38px,4.6vw,64px) 0;}
.section--soft{background:var(--bg-soft);}
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);border:0;margin:0;}
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;padding:6px 15px;border-radius:999px;
  font-size:13px;color:var(--text-2);border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);
}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--mint);display:block;box-shadow:0 0 0 4px rgba(40,216,168,.16);}
.section-head{max-width:760px;margin-bottom:clamp(28px,3.4vw,46px);}
.section-head h2{font-size:clamp(23px,2.8vw,34px);margin-top:16px;}
.section-head p{margin-top:14px;color:var(--text-2);font-size:15.5px;}
/* ---------- 顶部导航 ---------- */
.site-header{
  position:sticky;top:0;z-index:60;background:rgba(14,16,20,.86);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft);
}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;height:72px;}
.brand{display:flex;align-items:center;gap:12px;flex:none;}
.brand-mark{
  width:42px;height:42px;border-radius:13px;flex:none;
  background:linear-gradient(140deg,var(--primary),var(--amber));
  display:grid;place-items:center;font-weight:800;font-size:19px;color:#16110c;
  box-shadow:0 8px 22px rgba(255,92,43,.3);
}
.brand-text{display:flex;flex-direction:column;line-height:1.15;}
.brand-name{font-size:19px;font-weight:800;letter-spacing:.02em;}
.brand-sub{font-size:11px;color:var(--muted);letter-spacing:.16em;text-transform:uppercase;}
.nav{display:flex;align-items:center;gap:6px;}
.nav a{padding:9px 16px;border-radius:999px;font-size:15px;color:var(--text-2);border:1px solid transparent;}
.nav a:hover{color:#fff;background:rgba(255,255,255,.06);}
.nav a.is-active{color:#fff;background:rgba(255,92,43,.14);border-color:rgba(255,92,43,.42);}
.nav-toggle{
  display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);
  background:var(--bg-card);place-items:center;
}
.nav-toggle span{display:block;width:18px;height:2px;background:var(--text);border-radius:2px;position:relative;}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--text);border-radius:2px;}
.nav-toggle span::before{top:-6px;}
.nav-toggle span::after{top:6px;}
.mobile-nav{display:none;border-top:1px solid var(--line-soft);background:rgba(14,16,20,.98);}
.mobile-nav.open{display:block;}
.mobile-nav a{display:block;padding:15px 4px;border-bottom:1px solid var(--line-soft);font-size:16px;color:var(--text-2);}
.mobile-nav a.is-active{color:var(--primary-soft);}
/* ---------- 内页页首 ---------- */
.page-hero{
  position:relative;overflow:hidden;padding:clamp(56px,7.6vw,100px) 0 clamp(48px,6vw,78px);
  background-image:linear-gradient(180deg,rgba(9,11,15,.9),rgba(11,13,18,.84) 50%,rgba(14,16,20,.98)),url('/assets/images/57d99c3f9c064365.webp');
  background-size:cover;background-position:center;border-bottom:1px solid var(--line-soft);
}
.page-hero::after{
  content:"";position:absolute;inset:auto -10% -45% -10%;height:340px;
  background:radial-gradient(60% 100% at 50% 0,rgba(255,92,43,.16),transparent 70%);pointer-events:none;
}
.page-hero .container{position:relative;z-index:2;}
.crumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13.5px;color:var(--muted);margin-bottom:22px;}
.crumb a:hover{color:var(--primary-soft);}
.crumb span{opacity:.55;}
.page-hero h1{font-size:clamp(28px,4.4vw,50px);line-height:1.24;max-width:900px;}
.page-hero h1 em{
  font-style:normal;
  background:linear-gradient(120deg,var(--primary),var(--amber) 65%,var(--mint));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.page-lead{margin-top:22px;max-width:800px;color:var(--text-2);font-size:clamp(15px,1.3vw,17px);}
.page-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 28px;border-radius:999px;font-size:15.5px;font-weight:600;
  border:1px solid transparent;
}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--amber));color:#1a120b;box-shadow:var(--shadow-glow);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 22px 46px rgba(255,92,43,.3);}
.btn-ghost{border-color:var(--line);background:rgba(255,255,255,.03);color:var(--text);}
.btn-ghost:hover{border-color:rgba(255,92,43,.5);background:rgba(255,92,43,.1);transform:translateY(-3px);}
.btn-mint{background:rgba(40,216,168,.14);border-color:rgba(40,216,168,.42);color:#c6fff0;}
.btn-mint:hover{background:rgba(40,216,168,.22);transform:translateY(-3px);}
.btn:active{transform:translateY(0) scale(.985);}
/* ---------- 数据条 ---------- */
.stat-strip{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-soft);
  border:1px solid var(--line);border-radius:var(--radius-l);overflow:hidden;
}
.stat{background:var(--bg-card);padding:clamp(20px,2.6vw,32px);}
.stat b{display:block;font-size:clamp(24px,2.9vw,36px);font-weight:800;letter-spacing:-.02em;
  background:linear-gradient(120deg,var(--primary),var(--amber));-webkit-background-clip:text;background-clip:text;color:transparent;}
.stat span{display:block;margin-top:8px;font-size:14px;color:var(--muted);}
/* ---------- 卡片网格 ---------- */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--gap);}
.tool-card{
  background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-l);
  overflow:hidden;display:flex;flex-direction:column;
}
.tool-card:hover{transform:translateY(-5px);border-color:rgba(255,92,43,.42);box-shadow:var(--shadow);}
.tool-card .thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--bg-card-2);}
.tool-card .thumb img{width:100%;height:100%;object-fit:cover;opacity:.9;transition:transform .5s ease,opacity .3s ease;}
.tool-card:hover .thumb img{transform:scale(1.06);opacity:1;}
.tool-card .thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,16,20,.05),rgba(14,16,20,.72));}
.tool-body{padding:22px 22px 26px;display:flex;flex-direction:column;gap:12px;flex:1;}
.tool-body h3{font-size:18px;}
.tool-body p{color:var(--text-2);font-size:14.6px;}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:6px;}
.tag{
  display:inline-block;padding:4px 12px;border-radius:999px;font-size:12.5px;
  color:var(--text-2);background:rgba(255,255,255,.05);border:1px solid var(--line);
}
.tag--primary{color:#ffd2c0;background:rgba(255,92,43,.14);border-color:rgba(255,92,43,.38);}
.tag--mint{color:#b8f7e4;background:rgba(40,216,168,.12);border-color:rgba(40,216,168,.34);}
.tag--violet{color:#ded9ff;background:rgba(139,124,255,.14);border-color:rgba(139,124,255,.36);}
.tag--amber{color:#ffe0ad;background:rgba(255,176,32,.14);border-color:rgba(255,176,32,.36);}
/* ---------- 语录抽取器 ---------- */
.quote-lab{
  display:grid;grid-template-columns:1.06fr .94fr;gap:var(--gap);align-items:stretch;
}
.quote-box{
  background:linear-gradient(160deg,var(--bg-card-2),var(--bg-card));
  border:1px solid var(--line);border-radius:var(--radius-l);padding:clamp(26px,3.4vw,44px);
  display:flex;flex-direction:column;gap:22px;box-shadow:var(--shadow-s);
}
.quote-mark{font-size:42px;line-height:1;color:var(--primary);font-weight:800;}
.quote-text{
  font-size:clamp(19px,2.1vw,26px);line-height:1.62;font-weight:600;min-height:3.4em;
  transition:opacity .25s ease,transform .25s ease;
}
.quote-text.is-swap{opacity:0;transform:translateY(8px);}
.quote-meta{color:var(--muted);font-size:13.5px;}
.quote-actions{display:flex;flex-wrap:wrap;gap:12px;}
.quote-side{
  background:var(--bg-soft);border:1px solid var(--line-soft);border-radius:var(--radius-l);
  padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:18px;
}
.quote-side h3{font-size:19px;}
.side-list{display:flex;flex-direction:column;gap:14px;}
.side-list li{display:flex;gap:12px;font-size:14.6px;color:var(--text-2);}
.side-list li b{flex:none;width:26px;height:26px;border-radius:9px;display:grid;place-items:center;
  font-size:12.5px;color:#1a120b;background:linear-gradient(135deg,var(--primary),var(--amber));}
/* ---------- 呼吸节奏器 ---------- */
.breath-panel{
  display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--gap);align-items:center;
  background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-l);
  padding:clamp(26px,3.6vw,48px);
}
.breath-stage{display:grid;place-items:center;min-height:280px;}
.breath-circle{
  width:clamp(160px,20vw,220px);height:clamp(160px,20vw,220px);border-radius:50%;
  display:grid;place-items:center;text-align:center;
  background:radial-gradient(circle at 50% 40%,rgba(255,92,43,.3),rgba(255,92,43,.06) 70%);
  border:1px solid rgba(255,92,43,.42);
  transform:scale(.86);transition:transform 4s ease-in-out;
  box-shadow:0 0 60px rgba(255,92,43,.18) inset;
}
.breath-circle strong{display:block;font-size:clamp(20px,2.4vw,26px);}
.breath-circle small{display:block;margin-top:6px;color:var(--text-2);font-size:13.5px;}
.breath-info h3{font-size:clamp(21px,2.4vw,28px);}
.breath-info p{margin-top:14px;color:var(--text-2);font-size:15px;}
.breath-steps{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;}
.breath-actions{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap;}
/* ---------- 场景标签页 ---------- */
.tab-bar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:clamp(24px,3vw,36px);}
.tab-btn{
  padding:11px 22px;border-radius:999px;font-size:14.6px;font-weight:600;
  border:1px solid var(--line);background:var(--bg-card);color:var(--text-2);
}
.tab-btn:hover{color:#fff;border-color:rgba(255,92,43,.45);}
.tab-btn.is-active{background:linear-gradient(135deg,var(--primary),var(--amber));color:#1a120b;border-color:transparent;box-shadow:var(--shadow-glow);}
.scene-panel{display:none;}
.scene-panel.is-active{display:block;animation:fadeUp .35s ease;}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.scene-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);}
.scene-card{
  background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);
  padding:24px;display:flex;flex-direction:column;gap:12px;
}
.scene-card:hover{border-color:rgba(255,92,43,.4);transform:translateY(-4px);box-shadow:var(--shadow-s);}
.scene-card h4{font-size:17px;}
.scene-card p{color:var(--text-2);font-size:14.4px;}
/* ---------- 图文区块 ---------- */
.split{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(24px,3.4vw,52px);align-items:center;}
.split-media{border-radius:var(--radius-l);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);}
.split-media img{width:100%;aspect-ratio:4/3;object-fit:cover;}
.split-body h2{font-size:clamp(23px,2.8vw,34px);}
.split-body > p{margin-top:16px;color:var(--text-2);font-size:15.4px;}
.check-list{display:flex;flex-direction:column;gap:14px;margin-top:24px;}
.check-list li{display:flex;gap:12px;font-size:15px;color:var(--text-2);}
.check-list li b{
  flex:none;width:24px;height:24px;border-radius:8px;display:grid;place-items:center;
  font-size:13px;color:#062b21;background:var(--mint);
}
/* ---------- FAQ ---------- */
.faq{display:flex;flex-direction:column;gap:14px;}
.faq details{
  background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 24px;
}
.faq details[open]{border-color:rgba(255,92,43,.4);}
.faq summary{
  cursor:pointer;font-size:16.5px;font-weight:700;list-style:none;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-size:20px;color:var(--primary);font-weight:700;}
.faq details[open] summary::after{content:"−";}
.faq p{margin-top:14px;color:var(--text-2);font-size:14.8px;}
/* ---------- 时间线 ---------- */
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);}
.tl-item{background:var(--bg-card);border:1px solid var(--line-soft);border-radius:var(--radius);padding:22px;}
.tl-item span{font-size:12.5px;letter-spacing:.1em;color:var(--primary-soft);font-weight:700;}
.tl-item h4{margin-top:12px;font-size:16.5px;}
.tl-item p{margin-top:10px;color:var(--muted);font-size:14px;}
/* ---------- 收口行动区 ---------- */
.cta-band{
  position:relative;overflow:hidden;border-radius:var(--radius-l);
  border:1px solid rgba(255,92,43,.34);
  background:linear-gradient(140deg,rgba(255,92,43,.16),rgba(139,124,255,.12) 55%,rgba(40,216,168,.1)),var(--bg-card);
  padding:clamp(30px,4.4vw,58px);text-align:center;
}
.cta-band h2{font-size:clamp(22px,2.9vw,34px);}
.cta-band p{margin:16px auto 0;max-width:720px;color:var(--text-2);font-size:15.6px;}
.cta-actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:30px;}
/* ---------- 页脚 ---------- */
.site-footer{background:var(--bg-soft);border-top:1px solid var(--line-soft);padding:clamp(44px,5.6vw,72px) 0 26px;margin-top:clamp(52px,6vw,88px);}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(24px,3.4vw,48px);}
.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.footer-brand .brand-mark{width:40px;height:40px;font-size:18px;}
.footer-brand .brand-text{display:flex;flex-direction:column;line-height:1.2;}
.footer-text{color:var(--muted);font-size:14.4px;max-width:360px;}
.footer-col h4{font-size:15px;margin-bottom:16px;}
.footer-col li{margin-bottom:11px;}
.footer-col a{color:var(--muted);font-size:14.4px;}
.footer-col a:hover{color:var(--primary-soft);}
.footer-bottom{
  margin-top:clamp(30px,4vw,52px);padding-top:22px;border-top:1px solid var(--line-soft);
  display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;color:var(--muted);font-size:13.6px;
}
.footer-bottom a:hover{color:var(--primary-soft);}
/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .nav{display:none;}
  .nav-toggle{display:grid;}
  .grid-3{grid-template-columns:repeat(2,1fr);}
  .scene-grid{grid-template-columns:repeat(2,1fr);}
  .quote-lab,.breath-panel,.split{grid-template-columns:1fr;}
  .stat-strip{grid-template-columns:repeat(2,1fr);}
  .timeline{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:768px){
  .page-hero h1{font-size:clamp(25px,6.6vw,34px);}
  .grid-3,.grid-2,.scene-grid{grid-template-columns:1fr;}
  .btn{padding:13px 22px;font-size:15px;}
  .breath-stage{min-height:230px;}
}
@media (max-width:520px){
  .stat-strip{grid-template-columns:1fr;}
  .timeline{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .page-actions,.cta-actions{flex-direction:column;align-items:stretch;}
  .page-actions .btn,.cta-actions .btn{width:100%;}
  .quote-actions .btn,.breath-actions .btn{width:100%;}
}

/* roulang: framework shim */
/* 覆盖 Bootstrap 等对 a/btn 的全局默认，避免导航出现下划线/蓝链 */
.site-header a,.site-header a:hover,.navbar a,.navbar a:hover,.nav-links a,.nav-links a:hover,header nav a,header nav a:hover{text-decoration:none}
.site-header .btn,.navbar .btn,.nav-cta{text-decoration:none}
