/* roulang page: index */
*,*::before,*::after{box-sizing:border-box}
:root{
  --c1:#e8b563;
  --c2:#6fd3e0;
  --bg:#0b0d12;
  --sf:#141821;
  --sf2:#1b202b;
  --ink:#f2f4f8;
  --mut:#98a1b2;
  --line:rgba(255,255,255,.09);
  --rad:16px;
  --sh:0 20px 44px rgba(0,0,0,.45);
  --gap:26px;
}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font:400 16px/1.75 "PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,p,figure,blockquote{margin:0}
a:focus-visible,button:focus-visible{outline:2px solid var(--c1);outline-offset:3px}
.ckcblp-wrap{width:min(1160px,100% - 40px);margin-inline:auto}

/* 顶栏 */
.ckcblp-top{position:sticky;top:0;z-index:30;background:rgba(11,13,18,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.ckcblp-topin{display:flex;align-items:center;gap:24px;min-height:68px;flex-wrap:wrap}
.ckcblp-logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px;letter-spacing:.6px;white-space:nowrap;min-height:44px}
.ckcblp-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(140deg,var(--c1),#c4882c);color:#191308;font-size:17px;font-weight:800}
.ckcblp-menu{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
.ckcblp-menu a{display:inline-flex;align-items:center;min-height:44px;padding:0 15px;border-radius:999px;font-size:15px;color:var(--mut);transition:color .2s,background .2s}
.ckcblp-menu a:hover{color:var(--ink);background:rgba(255,255,255,.07)}

/* 首屏 */
.ckcblp-hero{position:relative;overflow:hidden;padding:76px 0 68px;border-bottom:1px solid var(--line)}
.ckcblp-heroimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.4}
.ckcblp-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,13,18,.5) 0%,rgba(11,13,18,.86) 62%,var(--bg) 100%)}
.ckcblp-heroin{position:relative;z-index:2;max-width:780px}
.ckcblp-kicker{display:inline-flex;align-items:center;gap:8px;padding:6px 15px;border-radius:999px;border:1px solid rgba(232,181,99,.42);background:rgba(232,181,99,.08);color:var(--c1);font-size:13.5px;letter-spacing:.8px;margin-bottom:22px}
.ckcblp-h1{font-size:clamp(30px,5vw,52px);line-height:1.18;letter-spacing:-.6px;font-weight:800;text-shadow:0 6px 26px rgba(0,0,0,.55)}
.ckcblp-h1 em{font-style:normal;color:var(--c1)}
.ckcblp-lead{margin-top:20px;color:#c4ccd9;font-size:16.5px;max-width:660px}
.ckcblp-herobtns{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.ckcblp-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 28px;border-radius:999px;background:linear-gradient(135deg,var(--c1),#cf9130);color:#191308;font-weight:700;font-size:15.5px;transition:transform .2s,box-shadow .2s}
.ckcblp-btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(232,181,99,.26)}
.ckcblp-btn2{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 26px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);color:var(--ink);font-size:15.5px;transition:background .2s}
.ckcblp-btn2:hover{background:rgba(255,255,255,.12)}
.ckcblp-heropoints{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.ckcblp-heropoints li{padding:7px 16px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);font-size:14px;color:#b8c1d0}

/* 板块骨架 */
.ckcblp-sec{padding:66px 0;border-bottom:1px solid var(--line)}
.ckcblp-sec--tint{background:linear-gradient(180deg,#0e1118,#0b0d12)}
.ckcblp-eyebrow{color:var(--c1);font-size:12.5px;letter-spacing:2.4px;margin-bottom:10px}
.ckcblp-h2{font-size:clamp(22px,3.2vw,30px);font-weight:800;letter-spacing:-.3px}
.ckcblp-desc{color:var(--mut);margin-top:12px;max-width:840px;font-size:15.5px}

/* 卡片网格 */
.ckcblp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:var(--gap);margin-top:34px}
.ckcblp-card{background:var(--sf);border:1px solid var(--line);border-radius:var(--rad);overflow:hidden;transition:transform .25s,border-color .25s,box-shadow .25s}
.ckcblp-card:hover{transform:translateY(-4px);border-color:rgba(232,181,99,.42);box-shadow:var(--sh)}
.ckcblp-thumb{position:relative;aspect-ratio:2/3;overflow:hidden;background:#0a0c11}
.ckcblp-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .45s}
.ckcblp-card:hover .ckcblp-thumb img{transform:scale(1.06)}
.ckcblp-badge{position:absolute;top:10px;left:10px;padding:3px 9px;border-radius:6px;background:rgba(11,13,18,.8);color:var(--c1);font-size:12px;font-weight:600}
.ckcblp-score{position:absolute;right:10px;bottom:10px;padding:3px 9px;border-radius:6px;background:rgba(11,13,18,.8);color:#ffd27a;font-size:12.5px;font-weight:700}
.ckcblp-card h3{font-size:15.5px;font-weight:600;padding:14px 15px 3px;line-height:1.4}
.ckcblp-meta{font-size:13px;color:var(--mut);padding:0 15px 16px}

/* 即将上架 */
.ckcblp-soon{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:32px}
.ckcblp-soon li{padding:22px 20px;border-radius:14px;border:1px dashed rgba(232,181,99,.3);background:linear-gradient(160deg,rgba(232,181,99,.08),rgba(232,181,99,0) 70%)}
.ckcblp-soon strong{display:block;font-size:16.5px;font-weight:600;margin-bottom:6px}
.ckcblp-soon em{font-style:normal;font-size:12.5px;color:var(--c1);letter-spacing:.6px}
.ckcblp-soon p{margin-top:10px;font-size:14px;color:var(--mut)}

/* 要点列表 */
.ckcblp-facts{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:32px}
.ckcblp-facts li{padding:20px 22px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.028);font-size:14.5px;color:#bcc5d4}
.ckcblp-facts strong{display:block;font-size:16px;color:var(--ink);margin-bottom:6px;font-weight:600}

/* 三步 */
.ckcblp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px;counter-reset:st}
.ckcblp-steps li{padding:28px 24px;border-radius:var(--rad);border:1px solid var(--line);background:linear-gradient(160deg,#171c26,#11151d)}
.ckcblp-steps li::before{counter-increment:st;content:"0" counter(st);display:block;font-size:24px;font-weight:800;color:var(--c1);letter-spacing:1px;margin-bottom:10px}
.ckcblp-steps h3{font-size:17px;font-weight:700;margin-bottom:8px}
.ckcblp-steps p{font-size:14.5px;color:var(--mut)}

/* 榜单 */
.ckcblp-rank{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 26px;margin-top:32px}
.ckcblp-rank li{display:flex;align-items:center;gap:14px;min-height:56px;padding:10px 16px;border-radius:12px;background:var(--sf);border:1px solid var(--line);transition:background .2s}
.ckcblp-rank li:hover{background:var(--sf2)}
.ckcblp-no{flex:none;width:28px;text-align:center;font-weight:800;font-size:15px;color:var(--mut)}
.ckcblp-rank li:nth-child(-n+3) .ckcblp-no{color:var(--c1)}
.ckcblp-rank h3{flex:1;font-size:15.5px;font-weight:600}
.ckcblp-pill{padding:3px 10px;border-radius:999px;font-size:12.5px;color:var(--mut);border:1px solid var(--line);white-space:nowrap}
.ckcblp-num{font-size:13.5px;font-weight:700;color:#ffd27a;min-width:34px;text-align:right}

/* 分类标签 */
.ckcblp-chips{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.ckcblp-chips li{padding:11px 22px;border-radius:12px;background:var(--sf);border:1px solid var(--line);font-size:15px;color:#d3dae6}

/* 资讯 */
.ckcblp-news{margin-top:28px}
.ckcblp-news li{display:flex;align-items:baseline;gap:16px;padding:18px 2px;border-bottom:1px dashed var(--line)}
.ckcblp-news h3{flex:1;font-size:16px;font-weight:500;line-height:1.6}
.ckcblp-news span{flex:none;font-size:13px;color:var(--c1);letter-spacing:.5px}

/* 口碑 */
.ckcblp-quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:32px}
.ckcblp-quote{padding:26px 24px;border-radius:var(--rad);background:var(--sf);border:1px solid var(--line)}
.ckcblp-quote p{font-size:15px;color:#c8d0dd}
.ckcblp-who{display:block;margin-top:16px;font-size:13.5px;color:var(--c1);letter-spacing:.5px}

/* 收口 */
.ckcblp-cta{padding:76px 0;text-align:center;background:radial-gradient(circle at 50% 0%,rgba(232,181,99,.15),transparent 62%)}
.ckcblp-cta p{max-width:660px;margin:14px auto 28px;color:var(--mut);font-size:15.5px}

/* 页脚 */
.ckcblp-foot{background:#080a0e;border-top:1px solid var(--line);padding:56px 0 24px}
.ckcblp-fcols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px}
.ckcblp-fcols h3{font-size:15px;font-weight:700;margin-bottom:14px}
.ckcblp-fcols li{font-size:14px;color:var(--mut);margin-bottom:9px;line-height:1.6}
.ckcblp-fbrand{font-size:17px;font-weight:700;margin-bottom:10px;letter-spacing:.5px}
.ckcblp-fcols p{font-size:14px;color:var(--mut);max-width:280px}
.ckcblp-copy{margin-top:38px;padding-top:20px;border-top:1px solid var(--line);font-size:13px;color:#6d7585;text-align:center}

@media (max-width:1024px){
  .ckcblp-menu{margin-left:0;order:3;width:100%;flex-wrap:nowrap;overflow-x:auto;padding:2px 0 4px}
  .ckcblp-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px}
  .ckcblp-rank{grid-template-columns:1fr}
  .ckcblp-steps{grid-template-columns:1fr}
  .ckcblp-quotes{grid-template-columns:repeat(2,1fr)}
  .ckcblp-soon{grid-template-columns:repeat(2,1fr)}
  .ckcblp-fcols{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  .ckcblp-hero{padding:56px 0 48px}
  .ckcblp-sec{padding:48px 0}
  .ckcblp-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .ckcblp-facts{grid-template-columns:1fr}
  .ckcblp-quotes{grid-template-columns:1fr}
  .ckcblp-news h3{font-size:15px}
  .ckcblp-lead{font-size:15.5px}
  .ckcblp-cta{padding:56px 0}
}
@media (max-width:520px){
  .ckcblp-wrap{width:min(1160px,100% - 28px)}
  .ckcblp-topin{min-height:56px;gap:12px}
  .ckcblp-logo{font-size:17px}
  .ckcblp-menu a{padding:0 11px;font-size:14px}
  .ckcblp-soon{grid-template-columns:1fr}
  .ckcblp-fcols{grid-template-columns:1fr}
  .ckcblp-herobtns{gap:10px}
  .ckcblp-btn,.ckcblp-btn2{flex:1 1 auto;padding:0 18px;font-size:14.5px}
  .ckcblp-card h3{font-size:14.5px}
  .ckcblp-news li{flex-direction:column;gap:6px}
}
