/* roulang page: index */
:root{
  --c1:#241f1a;
  --c2:#b4541f;
  --c3:#faf6ef;
  --c4:#fffdfa;
  --c5:#7d7266;
  --c6:#e8ddcc;
  --c7:#2a3630;
  --rd:16px;
  --sd:0 8px 26px rgba(36,31,26,.07);
  --gp:24px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{background:var(--c3);color:var(--c1);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}
img{display:block;width:100%}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
h1,h2,h3{font-family:"Songti SC","Noto Serif SC",Georgia,"PingFang SC",serif;line-height:1.35;font-weight:700}
.hfsgknig-wrap{width:min(1180px,92%);margin:0 auto}

/* 顶部导航 */
.hfsgknig-head{position:sticky;top:0;z-index:60;background:rgba(250,246,239,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--c6)}
.hfsgknig-head-in{display:flex;align-items:center;gap:24px;height:72px}
.hfsgknig-brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700;white-space:nowrap;letter-spacing:.01em}
.hfsgknig-mark{width:36px;height:36px;flex:0 0 36px;border-radius:11px;background:linear-gradient(135deg,var(--c2),#d98a4b);color:#fff;display:grid;place-items:center;font-size:16px;font-family:"Songti SC",serif}
.hfsgknig-nav{margin-left:auto}
.hfsgknig-nav ul{display:flex;gap:4px}
.hfsgknig-nav a{display:block;padding:0 13px;line-height:42px;font-size:15px;color:var(--c5);border-radius:11px;transition:background .2s,color .2s}
.hfsgknig-nav a:hover,.hfsgknig-nav a:focus-visible{background:#f1e7d8;color:var(--c1);outline:none}

/* 首屏 */
.hfsgknig-hero{position:relative;padding:64px 0 72px;border-bottom:1px solid var(--c6);background:#f3ebdd url("/assets/images/backpic/back-1.webp") center/cover no-repeat}
.hfsgknig-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(250,246,239,.95),rgba(250,246,239,.86))}
.hfsgknig-hero .hfsgknig-wrap{position:relative;z-index:1}
.hfsgknig-hero-top{max-width:780px;margin:0 auto;text-align:center}
.hfsgknig-kicker{display:inline-block;font-size:13px;letter-spacing:.16em;color:var(--c2);border:1px solid rgba(180,84,31,.35);border-radius:999px;padding:4px 15px;margin-bottom:20px}
.hfsgknig-hero h1{font-size:clamp(34px,5vw,54px);letter-spacing:.02em}
.hfsgknig-hero h1 em{font-style:normal;color:var(--c2)}
.hfsgknig-lead{max-width:740px;margin:20px auto 0;color:#4d443c;font-size:16px}
.hfsgknig-hero-btns{display:flex;gap:14px;justify-content:center;margin-top:28px;flex-wrap:wrap}
.hfsgknig-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 28px;border-radius:12px;background:var(--c2);color:#fff;font-weight:600;font-size:15px;transition:transform .18s,box-shadow .18s,background .18s}
.hfsgknig-btn:hover{background:#9c4616;box-shadow:0 10px 22px rgba(180,84,31,.28);transform:translateY(-1px)}
.hfsgknig-btn-ghost{background:transparent;color:var(--c1);border:1px solid var(--c6)}
.hfsgknig-btn-ghost:hover{background:#fff;box-shadow:var(--sd);color:var(--c1)}
.hfsgknig-swap{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px}
.hfsgknig-swap-item{background:var(--c4);border:1px solid var(--c6);border-radius:20px;padding:28px 26px;box-shadow:var(--sd)}
.hfsgknig-swap-item .hfsgknig-swap-t{font-size:20px;font-family:"Songti SC",serif;font-weight:700;margin:12px 0 14px}
.hfsgknig-swap-item ul li{position:relative;padding-left:20px;color:var(--c5);font-size:15px;line-height:2.05}
.hfsgknig-swap-item ul li::before{content:"";position:absolute;left:0;top:14px;width:7px;height:7px;border-radius:50%;background:var(--c6)}
.hfsgknig-swap-tag{display:inline-block;font-size:12px;letter-spacing:.1em;color:var(--c5);background:#f4ecdf;border-radius:8px;padding:3px 11px}
.hfsgknig-swap-new{border-color:rgba(180,84,31,.35);background:linear-gradient(160deg,#fffaf3,#fff)}
.hfsgknig-swap-new ul li::before{background:var(--c2)}
.hfsgknig-swap-new .hfsgknig-swap-tag{background:rgba(180,84,31,.12);color:var(--c2)}

/* 板块通用 */
.hfsgknig-sec{padding:64px 0;border-bottom:1px solid var(--c6)}
.hfsgknig-hd{max-width:760px;margin-bottom:32px}
.hfsgknig-hd h2{font-size:clamp(22px,2.6vw,30px);margin-bottom:12px}
.hfsgknig-hd p{color:var(--c5);font-size:15px}

/* 数据块 */
.hfsgknig-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.hfsgknig-kpi li{background:var(--c4);border:1px solid var(--c6);border-radius:var(--rd);padding:24px;box-shadow:var(--sd)}
.hfsgknig-kpi strong{display:block;font-size:19px;font-family:"Songti SC",serif;margin-bottom:6px}
.hfsgknig-kpi span{font-size:14px;color:var(--c5)}

/* 分类频道 */
.hfsgknig-tags{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.hfsgknig-tags li{background:var(--c4);border:1px solid var(--c6);border-radius:var(--rd);padding:22px 24px}
.hfsgknig-tags b{display:block;font-size:17px;font-family:"Songti SC",serif;margin-bottom:8px}
.hfsgknig-tags p{font-size:14px;color:var(--c5)}

/* 卡片网格 */
.hfsgknig-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.hfsgknig-card{background:var(--c4);border:1px solid var(--c6);border-radius:var(--rd);overflow:hidden;box-shadow:var(--sd);transition:transform .2s,box-shadow .2s}
.hfsgknig-card:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(36,31,26,.12)}
.hfsgknig-cover{position:relative;aspect-ratio:3/4;overflow:hidden;background:#e9dfd0}
.hfsgknig-cover img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.hfsgknig-card:hover .hfsgknig-cover img{transform:scale(1.05)}
.hfsgknig-badge{position:absolute;top:10px;left:10px;background:rgba(36,31,26,.78);color:#fff;font-size:12px;padding:3px 9px;border-radius:8px}
.hfsgknig-score{position:absolute;top:10px;right:10px;background:rgba(180,84,31,.92);color:#fff;font-size:12px;font-weight:700;padding:3px 8px;border-radius:8px}
.hfsgknig-card-b{padding:14px 16px 18px}
.hfsgknig-card-b h3{font-size:16px;margin-bottom:6px}
.hfsgknig-card-b p{font-size:13px;color:var(--c5)}

/* 双栏对照 */
.hfsgknig-duo{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.hfsgknig-duo-col{background:var(--c4);border:1px solid var(--c6);border-radius:var(--rd);padding:26px;box-shadow:var(--sd)}
.hfsgknig-duo-col h3{font-size:18px;margin-bottom:6px}
.hfsgknig-duo-col>p{font-size:14px;color:var(--c5);margin-bottom:14px}
.hfsgknig-duo-col li{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px dashed var(--c6);font-size:15px}
.hfsgknig-duo-col li span{color:var(--c5);font-size:13px;white-space:nowrap}

/* 排行榜 */
.hfsgknig-rank{display:grid;grid-template-columns:1fr 1fr;gap:0 44px}
.hfsgknig-rank li{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px dashed var(--c6)}
.hfsgknig-rank i{font-style:normal;width:26px;height:26px;flex:0 0 26px;border-radius:8px;background:#f1e7d8;color:var(--c5);font-size:13px;display:grid;place-items:center;font-weight:700}
.hfsgknig-rank li:nth-child(-n+3) i{background:var(--c2);color:#fff}
.hfsgknig-rank b{font-size:16px;font-family:"Songti SC",serif}
.hfsgknig-rank .hfsgknig-au{font-size:13px;color:var(--c5);margin-left:auto}
.hfsgknig-rank em{font-style:normal;font-size:12px;color:var(--c5);border:1px solid var(--c6);border-radius:6px;padding:1px 8px;white-space:nowrap}

/* 时间线 */
.hfsgknig-line{position:relative;padding-left:28px}
.hfsgknig-line::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:2px;background:var(--c6)}
.hfsgknig-line li{position:relative;padding-bottom:26px}
.hfsgknig-line li:last-child{padding-bottom:0}
.hfsgknig-line li::before{content:"";position:absolute;left:-28px;top:9px;width:10px;height:10px;border-radius:50%;background:var(--c2);box-shadow:0 0 0 4px rgba(180,84,31,.14)}
.hfsgknig-line time{display:block;font-size:13px;color:var(--c2);font-weight:600;margin-bottom:2px}
.hfsgknig-line p{font-size:15px;color:var(--c5)}

/* 资讯 */
.hfsgknig-news{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.hfsgknig-news li{display:grid;grid-template-columns:150px 1fr;background:var(--c4);border:1px solid var(--c6);border-radius:var(--rd);overflow:hidden;box-shadow:var(--sd)}
.hfsgknig-nthumb{overflow:hidden;background:#e9dfd0;min-height:130px}
.hfsgknig-nthumb img{width:100%;height:100%;object-fit:cover}
.hfsgknig-nbody{padding:18px 20px}
.hfsgknig-nbody h3{font-size:16px;margin-bottom:8px}
.hfsgknig-nbody p{font-size:13px;color:var(--c5)}

/* 书单专题 */
.hfsgknig-topics{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.hfsgknig-topic{background:linear-gradient(160deg,#fffdfa,#f7efe2);border:1px solid var(--c6);border-radius:18px;padding:26px;box-shadow:var(--sd)}
.hfsgknig-topic h3{font-size:18px;margin-bottom:10px}
.hfsgknig-topic p{font-size:14px;color:var(--c5)}
.hfsgknig-topic small{display:inline-block;margin-top:16px;font-size:12px;color:var(--c2);border:1px solid rgba(180,84,31,.3);border-radius:8px;padding:2px 10px}

/* 阅读保障 */
.hfsgknig-safe{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.hfsgknig-safe li{background:var(--c4);border:1px solid var(--c6);border-radius:var(--rd);padding:24px 22px;box-shadow:var(--sd)}
.hfsgknig-safe h3{font-size:16px;margin-bottom:8px;display:flex;align-items:center;gap:8px}
.hfsgknig-safe h3::before{content:"";width:8px;height:8px;flex:0 0 8px;border-radius:3px;background:var(--c2)}
.hfsgknig-safe p{font-size:14px;color:var(--c5)}

/* 快速解答 */
.hfsgknig-faq{max-width:900px}
.hfsgknig-faq details{background:var(--c4);border:1px solid var(--c6);border-radius:14px;padding:0 22px;margin-bottom:12px;box-shadow:var(--sd)}
.hfsgknig-faq summary{cursor:pointer;padding:18px 0;font-size:16px;font-weight:600;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:44px}
.hfsgknig-faq summary::-webkit-details-marker{display:none}
.hfsgknig-faq summary::after{content:"+";font-size:20px;color:var(--c2);line-height:1}
.hfsgknig-faq details[open] summary::after{content:"–"}
.hfsgknig-faq details p{padding:0 0 20px;font-size:15px;color:var(--c5)}

/* 页脚 */
.hfsgknig-foot{background:var(--c7);color:#ded6c8;padding-top:56px}
.hfsgknig-foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px;padding-bottom:40px}
.hfsgknig-foot h3{font-size:15px;color:#fff;margin-bottom:16px;letter-spacing:.04em}
.hfsgknig-foot p{font-size:14px;line-height:1.9;color:#b8b0a3}
.hfsgknig-foot li{margin-bottom:10px}
.hfsgknig-foot ul a{font-size:14px;color:#b8b0a3;transition:color .2s}
.hfsgknig-foot ul a:hover{color:#fff}
.hfsgknig-copy{border-top:1px solid rgba(255,255,255,.12);padding:20px 0;font-size:13px;color:#9c958a;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* 响应式 */
@media (max-width:1024px){
  .hfsgknig-nav a{padding:0 9px;font-size:14px}
  .hfsgknig-grid{grid-template-columns:repeat(3,1fr)}
  .hfsgknig-kpi{grid-template-columns:repeat(2,1fr)}
  .hfsgknig-tags{grid-template-columns:repeat(2,1fr)}
  .hfsgknig-safe{grid-template-columns:repeat(2,1fr)}
  .hfsgknig-rank{grid-template-columns:1fr;gap:0}
}
@media (max-width:768px){
  html{scroll-padding-top:140px}
  .hfsgknig-head-in{flex-wrap:wrap;height:auto;padding:12px 0 10px;gap:10px}
  .hfsgknig-brand{font-size:16px}
  .hfsgknig-nav{margin-left:0;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .hfsgknig-nav ul{display:flex;gap:6px;flex-wrap:nowrap}
  .hfsgknig-nav a{line-height:44px;white-space:nowrap;padding:0 12px;background:#f4ecdf}
  .hfsgknig-hero{padding:44px 0 52px}
  .hfsgknig-swap{grid-template-columns:1fr;margin-top:32px}
  .hfsgknig-sec{padding:48px 0}
  .hfsgknig-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .hfsgknig-news{grid-template-columns:1fr}
  .hfsgknig-topics{grid-template-columns:1fr}
  .hfsgknig-duo{grid-template-columns:1fr}
  .hfsgknig-foot-grid{grid-template-columns:1fr 1fr;gap:28px}
}
@media (max-width:520px){
  .hfsgknig-hero h1{font-size:32px}
  .hfsgknig-lead{font-size:15px}
  .hfsgknig-btn{width:100%}
  .hfsgknig-kpi{grid-template-columns:1fr 1fr;gap:14px}
  .hfsgknig-tags{grid-template-columns:1fr}
  .hfsgknig-safe{grid-template-columns:1fr}
  .hfsgknig-grid{gap:14px}
  .hfsgknig-card-b{padding:12px 12px 16px}
  .hfsgknig-card-b h3{font-size:15px}
  .hfsgknig-news li{grid-template-columns:112px 1fr}
  .hfsgknig-nbody{padding:14px 16px}
  .hfsgknig-foot-grid{grid-template-columns:1fr}
}