/* roulang page: index */
:root{
  --ink:#1B1815;
  --ink-2:#5C554C;
  --paper:#F7F2E8;
  --card:#FFFDF8;
  --amber:#C97A2B;
  --amber-d:#A05E19;
  --reel:#2F4A46;
  --dark:#14110E;
  --line:#E3DACB;
  --frost:#F3E7D6;
  --r-card:6px;
  --r-btn:4px;
  --r-img:4px;
  --sh:0 2px 10px rgba(20,17,14,.06);
  --sh-h:0 6px 20px rgba(20,17,14,.10);
  --tr:.25s ease;
  --serif:"Noto Serif SC","Source Han Serif SC","Songti SC",Georgia,serif;
  --sans:"Noto Sans SC",system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
  --num:Georgia,"Times New Roman",serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.9;
  font-weight:400;letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;
}
body.no-scroll{overflow:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none;transition:color var(--tr),border-color var(--tr),background-color var(--tr)}
a:hover{color:var(--amber)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;letter-spacing:.01em;margin:0 0 .6em;color:var(--ink)}
h1{font-size:40px;line-height:1.2}
h2{font-size:30px;line-height:1.33}
h3{font-size:22px;line-height:1.45}
p{margin:0 0 1.15em}
p:last-child{margin-bottom:0}
ul,ol{margin:0;padding:0;list-style:none}
button{font-family:inherit;cursor:pointer}
input,textarea,select{font-family:inherit;font-size:16px}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.container{width:100%;max-width:1200px;margin:0 auto;padding-left:24px;padding-right:24px}
@media (min-width:1400px){.container{max-width:1280px}}
.tcode{font-family:var(--num);font-size:13px;letter-spacing:.1em;color:var(--amber);display:inline-block}

/* ---------- 顶栏 ---------- */
.site-header{position:sticky;top:0;z-index:1040;background:var(--paper);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:inline-flex;align-items:center;gap:10px;font-family:var(--serif);font-size:21px;font-weight:700;letter-spacing:.02em;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand-mark{width:4px;height:20px;background:var(--amber);display:inline-block;border-radius:1px}
.header-right{display:flex;align-items:center;gap:16px}
.nav-toggle{
  width:44px;height:44px;border:0;background:transparent;display:flex;flex-direction:column;
  justify-content:center;align-items:flex-end;gap:5px;padding:0;
}
.nav-toggle span{display:block;height:2px;width:22px;background:var(--ink);transition:var(--tr)}
.nav-toggle:hover span{background:var(--amber)}
.nav-toggle span:nth-child(2){width:16px}
.nav-toggle:hover span:nth-child(2){width:22px}

/* ---------- 按钮 ---------- */
.btn-amber,.btn-ghost,.btn-ghost-light{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:46px;padding:0 26px;border-radius:var(--r-btn);
  font-size:16px;font-weight:500;letter-spacing:.04em;border:0;transition:var(--tr);
  white-space:nowrap;
}
.btn-amber{background:var(--amber);color:#fff}
.btn-amber:hover{background:var(--amber-d);color:#fff;transform:translateY(1px)}
.btn-ghost{background:transparent;border:1.5px solid var(--ink);color:var(--ink)}
.btn-ghost:hover{background:var(--amber);border-color:var(--amber);color:#fff}
.btn-ghost-light{background:transparent;border:1.5px solid rgba(247,242,232,.55);color:#F7F2E8}
.btn-ghost-light:hover{background:var(--amber);border-color:var(--amber);color:#fff}
.btn-sm-cta{height:38px;padding:0 18px;font-size:14px;border-radius:var(--r-btn)}
.w-100{width:100%}

/* ---------- 抽屉导航 ---------- */
.nav-overlay{position:fixed;inset:0;background:rgba(20,17,14,.55);opacity:0;transition:opacity .3s ease;z-index:1050}
.nav-overlay.is-open{opacity:1}
.nav-drawer{
  position:fixed;top:0;right:0;height:100%;width:480px;max-width:100%;
  background:var(--card);border-left:4px solid var(--amber);
  transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);
  z-index:1060;display:flex;flex-direction:column;overflow-y:auto;
}
.nav-drawer.is-open{transform:translateX(0)}
.drawer-top{display:flex;align-items:center;justify-content:space-between;padding:20px 28px;border-bottom:1px solid var(--line)}
.drawer-close{width:40px;height:40px;border:1px solid var(--line);background:transparent;border-radius:var(--r-btn);font-size:22px;line-height:1;color:var(--ink);transition:var(--tr)}
.drawer-close:hover{border-color:var(--amber);color:var(--amber)}
.drawer-main{padding:16px 0 4px}
.drawer-list li{border-bottom:1px solid var(--line)}
.drawer-list a{display:block;padding:18px 28px;font-family:var(--serif);font-size:26px;font-weight:600;position:relative;transition:var(--tr)}
.drawer-list a::before{content:"";position:absolute;left:0;top:22%;height:56%;width:3px;background:var(--amber);opacity:0;transition:var(--tr)}
.drawer-list a:hover{padding-left:36px;color:var(--amber)}
.drawer-list a:hover::before{opacity:1}
.drawer-list a.is-active{color:var(--amber)}
.drawer-list a.is-active::before{opacity:1}
.drawer-sub{padding:26px 28px;border-bottom:1px solid var(--line)}
.drawer-label{font-size:13px;letter-spacing:.12em;color:var(--ink-2);margin-bottom:14px}
.drawer-tags{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.drawer-tags a,.drawer-tags span{
  display:inline-block;padding:7px 16px;border-radius:999px;font-size:14px;
  border:1px solid var(--line);color:var(--ink-2);background:var(--frost);letter-spacing:.04em;
}
.drawer-tags a{background:var(--amber);border-color:var(--amber);color:#fff}
.drawer-tags a:hover{background:var(--amber-d);color:#fff}
.drawer-search{display:flex;gap:10px}
.drawer-search input{
  flex:1;height:44px;border:1px solid var(--line);border-radius:var(--r-btn);
  background:#fff;padding:0 14px;color:var(--ink);
}
.drawer-search input::placeholder{color:#A79C8C}
.drawer-search button{
  height:44px;padding:0 18px;border:0;border-radius:var(--r-btn);
  background:var(--reel);color:#F2E9DB;font-size:15px;letter-spacing:.06em;transition:var(--tr);
}
.drawer-search button:hover{background:var(--amber)}
.drawer-foot{margin-top:auto;padding:24px 28px 30px}
.drawer-foot p{margin:16px 0 0;font-size:13px;color:var(--ink-2)}
@media (max-width:768px){
  .nav-drawer{width:100%;border-left:0}
  .drawer-list a{font-size:24px}
  .header-inner{height:56px}
  .brand{font-size:19px}
}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;background:var(--dark);color:#F5EDE0}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.52}
.hero-mask{position:absolute;inset:0;background:linear-gradient(100deg,rgba(20,17,14,.9) 0%,rgba(20,17,14,.68) 48%,rgba(20,17,14,.38) 100%)}
.hero-body{position:relative;z-index:2;padding:104px 0 68px}
.hero-kicker{
  display:inline-block;font-size:13px;letter-spacing:.14em;color:var(--amber);
  border:1px solid rgba(201,122,43,.55);border-radius:999px;padding:6px 16px;margin-bottom:26px;
}
.hero-title{font-size:44px;line-height:1.28;color:#FFF9EF;max-width:860px;margin-bottom:20px}
.hero-sub{font-size:19px;line-height:1.7;color:#E6DBC9;max-width:720px;margin-bottom:16px}
.hero-lead{font-size:16px;line-height:1.95;color:#C4B8A5;max-width:720px;margin-bottom:34px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.hero-meta{position:relative;z-index:2;border-top:1px solid rgba(227,218,203,.2);background:rgba(20,17,14,.6)}
.hero-meta-inner{display:flex;flex-wrap:wrap}
.hero-meta-item{flex:1 1 200px;padding:18px 24px;border-left:1px solid rgba(227,218,203,.16)}
.hero-meta-item:first-child{border-left:0;padding-left:0}
.hero-meta-item strong{display:block;font-family:var(--num);font-size:22px;color:var(--amber);line-height:1.3}
.hero-meta-item span{font-size:13px;letter-spacing:.06em;color:#BFB3A1}

/* ---------- 板块通用 ---------- */
.block{padding:96px 0;position:relative}
.block-alt{background:#FBF7EF}
.block-dark{background:var(--dark);color:#EFE6D8}
.block-dark h2,.block-dark h3{color:#FBF6EC}
.block-frost{background:var(--frost)}
.sec-head{margin-bottom:52px;position:relative}
.sec-head .idx{
  display:block;font-family:var(--num);font-size:68px;line-height:1;
  color:var(--amber);opacity:.12;margin-bottom:-34px;letter-spacing:.02em;
}
.sec-head h2{margin:0 0 14px;position:relative;padding-left:18px}
.sec-head h2::before{content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:3px;background:var(--amber)}
.sec-head .lead{color:var(--ink-2);max-width:780px;font-size:16px;line-height:1.95;margin:0}
.block-dark .sec-head .lead{color:#BBAE9B}
.sec-head-dark h2{padding-left:18px}

/* ---------- 频道矩阵 ---------- */
.ch-main{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;height:100%;transition:var(--tr);display:flex;flex-direction:column}
.ch-main:hover{box-shadow:var(--sh-h);transform:translateY(-3px)}
.ch-main img{width:100%;aspect-ratio:16/10;object-fit:cover}
.ch-main-body{padding:26px 28px 30px}
.ch-main-body h3{margin:10px 0 12px}
.ch-main-body p{color:var(--ink-2);font-size:16px;margin-bottom:18px}
.ch-arrow{font-size:14px;letter-spacing:.08em;color:var(--amber)}
.ch-stack{display:flex;flex-direction:column;gap:24px;height:100%}
.ch-narrow{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);
  padding:22px 24px;flex:1;transition:var(--tr);position:relative;overflow:hidden;
}
.ch-narrow::after{content:"";position:absolute;top:0;left:0;width:26px;height:1px;background:var(--amber)}
.ch-narrow:hover{box-shadow:var(--sh-h);transform:translateY(-3px);border-color:#D6C6A8}
.ch-narrow h3{font-size:19px;margin:8px 0 6px}
.ch-narrow p{color:var(--ink-2);font-size:15px;line-height:1.8;margin:0}

/* ---------- 数据条 ---------- */
.data-band{padding:80px 0}
.data-row{display:flex;flex-wrap:wrap}
.data-item{flex:1 1 25%;padding:8px 30px;border-left:1px solid rgba(227,218,203,.18)}
.data-item:first-child{border-left:0;padding-left:0}
.data-num{display:block;font-family:var(--num);font-size:40px;line-height:1.2;color:var(--amber)}
.data-num em{font-style:normal;font-size:22px;margin-left:4px}
.data-label{display:block;font-size:14px;letter-spacing:.06em;color:#BCAF9C;margin-top:6px}

/* ---------- 流程 ---------- */
.flow-row{display:flex;flex-wrap:wrap;gap:0}
.flow-item{flex:1 1 25%;position:relative;padding:0 26px 0 0}
.flow-item::after{
  content:"";position:absolute;top:23px;left:56px;right:6px;height:1px;
  border-top:1px dashed #CFC0A6;
}
.flow-item:last-child::after{display:none}
.flow-dot{
  width:46px;height:46px;border-radius:50%;border:1.5px solid var(--amber);
  color:var(--amber);font-family:var(--num);font-size:17px;
  display:flex;align-items:center;justify-content:center;margin-bottom:18px;background:var(--paper);
  position:relative;z-index:2;
}
.flow-item h3{font-size:19px;margin-bottom:8px}
.flow-item p{color:var(--ink-2);font-size:15px;line-height:1.8;margin:0;padding-right:20px}

/* ---------- 专题墙 ---------- */
.wall-card{
  position:relative;display:block;border-radius:var(--r-card);overflow:hidden;
  border:1px solid var(--line);background:var(--card);height:100%;transition:var(--tr);
}
.wall-card:hover{box-shadow:var(--sh-h);transform:translateY(-3px)}
.wall-card img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.wall-card:hover img{transform:scale(1.03)}
.wall-big .wall-thumb{aspect-ratio:16/9}
.wall-sm .wall-thumb{aspect-ratio:4/3}
.wall-thumb{position:relative;overflow:hidden;display:block}
.wall-cap{position:absolute;left:0;right:0;bottom:0;padding:22px 22px 20px;background:linear-gradient(to top,rgba(20,17,14,.86),rgba(20,17,14,0))}
.wall-cap h3{color:#FFF9EF;font-size:20px;margin:6px 0 0;display:inline-block;background-image:linear-gradient(var(--amber),var(--amber));background-repeat:no-repeat;background-size:0 2px;background-position:0 100%;transition:background-size .3s ease}
.wall-card:hover .wall-cap h3{background-size:100% 2px}
.wall-cap .tcode{color:#F0C489}
.wall-small .wall-cap{padding:16px 16px 14px}
.wall-small .wall-cap h3{font-size:16px}

/* ---------- 片单 + 排行 ---------- */
.list-item{
  display:flex;gap:26px;padding:24px 0;border-bottom:1px solid var(--line);
  transition:var(--tr);
}
.list-item:first-child{padding-top:0}
.list-item:hover{padding-left:8px}
.list-day{font-family:var(--num);font-size:14px;letter-spacing:.08em;color:var(--ink-2);min-width:64px;padding-top:6px}
.list-body h3{font-size:20px;margin:0 0 8px}
.list-body p{color:var(--ink-2);font-size:15px;line-height:1.8;margin:0 0 10px}
.tag{
  display:inline-block;font-size:12px;letter-spacing:.08em;padding:4px 12px;border-radius:999px;
  background:var(--frost);color:var(--reel);border:1px solid #E0D2BC;
}
.rank-box{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:26px 24px}
.rank-box h3{font-size:19px;margin-bottom:18px}
.rank-item{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);align-items:baseline}
.rank-item:last-child{border-bottom:0;padding-bottom:0}
.rank-no{font-family:var(--num);font-size:15px;color:var(--amber);min-width:26px}
.rank-item a{font-size:15.5px;line-height:1.6}
.rank-item a:hover{color:var(--amber)}

/* ---------- 创作者 ---------- */
.creator-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);
  padding:28px 26px;height:100%;transition:var(--tr);
}
.creator-card:hover{box-shadow:var(--sh-h);transform:translateY(-3px)}
.creator-card .tcode{margin-bottom:12px;display:block}
.creator-card h3{font-size:20px;margin-bottom:6px}
.creator-card p{color:var(--ink-2);font-size:15px;line-height:1.85}
.creator-sign{display:block;font-size:13px;letter-spacing:.06em;color:var(--ink-2);margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.quote-block{
  border-left:3px solid var(--reel);background:#FBF7EF;padding:28px 32px;margin-top:34px;border-radius:0 var(--r-card) var(--r-card) 0;
}
.quote-block p{font-family:var(--serif);font-size:20px;line-height:1.8;color:var(--ink);margin-bottom:10px}
.quote-block span{font-size:13px;letter-spacing:.06em;color:var(--ink-2)}

/* ---------- 分类入口 ---------- */
.cat-list{display:flex;flex-wrap:wrap;gap:16px}
.cat-pill{
  display:flex;align-items:center;gap:16px;padding:16px 24px;border-radius:999px;
  border:1px solid var(--line);background:var(--card);transition:var(--tr);
  font-size:16px;letter-spacing:.02em;
}
.cat-pill .cat-count{font-family:var(--num);font-size:13px;color:var(--ink-2)}
.cat-pill .cat-go{color:var(--amber);font-size:15px}
.cat-pill.is-primary{background:var(--amber);border-color:var(--amber);color:#fff}
.cat-pill.is-primary .cat-count,.cat-pill.is-primary .cat-go{color:#F7E4CB}
.cat-pill.is-primary:hover{background:var(--amber-d);border-color:var(--amber-d);color:#fff}
.cat-pill.is-plain{cursor:default;color:var(--ink-2)}
.cat-pill.is-plain:hover{border-color:var(--line);color:var(--ink-2)}
.cat-pill:not(.is-plain):hover{box-shadow:var(--sh-h);transform:translateY(-3px)}

/* ---------- 评价 ---------- */
.review-card{border-radius:var(--r-card);padding:32px 30px;height:100%;transition:var(--tr);border:1px solid var(--line)}
.review-card:hover{transform:translateY(-3px);box-shadow:var(--sh-h)}
.review-light{background:var(--card);color:var(--ink)}
.review-dark{background:var(--dark);color:#EFE6D8;border-color:var(--dark)}
.review-dark p{color:#E4D8C5}
.review-dark .review-sign{color:#B9AC99}
.review-mark{font-family:var(--num);font-size:52px;line-height:.7;color:var(--amber);display:block;margin-bottom:15px}
.review-card p{font-family:var(--serif);font-size:18px;line-height:1.85}
.review-sign{display:block;font-size:13px;letter-spacing:.06em;color:var(--ink-2);margin-top:18px;font-family:var(--sans)}

/* ---------- 合作伙伴 ---------- */
.partner-row{display:flex;flex-wrap:wrap;gap:14px 42px;align-items:center}
.partner-row span{
  font-family:var(--serif);font-size:19px;letter-spacing:.06em;color:#9C9284;
  transition:var(--tr);cursor:default;
}
.partner-row span:hover{color:var(--amber)}

/* ---------- FAQ ---------- */
.faq .accordion-item{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0}
.faq .accordion-item:last-child{border-bottom:1px solid var(--line)}
.faq .accordion-button{
  background:transparent;box-shadow:none;color:var(--ink);font-family:var(--serif);
  font-size:20px;font-weight:600;line-height:1.6;padding:24px 48px 24px 0;border-radius:0;
  position:relative;
}
.faq .accordion-button:not(.collapsed){color:var(--amber);background:transparent;box-shadow:none}
.faq .accordion-button::after{display:none}
.faq .accordion-button::before{
  content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);
  font-family:var(--num);font-size:26px;line-height:1;color:var(--amber);
}
.faq .accordion-button:not(.collapsed)::before{content:"−"}
.faq .accordion-body{padding:0 56px 26px 0;color:var(--ink-2);font-size:16px;line-height:1.9}
.faq .accordion-button:focus{box-shadow:none;outline:0}
.faq .accordion-button:focus-visible{outline:2px solid var(--amber);outline-offset:2px}

/* ---------- 保障条 ---------- */
.guard-row{display:flex;flex-wrap:wrap;gap:0}
.guard-item{flex:1 1 25%;padding:6px 28px;border-left:1px solid #DECCB0}
.guard-item:first-child{border-left:0;padding-left:0}
.guard-item strong{display:block;font-family:var(--serif);font-size:18px;margin-bottom:6px}
.guard-item p{font-size:15px;line-height:1.8;color:var(--ink-2);margin:0}
.guard-dot{width:26px;height:3px;background:var(--amber);display:block;margin-bottom:14px}

/* ---------- 长尾问答 ---------- */
.qa-item{padding:22px 0;border-bottom:1px solid var(--line)}
.qa-item h3{font-size:18px;margin-bottom:8px;font-family:var(--serif)}
.qa-item p{color:var(--ink-2);font-size:15.5px;line-height:1.85;margin:0}

/* ---------- 订阅 CTA ---------- */
.subscribe-form{display:flex;gap:12px;flex-wrap:wrap}
.subscribe-form input{
  flex:1 1 280px;height:48px;border:1px solid var(--line);border-radius:var(--r-btn);
  background:#fff;padding:0 16px;color:var(--ink);
}
.subscribe-form input::placeholder{color:#A79C8C}
.subscribe-form button{
  height:48px;padding:0 30px;border:0;border-radius:var(--r-btn);
  background:var(--amber);color:#fff;font-size:16px;letter-spacing:.04em;font-weight:500;transition:var(--tr);
}
.subscribe-form button:hover{background:var(--amber-d)}
.form-note{font-size:13px;color:#A79C8C;margin-top:14px}

/* ---------- 页脚 ---------- */
.site-footer{background:var(--dark);color:#D9CEBE;border-top:1px solid var(--amber);padding:72px 0 30px}
.brand-light{color:#FBF6EC}
.brand-light:hover{color:#FBF6EC}
.footer-desc{font-size:15px;line-height:1.9;color:#A99D8B;margin-top:18px;max-width:340px}
.footer-desc.small{font-size:14px}
.footer-label{font-size:13px;letter-spacing:.12em;color:#8E8271;margin-bottom:18px}
.footer-links li{margin-bottom:11px}
.footer-links a{font-size:15px;color:#D9CEBE}
.footer-links a:hover{color:var(--amber)}
.footer-cta{display:inline-block;margin-top:6px;font-size:15px;color:var(--amber);border-bottom:1px solid rgba(201,122,43,.5);padding-bottom:2px}
.footer-bottom{
  margin-top:56px;padding-top:22px;border-top:1px solid rgba(227,218,203,.16);
  display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;
  font-size:13px;color:#8E8271;letter-spacing:.04em;
}

/* ---------- 响应式 ---------- */
@media (max-width:1199px){
  .hero-title{font-size:38px}
  .sec-head .idx{font-size:58px}
}
@media (max-width:991px){
  .block{padding:76px 0}
  .data-item{flex:1 1 50%;padding:16px 22px;border-left:0;border-bottom:1px solid rgba(227,218,203,.16)}
  .data-item:nth-child(odd){border-right:1px solid rgba(227,218,203,.16);padding-left:0}
  .data-item:first-child{padding-left:0}
  .flow-item{flex:1 1 50%;margin-bottom:34px}
  .flow-item::after{display:none}
  .guard-item{flex:1 1 50%;padding:16px 22px;border-left:0;border-bottom:1px solid #DECCB0}
  .guard-item:nth-child(odd){border-right:1px solid #DECCB0;padding-left:0}
  .guard-item:first-child{padding-left:0}
}
@media (max-width:767px){
  body{font-size:16px;line-height:1.85}
  h1{font-size:30px;line-height:1.38}
  h2{font-size:24px}
  h3{font-size:19px}
  .block{padding:56px 0}
  .container{padding-left:18px;padding-right:18px}
  .hero-body{padding:64px 0 44px}
  .hero-title{font-size:30px;line-height:1.38}
  .hero-sub{font-size:16.5px}
  .hero-lead{font-size:15px}
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-actions .btn-amber,.hero-actions .btn-ghost-light{width:100%}
  .hero-meta-item{flex:1 1 50%;padding:14px 16px}
  .hero-meta-item:nth-child(odd){border-left:0}
  .sec-head{margin-bottom:34px}
  .sec-head .idx{font-size:48px;margin-bottom:-22px}
  .data-num{font-size:32px}
  .data-item,.guard-item{flex:1 1 100%;border-right:0}
  .flow-item{flex:1 1 100%}
  .list-item{gap:16px}
  .list-day{min-width:52px;font-size:13px}
  .faq .accordion-button{font-size:17px;padding:20px 40px 20px 0}
  .faq .accordion-body{padding-right:8px}
  .quote-block{padding:22px 20px}
  .quote-block p{font-size:17px}
  .partner-row{gap:12px 26px}
  .partner-row span{font-size:16px}
  .subscribe-form{flex-direction:column}
  .subscribe-form input,.subscribe-form button{width:100%}
  .site-footer{padding:52px 0 26px}
  .footer-bottom{margin-top:36px}
}

/* roulang page: category1 */
:root{
  --ink:#1B1815;
  --ink-2:#5C554C;
  --paper:#F7F2E8;
  --card:#FFFDF8;
  --amber:#C97A2B;
  --amber-d:#A05E19;
  --reel:#2F4A46;
  --dark:#14110E;
  --line:#E3DACB;
  --frost:#F3E7D6;
  --r-card:6px;
  --r-btn:4px;
  --r-img:4px;
  --sh:0 2px 10px rgba(20,17,14,.06);
  --sh-h:0 6px 20px rgba(20,17,14,.10);
  --tr:.25s ease;
  --serif:"Noto Serif SC","Source Han Serif SC","Songti SC",Georgia,serif;
  --sans:"Noto Sans SC",system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
  --num:Georgia,"Times New Roman",serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.9;font-weight:400;
  letter-spacing:.005em;-webkit-font-smoothing:antialiased;
}
body.no-scroll{overflow:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none;transition:color var(--tr),border-color var(--tr),background-color var(--tr),transform var(--tr)}
a:hover{color:var(--amber)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;color:var(--ink);margin:0;letter-spacing:.01em}
p{margin:0 0 1.15em}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit;font-size:16px}
:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
.container{width:100%;max-width:1280px;margin:0 auto;padding-left:24px;padding-right:24px}
.sec{padding:88px 0}
.sec-tight{padding:64px 0}
.sec-head{max-width:820px;margin-bottom:44px}
.sec-num{font-family:var(--num);font-size:13px;letter-spacing:.16em;color:var(--amber);display:block;margin-bottom:12px}
.sec-head h2{font-size:30px;line-height:1.35;margin-bottom:14px}
.sec-head p{color:var(--ink-2);font-size:16px;margin:0}
.rule-amber{border-top:1px solid var(--line)}

/* ---------- 顶栏 ---------- */
.site-header{position:sticky;top:0;z-index:1040;background:var(--paper);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:inline-flex;align-items:center;gap:10px;font-family:var(--serif);font-size:21px;font-weight:700;letter-spacing:.02em;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand-mark{width:4px;height:20px;background:var(--amber);display:inline-block;border-radius:1px}
.header-right{display:flex;align-items:center;gap:16px}
.nav-toggle{width:44px;height:44px;border:0;background:transparent;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;gap:5px;padding:0}
.nav-toggle span{display:block;height:2px;width:22px;background:var(--ink);transition:var(--tr)}
.nav-toggle:hover span{background:var(--amber)}
.nav-toggle span:nth-child(2){width:16px}
.nav-toggle:hover span:nth-child(2){width:22px}

/* ---------- 按钮 ---------- */
.btn-amber,.btn-ghost,.btn-ghost-light{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:46px;padding:0 26px;border-radius:var(--r-btn);
  font-size:16px;font-weight:500;letter-spacing:.04em;border:0;transition:var(--tr);white-space:nowrap;
}
.btn-amber{background:var(--amber);color:#fff}
.btn-amber:hover{background:var(--amber-d);color:#fff;transform:translateY(1px)}
.btn-ghost{background:transparent;border:1.5px solid var(--ink);color:var(--ink)}
.btn-ghost:hover{background:var(--amber);border-color:var(--amber);color:#fff}
.btn-ghost-light{background:transparent;border:1.5px solid rgba(247,242,232,.55);color:#F7F2E8}
.btn-ghost-light:hover{background:var(--amber);border-color:var(--amber);color:#fff}
.btn-sm-cta{height:38px;padding:0 18px;font-size:14px;border-radius:var(--r-btn)}

/* ---------- 抽屉导航 ---------- */
.nav-overlay{
  position:fixed;inset:0;background:rgba(20,17,14,.55);opacity:0;visibility:hidden;
  transition:opacity .3s ease,visibility .3s ease;z-index:1050;
}
.nav-overlay.is-open{opacity:1;visibility:visible}
.nav-drawer{
  position:fixed;top:0;right:0;height:100%;width:480px;max-width:100%;
  background:var(--card);border-left:4px solid var(--amber);
  transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);
  z-index:1060;display:flex;flex-direction:column;overflow-y:auto;
}
.nav-drawer.is-open{transform:translateX(0)}
.drawer-top{display:flex;align-items:center;justify-content:space-between;padding:20px 28px;border-bottom:1px solid var(--line)}
.drawer-close{width:40px;height:40px;border:1px solid var(--line);background:transparent;border-radius:var(--r-btn);font-size:22px;line-height:1;color:var(--ink);transition:var(--tr)}
.drawer-close:hover{border-color:var(--amber);color:var(--amber)}
.drawer-main{padding:16px 0 4px}
.drawer-list{list-style:none;margin:0;padding:0}
.drawer-list li{border-bottom:1px solid var(--line)}
.drawer-list a{display:block;padding:18px 28px;font-family:var(--serif);font-size:26px;font-weight:600;position:relative;transition:var(--tr)}
.drawer-list a::before{content:"";position:absolute;left:0;top:22%;height:56%;width:3px;background:var(--amber);opacity:0;transition:var(--tr)}
.drawer-list a:hover{padding-left:36px;color:var(--amber)}
.drawer-list a:hover::before{opacity:1}
.drawer-list a.is-active{color:var(--amber)}
.drawer-list a.is-active::before{opacity:1}
.drawer-sub{padding:26px 28px;border-bottom:1px solid var(--line)}
.drawer-label{font-size:13px;letter-spacing:.12em;color:var(--ink-2);margin-bottom:14px}
.drawer-tags{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.drawer-tags a,.drawer-tags span{
  display:inline-block;padding:7px 16px;border-radius:999px;font-size:14px;
  border:1px solid var(--line);color:var(--ink-2);background:var(--frost);letter-spacing:.04em;
}
.drawer-tags a{background:var(--amber);border-color:var(--amber);color:#fff}
.drawer-tags a:hover{background:var(--amber-d);color:#fff}
.drawer-search{display:flex;gap:10px}
.drawer-search input{flex:1;height:44px;border:1px solid var(--line);border-radius:var(--r-btn);background:#fff;padding:0 14px;color:var(--ink)}
.drawer-search input::placeholder{color:#A79C8C}
.drawer-search button{height:44px;padding:0 18px;border:0;border-radius:var(--r-btn);background:var(--reel);color:#F2E9DB;font-size:15px;letter-spacing:.06em;transition:var(--tr)}
.drawer-search button:hover{background:var(--amber)}
.drawer-foot{margin-top:auto;padding:24px 28px 30px}
.drawer-foot .btn-amber{width:100%}
.drawer-foot p{margin:16px 0 0;font-size:13px;color:var(--ink-2)}

/* ---------- 分类页头部 ---------- */
.cat-head{padding:48px 0 44px;border-bottom:1px solid var(--line)}
.crumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;color:var(--ink-2);letter-spacing:.06em;margin-bottom:24px;list-style:none;padding:0}
.crumb a{color:var(--ink-2)}
.crumb a:hover{color:var(--amber)}
.crumb .sep{opacity:.45;font-family:var(--num)}
.crumb [aria-current]{color:var(--amber)}
.cat-head h1{font-size:40px;line-height:1.25;margin:0 0 20px;position:relative;padding-left:18px}
.cat-head h1::before{content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:3px;background:var(--amber)}
.kicker{display:block;font-family:var(--num);font-size:13px;letter-spacing:.16em;color:var(--amber);margin-bottom:14px}
.cat-lead{font-size:17px;color:var(--ink-2);max-width:780px;margin-bottom:.7em}
.cat-lead:last-child{margin-bottom:0}
.stat-strip{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.stat-strip li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--ink-2);letter-spacing:.04em}
.stat-strip b{font-family:var(--num);font-size:24px;font-weight:400;color:var(--ink);letter-spacing:.01em}

/* ---------- 筛选条 ---------- */
.filter-sec{padding:32px 0 0}
.filter-bar{
  display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);
  padding:16px 18px;box-shadow:var(--sh);
}
.chip-group{display:flex;flex-wrap:wrap;gap:10px}
.chip{
  display:inline-flex;align-items:center;height:34px;padding:0 16px;border-radius:999px;
  border:1px solid var(--line);background:var(--paper);color:var(--ink-2);
  font-size:14px;letter-spacing:.04em;transition:var(--tr);
}
.chip:hover{border-color:var(--amber);color:var(--amber)}
.chip.is-active{background:var(--amber);border-color:var(--amber);color:#fff}
.filter-right{display:flex;align-items:center;gap:12px}
.sort-select{height:38px;border:1px solid var(--line);border-radius:var(--r-btn);background:#fff;color:var(--ink);padding:0 12px;font-size:14px}
.view-toggle{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-btn);overflow:hidden}
.view-toggle button{border:0;background:#fff;height:36px;padding:0 14px;font-size:14px;color:var(--ink-2);transition:var(--tr)}
.view-toggle button.is-active{background:var(--reel);color:#F5EDE0}

/* ---------- 编辑式卡片列表 ---------- */
.list-sec{padding:40px 0 72px}
.v-card{
  display:flex;height:100%;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh);transition:var(--tr);
}
.v-card:hover{box-shadow:var(--sh-h);transform:translateY(-3px)}
.v-thumb{position:relative;flex:0 0 42%;max-width:42%;overflow:hidden;background:var(--dark)}
.v-thumb img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/9;transition:transform .35s ease}
.v-card:hover .v-thumb img{transform:scale(1.04)}
.v-time{
  position:absolute;left:10px;top:10px;background:rgba(20,17,14,.82);color:#F6EDDE;
  font-family:var(--num);font-size:12px;letter-spacing:.08em;padding:4px 9px;border-radius:2px;
}
.v-info{padding:22px 24px;display:flex;flex-direction:column;gap:10px;flex:1 1 auto;min-width:0}
.v-tag{align-self:flex-start;font-size:12px;letter-spacing:.08em;color:var(--reel);background:var(--frost);border-radius:999px;padding:4px 12px}
.v-info h3{font-size:20px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.v-info p{
  font-size:15px;color:var(--ink-2);margin:0;line-height:1.8;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.v-meta{margin-top:auto;display:flex;flex-wrap:wrap;gap:16px;font-size:13px;color:var(--ink-2);font-family:var(--num);letter-spacing:.04em;border-top:1px solid var(--line);padding-top:12px}

.pager{display:flex;justify-content:center;margin:48px 0 0}
.pagination{margin:0;gap:6px;display:flex;flex-wrap:wrap}
.pagination .page-link{
  border-radius:0;border:1px solid var(--line);color:var(--ink);background:var(--card);
  padding:9px 15px;font-family:var(--num);font-size:15px;transition:var(--tr);
}
.pagination .page-link:hover{background:var(--frost);border-color:var(--amber);color:var(--amber-d)}
.pagination .page-item.active .page-link{background:var(--amber);border-color:var(--amber);color:#fff}
.more-row{margin-top:40px;text-align:center}

/* ---------- 精选专题 ---------- */
.feature-sec{padding:80px 0;background:var(--paper);border-top:1px solid var(--line)}
.f-card{display:flex;flex-direction:column;height:100%;background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh);transition:var(--tr)}
.f-card:hover{box-shadow:var(--sh-h);transform:translateY(-3px)}
.f-card img{width:100%;aspect-ratio:16/9;object-fit:cover}
.f-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.f-body h3{font-size:20px;line-height:1.45}
.f-body p{font-size:15px;color:var(--ink-2);margin:0}
.f-meta{margin-top:auto;font-family:var(--num);font-size:13px;letter-spacing:.06em;color:var(--amber)}

/* ---------- FAQ ---------- */
.faq-sec{padding:80px 0;border-top:1px solid var(--line)}
.faq-acc .accordion-item{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0}
.faq-acc .accordion-item:last-child{border-bottom:1px solid var(--line)}
.faq-acc .accordion-button{
  background:transparent;color:var(--ink);font-family:var(--serif);font-size:20px;font-weight:600;
  line-height:1.5;padding:22px 0;box-shadow:none;border-radius:0;
}
.faq-acc .accordion-button::after{
  background-image:none;content:"+";width:auto;height:auto;font-size:24px;color:var(--amber);
  transform:none;line-height:1;display:flex;align-items:center;justify-content:center;
}
.faq-acc .accordion-button:not(.collapsed)::after{content:"−"}
.faq-acc .accordion-button:not(.collapsed){color:var(--amber);background:transparent;box-shadow:none}
.faq-acc .accordion-button:focus{box-shadow:none;border-color:var(--line)}
.faq-acc .accordion-body{padding:0 0 24px;color:var(--ink-2);font-size:16px;line-height:1.9}

/* ---------- 分类胶囊入口 ---------- */
.chan-sec{padding:80px 0;background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.chan-list{display:flex;flex-wrap:wrap;gap:14px;list-style:none;margin:0;padding:0}
.chan-list a{
  display:inline-flex;align-items:center;gap:10px;padding:12px 22px;border-radius:999px;
  border:1px solid var(--line);background:var(--paper);font-size:15px;letter-spacing:.04em;
  color:var(--ink);transition:var(--tr);
}
.chan-list a span{font-family:var(--num);font-size:13px;color:var(--ink-2)}
.chan-list a:hover{border-color:var(--amber);background:var(--frost);color:var(--amber-d)}
.chan-list a.is-current{border-color:var(--amber);background:var(--amber);color:#fff}
.chan-list a.is-current span{color:rgba(255,255,255,.8)}

/* ---------- 编辑推荐纵向列表 ---------- */
.pick-sec{padding:80px 0;border-top:1px solid var(--line)}
.pick-list{list-style:none;margin:0;padding:0}
.pick-list li{border-top:1px solid var(--line)}
.pick-list li:last-child{border-bottom:1px solid var(--line)}
.pick-item{display:flex;gap:22px;align-items:baseline;padding:22px 0;transition:var(--tr)}
.pick-item:hover{transform:translateX(6px)}
.pick-idx{font-family:var(--num);font-size:22px;color:var(--amber);flex:0 0 48px}
.pick-body h3{font-size:19px;line-height:1.5;margin-bottom:4px}
.pick-body p{font-size:15px;color:var(--ink-2);margin:0}
.pick-time{margin-left:auto;font-family:var(--num);font-size:13px;color:var(--ink-2);letter-spacing:.06em;white-space:nowrap}

/* ---------- 保障条 ---------- */
.assure-sec{background:var(--frost);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:48px 0}
.assure-list{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;list-style:none;margin:0;padding:0}
.assure-list li{font-size:15px;color:var(--ink-2);line-height:1.8}
.assure-list strong{display:block;font-family:var(--serif);font-size:18px;color:var(--ink);margin-bottom:4px;font-weight:600}

/* ---------- 订阅 ---------- */
.sub-sec{background:var(--dark);color:#F3E9DA;padding:80px 0}
.sub-sec h2{color:#F7F2E8;font-size:30px;line-height:1.35;margin-bottom:14px}
.sub-sec .sub-copy{color:#B9AE9C;font-size:16px;margin:0;max-width:460px}
.sub-form{display:flex;flex-wrap:wrap;gap:12px}
.sub-form input{
  flex:1 1 260px;height:48px;border:1px solid #3A342C;border-radius:var(--r-btn);
  background:#fff;color:var(--ink);padding:0 16px;
}
.sub-form input::placeholder{color:#A79C8C}
.sub-form button{height:48px;padding:0 28px;border:0;border-radius:var(--r-btn);background:var(--amber);color:#fff;font-size:16px;letter-spacing:.04em;transition:var(--tr)}
.sub-form button:hover{background:var(--amber-d)}
.sub-note{margin:14px 0 0;font-size:13px;color:#9E9382;line-height:1.7}

/* ---------- 社群提示条 ---------- */
.community-sec{padding:64px 0;border-top:1px solid var(--line)}
.community-box{
  display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;align-items:center;
  background:var(--card);border:1px solid var(--line);border-left:3px solid var(--amber);
  border-radius:var(--r-card);padding:26px 28px;box-shadow:var(--sh);
}
.community-box h2{font-size:22px;margin-bottom:6px}
.community-box p{margin:0;font-size:15px;color:var(--ink-2)}

/* ---------- 页脚 ---------- */
.site-footer{background:var(--dark);color:#EFE6D8;border-top:1px solid var(--amber);padding:72px 0 0}
.brand-light{color:#F7F2E8}
.brand-light:hover{color:var(--amber)}
.footer-desc{color:#B9AE9C;font-size:15px;line-height:1.85;margin:16px 0 0;max-width:360px}
.footer-desc.small{font-size:14px;margin:0 0 14px}
.footer-label{font-size:13px;letter-spacing:.12em;color:var(--amber);margin:0 0 16px}
.footer-links{list-style:none;padding:0;margin:0}
.footer-links li{margin-bottom:10px}
.footer-links a{color:#D6CCBB;font-size:15px}
.footer-links a:hover{color:var(--amber)}
.footer-cta{
  display:inline-flex;align-items:center;height:42px;padding:0 20px;border:1.5px solid var(--amber);
  color:var(--amber);border-radius:var(--r-btn);font-size:14px;letter-spacing:.04em;transition:var(--tr);
}
.footer-cta:hover{background:var(--amber);color:#fff}
.footer-bottom{
  margin-top:56px;border-top:1px solid rgba(247,242,232,.12);padding:22px 0 28px;
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:13px;color:#9E9382;
}

/* ---------- 响应式 ---------- */
@media (max-width:1199.98px){
  .assure-list{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:991.98px){
  .sec,.feature-sec,.faq-sec,.pick-sec{padding:64px 0}
  .cat-head h1{font-size:32px}
  .sec-head h2{font-size:26px}
  .sub-sec h2{font-size:26px}
}
@media (max-width:767.98px){
  body{font-size:16px;line-height:1.85}
  .container{padding-left:18px;padding-right:18px}
  .header-inner{height:56px}
  .brand{font-size:19px}
  .nav-drawer{width:100%;border-left:0}
  .drawer-list a{font-size:24px}
  .sec,.sec-tight,.feature-sec,.faq-sec,.pick-sec,.sub-sec{padding:56px 0}
  .cat-head{padding:32px 0 36px}
  .cat-head h1{font-size:30px;line-height:1.38;padding-left:14px}
  .sec-head h2{font-size:23px}
  .v-card{flex-direction:column}
  .v-thumb{flex:none;max-width:none;width:100%}
  .v-info{padding:18px 18px 20px}
  .filter-bar{padding:14px}
  .filter-right{width:100%;justify-content:space-between}
  .pick-item{flex-wrap:wrap;gap:12px}
  .pick-time{margin-left:70px}
  .assure-list{grid-template-columns:1fr;gap:22px}
  .btn-amber,.btn-ghost{width:100%}
  .footer-bottom{flex-direction:column;gap:6px}
  .sub-form input,.sub-form button{flex:1 1 100%;width:100%}
  .community-box{padding:22px}
}

/* 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}