/* ============================================================
   Wanjuan PC home redesign  (scoped under .wj-home, home only)
   ============================================================ */
.wj-home{background:#eef2f8 !important;background-image:none !important;}
.wj-home .translucent-overlay-new{background:transparent;}
.wj-home .index-content{margin-top:84px;}

/* ---------- top navigation (home scope) ---------- */
.wj-home .page-header{background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(160%) blur(10px);backdrop-filter:saturate(160%) blur(10px);box-shadow:0 1px 0 rgba(43,92,230,.06),0 8px 22px rgba(31,39,51,.07);border-bottom:1px solid #edf1f8;}
.wj-home .header-box{height:66px;}
.wj-home .page-header_nav{margin-left:34px;}
.wj-home .page-header_nav li{margin-right:26px;}
.wj-home .page-header_nav li a{font-size:17px;color:#333d4d;font-weight:500;position:relative;padding:4px 1px;-webkit-tap-highlight-color:rgba(43,92,230,.14);transition:color .18s;}
.wj-home .page-header_nav li a::after{content:"";position:absolute;left:50%;bottom:-6px;width:0;height:3px;border-radius:3px;background:linear-gradient(90deg,#3f6fe8,#1e3fa6);transform:translateX(-50%);transition:width .22s;}
.wj-home .page-header_nav li a:hover,.wj-home .page-header_nav li a.active{color:#2b5ce6;}
.wj-home .page-header_nav li a:hover::after,.wj-home .page-header_nav li a.active::after{width:100%;}
.wj-home .page-header_search{width:420px;height:40px;border:none;background:#f1f4fa;border-radius:999px;overflow:hidden;transition:box-shadow .2s,background .2s;margin-left:42px;}
.wj-home .page-header_search:focus-within{background:#fff;box-shadow:0 0 0 2px rgba(43,92,230,.22);}
.wj-home .page-header_search .search-input input{height:40px;background:transparent;font-size:14px;}
.wj-home .page-header_search .search-button{width:76px;height:34px;margin:3px 3px 3px 0;border-radius:999px;background:linear-gradient(135deg,#3f6fe8,#2b5ce6);font-size:14px;letter-spacing:2px;box-shadow:0 4px 12px rgba(43,92,230,.28);}
.wj-home .page-header_fast .fast-item a{color:#7a8394;transition:color .18s;}
.wj-home .page-header_fast .fast-item a:hover{color:#2b5ce6;}

/* ---------- category capsule strip ---------- */
.wj-home .index-categray-box{height:auto;line-height:1;background:#fff;border-radius:14px;padding:14px 18px 4px;margin:-6px 0 4px;box-shadow:0 4px 18px rgba(31,39,51,.05);}
.wj-home .index-categray-box li{margin:0 10px 10px 0;}
.wj-home .index-categray-box li a{display:inline-block;font-size:14px;color:#5a6372;background:#f3f5fa;border-radius:999px;padding:8px 16px;transition:all .16s;}
.wj-home .index-categray-box li a:hover{color:#fff;background:linear-gradient(135deg,#3f6fe8,#2b5ce6);box-shadow:0 6px 14px rgba(43,92,230,.3);transform:translateY(-1px);}

/* ---------- hero / focus banner ---------- */
.wj-home .index-recommend-box{height:372px;margin-top:22px;}
.wj-home .index-recommend-box .recommend-item{border-radius:16px;box-shadow:0 12px 30px rgba(30,63,166,.16);}
.wj-home .index-recommend-box .recommend-item a{transition:filter .3s;}
.wj-home .index-recommend-box .recommend-item:hover a{filter:brightness(1.09);}
.wj-home .index-recommend-box .recommend-item .article-name{font-size:16px;font-weight:700;line-height:52px;text-indent:18px;letter-spacing:.5px;opacity:1;background-image:linear-gradient(180deg,rgba(10,16,30,0) 0%,rgba(10,16,30,.28) 46%,rgba(10,16,30,.85) 100%);}
.wj-home .recommend-item.flex-2{position:relative;}
.wj-home .recommend-item.flex-2::before{content:"HOT";position:absolute;top:16px;left:16px;z-index:5;font-size:12px;font-weight:800;letter-spacing:2px;color:#fff;padding:5px 11px;border-radius:9px;background:linear-gradient(135deg,#3f6fe8,#1e3fa6);box-shadow:0 6px 16px rgba(30,63,166,.45);}

/* ---------- section white cards ---------- */
.wj-home .class-block-box{background:#fff;border-radius:18px;padding:24px 26px;margin-top:24px;box-shadow:0 10px 30px rgba(31,39,51,.06);}
.wj-home .class-block-box.flex{background:transparent;padding:0;box-shadow:none;gap:24px;}
.wj-home .class-block-box.flex>div{background:#fff;border-radius:18px;padding:20px 22px;box-shadow:0 10px 30px rgba(31,39,51,.06);}
.wj-home .class-block-box.flex .mr30{margin-right:0;}

/* section title with indigo bar */
.wj-home .class-head{height:auto;line-height:1.2;margin-bottom:20px;position:relative;padding-left:14px;display:flex;align-items:center;}
.wj-home .class-head::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:5px;height:22px;border-radius:3px;background:linear-gradient(180deg,#3f6fe8,#1e3fa6);}
.wj-home .class-head>span{font-size:22px !important;font-weight:800;color:#1f2733;}
.wj-home .class-head .select-color{font-size:22px !important;font-weight:800;margin-left:6px;}
.wj-home .class-head .sort-name{font-size:15px;font-weight:500;color:#6b7280;margin:0 6px 0 14px;transition:color .16s;}
.wj-home .class-head .sort-name:hover{color:#2b5ce6;}
.wj-home .column-head{font-size:19px !important;font-weight:800;color:#1f2733;position:relative;padding-left:13px;margin-bottom:6px;}
.wj-home .column-head::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:18px;border-radius:3px;background:linear-gradient(180deg,#3f6fe8,#1e3fa6);}
.wj-home .class-head .more{margin-left:auto;}
.wj-home .class-head .more,.wj-home .column-head .more{display:inline-flex;align-items:center;gap:4px;color:#2b5ce6 !important;font-size:13px !important;font-weight:600;background:#eaf1ff;border:1px solid #d6e2fb;border-radius:999px;padding:5px 15px;line-height:1.4;transition:all .18s;}
.wj-home .class-head .more:hover,.wj-home .column-head .more:hover{background:linear-gradient(135deg,#3f6fe8,#2b5ce6);color:#fff !important;border-color:transparent;box-shadow:0 4px 12px rgba(43,92,230,.28);}
.wj-home .class-head .more .iconfont,.wj-home .column-head .more .iconfont{font-size:12px;transition:transform .18s;}
.wj-home .class-head .more:hover .iconfont,.wj-home .column-head .more:hover .iconfont{transform:translateX(2px);}

/* ---------- comic cover grid ---------- */
.wj-home .cartoon-block-box{gap:20px 18px;}
.wj-home .cartoon-block-box li{margin:0 !important;width:166px;}
.wj-home .cartoon-block-box li:nth-of-type(n){margin-right:0;}
.wj-home .cartoon-block-box li .cart-item .cart-cover{border-radius:12px;overflow:hidden;box-shadow:0 3px 10px rgba(31,39,51,.10);margin-bottom:10px;transition:transform .24s,box-shadow .24s;}
.wj-home .cartoon-block-box li .cart-item:hover .cart-cover{transform:translateY(-6px);box-shadow:0 16px 30px rgba(30,63,166,.20);}
.wj-home .cartoon-block-box li .cart-item .cart-cover img{transition:transform .4s;}
.wj-home .cartoon-block-box li .cart-item:hover .cart-cover img{transform:scale(1.07);}
.wj-home .cartoon-block-box li .cart-item .cart-cover .new-chapter{left:0;right:0;bottom:0;max-width:100%;border-radius:0;text-align:left;text-indent:10px;background:linear-gradient(90deg,rgba(43,92,230,.94),rgba(30,63,166,.72));font-size:11.5px;line-height:19px;padding:3px 8px;}
.wj-home .cartoon-block-box li .cart-item .cart-info p{margin-bottom:2px;}
.wj-home .cartoon-block-box li .cart-item .cart-info a{color:#1f2733;font-size:15px;transition:color .16s;}
.wj-home .cartoon-block-box li .cart-item:hover .cart-info a{color:#2b5ce6;}
.wj-home .cartoon-block-box li .cart-item .cart-info span{color:#9aa1ab;font-size:12.5px;}

/* ---------- ranking columns ---------- */
.wj-home .column-block-box li{margin-top:4px;padding:7px 8px;border-radius:10px;transition:background .16s,transform .16s;}
.wj-home .column-block-box li:hover{background:#f2f6ff;transform:translateX(3px);}
.wj-home .column-block-box .normal.normal-num{background:#eef1f7;color:#9aa1ab;font-weight:700;border-radius:8px;}
.wj-home .column-block-box li:nth-of-type(1) .normal-num{background:linear-gradient(135deg,#3f6fe8,#1e3fa6) !important;box-shadow:0 4px 10px rgba(30,63,166,.3);}
.wj-home .column-block-box li:nth-of-type(2) .normal-num{background:linear-gradient(135deg,#5b86ee,#3f6fe8) !important;}
.wj-home .column-block-box li:nth-of-type(3) .normal-num{background:linear-gradient(135deg,#86a6f4,#6b8ff0) !important;}
.wj-home .column-block-box .normal.cartoon-name a{color:#2b3240;transition:color .16s;}
.wj-home .column-block-box li:hover .normal.cartoon-name a{color:#2b5ce6;}
.wj-home .hover-cart .cover-box img{border-radius:8px;box-shadow:0 4px 12px rgba(31,39,51,.12);}

/* ---------- friend links ---------- */
.wj-home .my-links{background:transparent;padding:0;margin-top:26px;}
.wj-home .my-links .container{background:#fff;border-radius:18px 18px 0 0;padding:22px 26px 14px;}
.wj-home .my-links h2{font-size:18px;font-weight:800;color:#1f2733;position:relative;padding-left:13px;margin-bottom:12px;height:auto;line-height:1.4;}
.wj-home .my-links h2::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:17px;border-radius:3px;background:linear-gradient(180deg,#3f6fe8,#1e3fa6);}
.wj-home .my-links ul li a{color:#94a0b4;font-size:13px;transition:color .16s;}
.wj-home .my-links ul li a:hover{color:#2b5ce6;}

/* ============ A-plan: hero (category rail + dynamic featured) ============ */
.home-h1{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);margin:-1px;padding:0;border:0;}
.wj-home .wj-hero{display:flex;gap:20px;margin-top:6px;}
.wj-home .wj-cates{width:208px;flex-shrink:0;background:#fff;border-radius:18px;padding:15px 12px;box-shadow:0 10px 30px rgba(31,39,51,.06);}
.wj-home .wj-cates-tit{font-size:15px;font-weight:800;color:#1f2733;padding:0 6px 10px;margin-bottom:6px;border-bottom:1px solid #eef1f7;position:relative;padding-left:14px;}
.wj-home .wj-cates-tit::before{content:"";position:absolute;left:2px;top:1px;width:4px;height:16px;border-radius:3px;background:linear-gradient(180deg,#3f6fe8,#1e3fa6);}
.wj-home .wj-cates ul{display:flex;flex-direction:column;}
.wj-home .wj-cates ul li a{display:block;padding:7px 12px;border-radius:9px;font-size:14px;color:#4a5363;line-height:1.3;transition:all .16s;}
.wj-home .wj-cates ul li a:hover{background:#eaf1ff;color:#2b5ce6;transform:translateX(3px);}
.wj-home .wj-cates ul li a.on{background:linear-gradient(135deg,#3f6fe8,#2b5ce6);color:#fff;font-weight:600;box-shadow:0 6px 14px rgba(43,92,230,.28);}
.wj-home .wj-feature{flex:1;display:flex;gap:14px;min-width:0;}
.wj-home .wj-f-main{flex:1.12;position:relative;border-radius:16px;overflow:hidden;background:#dbe4fb center/cover no-repeat;box-shadow:0 14px 32px rgba(30,63,166,.18);display:block;transition:filter .3s;}
.wj-home .wj-f-main:hover{filter:brightness(1.08);}
.wj-home .wj-f-side{flex:1;display:flex;flex-direction:column;gap:10px;min-width:0;}
.wj-home .wj-f-item{flex:1;position:relative;border-radius:11px;overflow:hidden;background:#dbe4fb center/cover no-repeat;display:block;box-shadow:0 6px 16px rgba(31,39,51,.12);transition:all .25s;}
.wj-home .wj-f-item:hover{filter:brightness(1.12);transform:translateX(3px);}
.wj-home .wj-f-tag{position:absolute;top:14px;left:14px;z-index:2;background:linear-gradient(135deg,#3f6fe8,#1e3fa6);color:#fff;font-size:12px;font-weight:800;letter-spacing:2px;padding:5px 11px;border-radius:9px;box-shadow:0 6px 16px rgba(30,63,166,.45);}
.wj-home .wj-f-name{position:absolute;left:0;right:0;bottom:0;padding:36px 18px 14px;font-size:20px;font-weight:800;color:#fff;letter-spacing:.5px;background:linear-gradient(180deg,rgba(10,16,30,0) 0%,rgba(10,16,30,.3) 45%,rgba(10,16,30,.88) 100%);}
.wj-home .wj-f-sname{position:absolute;left:0;right:0;bottom:0;padding:16px 10px 7px;font-size:13px;font-weight:700;color:#fff;background:linear-gradient(180deg,rgba(10,16,30,0),rgba(10,16,30,.82));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* ============ A-plan: compact ranking rows ============ */
.wj-home .column-block-box li{margin-top:0;color:inherit;}
.wj-home .rk-row{display:flex;align-items:center;gap:10px;padding:6px;border-radius:9px;transition:background .16s;}
.wj-home .rk-row:hover{background:#f2f6ff;}
.wj-home .rk-no{flex-shrink:0;width:22px;height:22px;border-radius:7px;background:#eef1f7;color:#9aa1ab;font-size:13px;font-weight:800;text-align:center;line-height:22px;}
.wj-home .rk-n1{background:linear-gradient(135deg,#3f6fe8,#1e3fa6);color:#fff;box-shadow:0 3px 8px rgba(30,63,166,.3);}
.wj-home .rk-n2{background:linear-gradient(135deg,#5b86ee,#3f6fe8);color:#fff;}
.wj-home .rk-n3{background:linear-gradient(135deg,#86a6f4,#6b8ff0);color:#fff;}
.wj-home .rk-cover{flex-shrink:0;width:34px;height:46px;border-radius:5px;overflow:hidden;display:block;box-shadow:0 2px 6px rgba(31,39,51,.12);}
.wj-home .rk-cover img{width:100%;height:100%;object-fit:cover;display:block;}
.wj-home .column-block-box li:nth-child(n+4) .rk-cover{display:none;}
.wj-home .column-block-box li:nth-child(n+4){padding:4px 6px;}
.wj-home .rk-name{flex:1;font-size:14px;color:#2b3240;min-width:0;transition:color .16s;}
.wj-home .rk-row:hover .rk-name{color:#2b5ce6;}
.wj-home .sort-name.on{color:#2b5ce6;font-weight:700;}
.wj-home .wj-cates ul li:first-child a{background:linear-gradient(135deg,#3f6fe8,#2b5ce6);color:#fff;font-weight:600;box-shadow:0 6px 14px rgba(43,92,230,.28);}
.wj-home .class-block-box .class-head span:nth-child(3) .sort-name{color:#2b5ce6;font-weight:700;}

/* ===== A-plan v2: category 2-col + full-cover featured (no crop) ===== */
.wj-home .wj-cates{width:228px;align-self:flex-start;}
.wj-home .wj-cates ul{display:flex;flex-wrap:wrap;flex-direction:row;}
.wj-home .wj-cates ul li{width:50%;}
.wj-home .wj-cates ul li a{padding:7px 6px;font-size:13.5px;text-align:center;}
.wj-home .wj-cates ul li a:hover{transform:none;}
.wj-home .wj-books{flex:1;min-width:0;background:#fff;border-radius:18px;padding:16px 18px;box-shadow:0 10px 30px rgba(31,39,51,.06);display:flex;flex-direction:column;}
.wj-home .wj-books-head{display:flex;align-items:center;justify-content:space-between;position:relative;padding-left:13px;}
.wj-home .wj-books-head::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:17px;border-radius:3px;background:linear-gradient(180deg,#3f6fe8,#1e3fa6);}
.wj-home .wj-books-tit{font-size:17px;font-weight:800;color:#1f2733;}
.wj-home .wj-books-more{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:#2b5ce6;background:#eaf1ff;border:1px solid #d6e2fb;border-radius:999px;padding:5px 15px;line-height:1.4;transition:all .18s;}
.wj-home .wj-books-more .iconfont{font-size:12px;transition:transform .18s;}
.wj-home .wj-books-more:hover{background:linear-gradient(135deg,#3f6fe8,#2b5ce6);color:#fff !important;border-color:transparent;box-shadow:0 4px 12px rgba(43,92,230,.28);}
.wj-home .wj-books-more:hover .iconfont{transform:translateX(2px);}
.wj-home .wj-books-grid{display:flex;gap:13px;margin-top:14px;}
.wj-home .wj-book{flex:1;min-width:0;display:block;}
.wj-home .bk-cover{position:relative;display:block;width:100%;height:0;padding-bottom:132%;border-radius:10px;overflow:hidden;box-shadow:0 3px 10px rgba(31,39,51,.10);transition:transform .24s,box-shadow .24s;background:#eef1f7;}
.wj-home .bk-cover img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.wj-home .wj-book:hover .bk-cover{transform:translateY(-5px);box-shadow:0 14px 26px rgba(30,63,166,.20);}
.wj-home .wj-book:hover .bk-cover img{transform:scale(1.05);}
.wj-home .wj-book:first-child .bk-cover::after{content:"HOT";position:absolute;top:7px;left:7px;z-index:2;background:linear-gradient(135deg,#3f6fe8,#1e3fa6);color:#fff;font-size:10px;font-weight:800;letter-spacing:1px;padding:3px 7px;border-radius:6px;box-shadow:0 3px 8px rgba(30,63,166,.4);}
.wj-home .bk-name{display:block;margin-top:8px;font-size:13px;font-weight:600;color:#1f2733;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .16s;}
.wj-home .wj-book:hover .bk-name{color:#2b5ce6;}
