/* roulang page: index */
:root{
  --sun1:#ff6b3d;
  --sun2:#241540;
  --sun3:#7b5cff;
  --paper:#fdfaf6;
  --card:#ffffff;
  --ink:#201a33;
  --ink2:#6f6884;
  --line:#ece6f3;
  --r1:10px;
  --r2:18px;
  --r3:28px;
  --sh1:0 6px 18px rgba(32,26,51,.07);
  --sh2:0 18px 42px rgba(32,26,51,.13);
  --gap:24px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p{margin:0}
input,button{font:inherit}
:focus-visible{outline:3px solid var(--sun3);outline-offset:3px;border-radius:8px}
.nplcdgex-container{width:min(1180px,calc(100% - 40px));margin:0 auto}

/* 顶栏 */
.nplcdgex-head{
  position:sticky;top:0;z-index:60;
  background:rgba(253,250,246,.94);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.nplcdgex-head-in{display:flex;align-items:center;gap:16px;min-height:70px}
.nplcdgex-logo{display:inline-flex;align-items:center;gap:10px;font-size:19px;font-weight:800;letter-spacing:.5px;flex:0 0 auto}
.nplcdgex-logo i{
  width:36px;height:36px;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--sun1),var(--sun3));
  color:#fff;font-style:normal;font-size:15px;font-weight:800;
}
.nplcdgex-nav{
  margin-left:auto;display:flex;gap:2px;min-width:0;
  overflow-x:auto;scrollbar-width:none;
}
.nplcdgex-nav::-webkit-scrollbar{display:none}
.nplcdgex-nav a{
  display:inline-flex;align-items:center;min-height:44px;padding:0 14px;
  border-radius:999px;font-size:15px;color:var(--ink2);white-space:nowrap;
  transition:color .2s,background .2s;
}
.nplcdgex-nav a:hover{color:var(--sun2);background:#f3edfb}

/* 首屏 */
.nplcdgex-hero{
  padding:36px 0 8px;
  background:
    radial-gradient(120% 100% at 0% 0%,#f6ecff 0%,rgba(246,236,255,0) 58%),
    radial-gradient(90% 90% at 100% 0%,#fff1e7 0%,rgba(255,241,231,0) 55%);
}
.nplcdgex-bento{
  display:grid;gap:18px;
  grid-template-columns:1.65fr 1fr;
  grid-template-areas:"main a" "main b" "bar bar";
}
.nplcdgex-bento-main{
  grid-area:main;position:relative;overflow:hidden;
  border-radius:var(--r3);padding:44px 40px;
  background:linear-gradient(155deg,#221340 0%,#3a2358 58%,#4c2d72 100%);
  color:#fff;
}
.nplcdgex-eyebrow{
  display:inline-block;font-size:13px;letter-spacing:1px;
  padding:6px 12px;border-radius:999px;color:#ffd6a8;
  background:rgba(255,255,255,.12);
}
.nplcdgex-bento-main h1{
  font-size:clamp(27px,3.6vw,42px);line-height:1.28;
  font-weight:800;letter-spacing:1px;margin:18px 0 16px;
}
.nplcdgex-bento-main h1 em{font-style:normal;color:#ffb267}
.nplcdgex-lead{font-size:15px;line-height:1.9;color:#ddd5ee;max-width:44em}
.nplcdgex-hero-act{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

.nplcdgex-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:46px;padding:0 26px;border-radius:999px;
  font-size:15px;font-weight:700;border:1px solid transparent;cursor:pointer;
  transition:transform .2s,box-shadow .2s,background .2s,border-color .2s;
}
.nplcdgex-btn-major{
  background:linear-gradient(135deg,var(--sun1),#ff9052);color:#fff;
  box-shadow:0 10px 24px rgba(255,107,61,.32);
}
.nplcdgex-btn-major:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(255,107,61,.42)}
.nplcdgex-btn-line{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.nplcdgex-btn-line:hover{background:rgba(255,255,255,.14)}

.nplcdgex-bento-a{
  grid-area:a;position:relative;overflow:hidden;
  border-radius:var(--r3);min-height:196px;background:var(--sun2);
}
.nplcdgex-bento-a img{width:100%;height:100%;object-fit:cover;opacity:.62}
.nplcdgex-bento-a div{
  position:absolute;left:0;right:0;bottom:0;padding:18px 20px;color:#fff;
  background:linear-gradient(rgba(20,12,36,0),rgba(20,12,36,.9) 62%);
}
.nplcdgex-bento-a strong{display:block;font-size:15px;margin-bottom:4px}
.nplcdgex-bento-a span{font-size:13px;color:#d6cdea;line-height:1.6}
.nplcdgex-bento-b{
  grid-area:b;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r3);padding:22px 24px;box-shadow:var(--sh1);
}
.nplcdgex-bento-b>strong{display:block;font-size:15px;margin-bottom:12px}
.nplcdgex-bento-b li{
  display:flex;gap:10px;align-items:baseline;
  font-size:13px;color:var(--ink2);padding:6px 0;
}
.nplcdgex-bento-b li span{
  flex:0 0 auto;font-size:12px;font-weight:700;color:var(--sun2);
  background:#f3edfb;border-radius:6px;padding:2px 8px;
}
.nplcdgex-bar{
  grid-area:bar;display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r2);padding:16px 24px;box-shadow:var(--sh1);
}
.nplcdgex-bar p{font-size:14px;color:var(--ink2)}
.nplcdgex-tlink{
  font-size:14px;font-weight:700;color:var(--sun1);
  display:inline-flex;align-items:center;min-height:44px;
  transition:transform .2s;
}
.nplcdgex-tlink:hover{transform:translateX(4px)}

/* 板块通用 */
.nplcdgex-sec{padding:64px 0}
.nplcdgex-sec-soft{background:#f8f3fc}
.nplcdgex-shead{margin-bottom:30px;max-width:720px}
.nplcdgex-shead h2{
  font-size:clamp(21px,2.5vw,29px);font-weight:800;letter-spacing:.6px;
  position:relative;padding-left:16px;
}
.nplcdgex-shead h2::before{
  content:"";position:absolute;left:0;top:.28em;bottom:.28em;width:5px;
  border-radius:4px;background:linear-gradient(180deg,var(--sun1),var(--sun3));
}
.nplcdgex-shead p{margin-top:12px;font-size:15px;color:var(--ink2)}

/* 分类频道 */
.nplcdgex-cats{display:grid;gap:18px;grid-template-columns:repeat(3,1fr)}
.nplcdgex-cats li{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r2);
  padding:22px 24px;box-shadow:var(--sh1);transition:transform .22s,box-shadow .22s;
}
.nplcdgex-cats li:hover{transform:translateY(-4px);box-shadow:var(--sh2)}
.nplcdgex-cats b{display:block;font-size:16px;margin-bottom:8px;color:var(--sun2)}
.nplcdgex-cats span{font-size:14px;color:var(--ink2)}

/* 卡片网格 */
.nplcdgex-cards{display:grid;gap:20px;grid-template-columns:repeat(6,1fr)}
.nplcdgex-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r2);
  overflow:hidden;box-shadow:var(--sh1);
  transition:transform .22s,box-shadow .22s;
}
.nplcdgex-card:hover{transform:translateY(-5px);box-shadow:var(--sh2)}
.nplcdgex-cover{position:relative;aspect-ratio:3/4;overflow:hidden;background:#efe8f6}
.nplcdgex-cover img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.nplcdgex-card:hover .nplcdgex-cover img{transform:scale(1.05)}
.nplcdgex-badge{
  position:absolute;top:10px;left:10px;
  font-size:12px;line-height:1;padding:6px 9px;border-radius:8px;
  background:rgba(36,21,64,.85);color:#fff;letter-spacing:.5px;
}
.nplcdgex-card h3{font-size:15px;font-weight:700;padding:12px 12px 2px}
.nplcdgex-card p{font-size:13px;color:var(--ink2);padding:2px 12px 14px;line-height:1.65}

/* 榜单 */
.nplcdgex-top{display:grid;gap:12px 24px;grid-template-columns:repeat(2,1fr)}
.nplcdgex-top li{
  display:flex;align-items:center;gap:14px;
  background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:12px 18px;box-shadow:var(--sh1);transition:border-color .2s,transform .2s;
}
.nplcdgex-top li:hover{border-color:#d9c9f2;transform:translateX(3px)}
.nplcdgex-no{
  flex:0 0 30px;text-align:center;font-size:15px;font-weight:800;
  color:#b9aed0;
}
.nplcdgex-top li:nth-child(-n+3) .nplcdgex-no{color:var(--sun1)}
.nplcdgex-top strong{font-size:15px;flex:1 1 auto}
.nplcdgex-top em{
  font-style:normal;font-size:12px;color:var(--sun3);
  background:#f1ebfc;border-radius:6px;padding:3px 9px;white-space:nowrap;
}

/* 主题专题 */
.nplcdgex-specials{display:grid;gap:20px;grid-template-columns:repeat(3,1fr)}
.nplcdgex-special{
  position:relative;overflow:hidden;border-radius:var(--r3);
  min-height:236px;display:flex;align-items:flex-end;
  padding:22px;color:#fff;background:var(--sun2);
}
.nplcdgex-special img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;opacity:.55;
}
.nplcdgex-special div{position:relative;z-index:1}
.nplcdgex-special strong{display:block;font-size:17px;margin-bottom:8px}
.nplcdgex-special p{font-size:13px;line-height:1.7;color:#e6dff5}

/* 资讯 */
.nplcdgex-news{display:grid;gap:18px;grid-template-columns:repeat(2,1fr)}
.nplcdgex-news article{
  display:flex;gap:16px;align-items:center;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r2);
  padding:14px;box-shadow:var(--sh1);transition:box-shadow .22s,transform .22s;
}
.nplcdgex-news article:hover{box-shadow:var(--sh2);transform:translateY(-3px)}
.nplcdgex-thumb{
  flex:0 0 132px;width:132px;aspect-ratio:16/10;
  border-radius:12px;overflow:hidden;background:#efe8f6;
}
.nplcdgex-thumb img{width:100%;height:100%;object-fit:cover}
.nplcdgex-news h3{font-size:15px;line-height:1.55;margin-bottom:6px}
.nplcdgex-news time{font-size:13px;color:var(--sun1);font-weight:700}

/* 问答 */
.nplcdgex-qa{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}
.nplcdgex-qa article{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r2);
  padding:22px 24px;box-shadow:var(--sh1);
}
.nplcdgex-qa h3{font-size:15px;font-weight:700;margin-bottom:10px;color:var(--sun2)}
.nplcdgex-qa p{font-size:14px;color:var(--ink2)}

/* 收口 */
.nplcdgex-end{
  margin:8px 0 0;padding:52px 40px;border-radius:var(--r3);text-align:center;
  background:linear-gradient(140deg,#221340,#4c2d72);color:#fff;
}
.nplcdgex-end h2{font-size:clamp(21px,2.6vw,28px);font-weight:800;letter-spacing:.6px}
.nplcdgex-end p{margin:14px auto 26px;max-width:36em;font-size:15px;color:#d8cfec}

/* 页脚 */
.nplcdgex-foot{background:#1a1029;color:#c6bdd9;padding:56px 0 24px;margin-top:70px}
.nplcdgex-foot-grid{display:grid;gap:32px;grid-template-columns:1.7fr 1fr 1fr 1fr}
.nplcdgex-foot h4{color:#fff;font-size:15px;margin-bottom:14px;font-weight:700}
.nplcdgex-foot p{font-size:14px;line-height:1.85;color:#a79dbe}
.nplcdgex-foot li a,.nplcdgex-foot li span{font-size:14px;line-height:2.2;color:#c6bdd9;transition:color .2s}
.nplcdgex-foot li a:hover{color:#ffb267}
.nplcdgex-copy{
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  border-top:1px solid rgba(255,255,255,.1);
  margin-top:34px;padding-top:20px;font-size:13px;color:#8b81a4;
}

/* 断点 */
@media (max-width:1024px){
  .nplcdgex-bento{grid-template-columns:1fr 1fr;grid-template-areas:"main main" "a b" "bar bar"}
  .nplcdgex-cats{grid-template-columns:repeat(2,1fr)}
  .nplcdgex-cards{grid-template-columns:repeat(3,1fr)}
  .nplcdgex-specials{grid-template-columns:repeat(2,1fr)}
  .nplcdgex-foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  .nplcdgex-container{width:calc(100% - 32px)}
  .nplcdgex-sec{padding:48px 0}
  .nplcdgex-bento{grid-template-columns:1fr;grid-template-areas:"main" "a" "b" "bar"}
  .nplcdgex-bento-main{padding:32px 24px}
  .nplcdgex-top{grid-template-columns:1fr}
  .nplcdgex-news{grid-template-columns:1fr}
  .nplcdgex-qa{grid-template-columns:1fr}
  .nplcdgex-specials{grid-template-columns:1fr}
  .nplcdgex-end{padding:40px 22px}
  .nplcdgex-foot{margin-top:52px}
}
@media (max-width:520px){
  .nplcdgex-head-in{min-height:62px;gap:10px}
  .nplcdgex-logo{font-size:17px}
  .nplcdgex-logo i{width:32px;height:32px;border-radius:10px;font-size:14px}
  .nplcdgex-nav a{padding:0 11px;font-size:14px}
  .nplcdgex-cats{grid-template-columns:1fr}
  .nplcdgex-cards{grid-template-columns:repeat(2,1fr);gap:14px}
  .nplcdgex-thumb{flex:0 0 96px;width:96px}
  .nplcdgex-news h3{font-size:14px}
  .nplcdgex-foot-grid{grid-template-columns:1fr}
}