/* roulang page: index */
:root{
  --tng-a:#FF6B4A;
  --tng-a2:#E8543A;
  --tng-a-soft:#FFF1EC;
  --tng-b:#2FB98D;
  --tng-c:#FFC94D;
  --tng-bg:#FFF7F0;
  --tng-band:#FDEFE4;
  --tng-ink:#241F1D;
  --tng-sub:#6E625C;
  --tng-line:#F0E2D6;
  --tng-rad:16px;
  --tng-r12:12px;
  --tng-shadow:0 2px 10px rgba(36,31,29,.05);
  --tng-shadow-h:0 10px 24px rgba(36,31,29,.10);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--tng-bg);color:var(--tng-ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4,p,figure{margin:0;}
ul,ol{list-style:none;margin:0;padding:0;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
button,input{font:inherit;color:inherit;}
h2{font-size:1.5rem;font-weight:700;line-height:1.35;}
h3{font-size:1.125rem;font-weight:600;line-height:1.5;}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--tng-a);outline-offset:3px;}

.kkc-wrap{max-width:1200px;margin:0 auto;padding:0 24px;}
.kkc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* 顶栏 */
.kkc-top{position:sticky;top:0;z-index:60;background:rgba(255,247,240,.88);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--tng-line);}
.kkc-topbar{display:flex;align-items:center;gap:20px;min-height:68px;}
.kkc-logo{display:flex;align-items:center;gap:10px;flex:none;}
.kkc-logo-mark{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#FF8A5C,#FF6B4A);color:#fff;display:grid;place-items:center;font-size:20px;font-weight:800;box-shadow:0 4px 12px rgba(255,107,74,.28);}
.kkc-brand{font-size:18px;font-weight:800;letter-spacing:.4px;}
.kkc-nav{margin-left:auto;display:flex;gap:2px;flex-wrap:wrap;}
.kkc-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;color:var(--tng-sub);font-size:15px;transition:background .2s ease,color .2s ease;}
.kkc-nav a:hover{color:var(--tng-a);background:var(--tng-a-soft);}
.kkc-menu{display:none;margin-left:auto;position:relative;}
.kkc-menu summary{list-style:none;display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--tng-a);color:var(--tng-a);font-size:15px;font-weight:600;cursor:pointer;background:#fff;}
.kkc-menu summary::-webkit-details-marker{display:none;}
.kkc-menu summary::after{content:"≡";margin-left:8px;font-size:17px;line-height:1;}
.kkc-drawer{position:absolute;right:0;top:calc(100% + 10px);min-width:210px;background:#fff;border:1px solid var(--tng-line);border-radius:var(--tng-rad);box-shadow:var(--tng-shadow-h);padding:8px;display:flex;flex-direction:column;}
.kkc-drawer a{display:flex;align-items:center;min-height:44px;padding:0 14px;border-radius:10px;color:var(--tng-sub);font-size:15px;}
.kkc-drawer a:hover{background:var(--tng-a-soft);color:var(--tng-a);}

/* 首屏 */
.kkc-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--tng-line);}
.kkc-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.kkc-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(255,247,240,.97) 0%,rgba(255,247,240,.92) 44%,rgba(255,247,240,.58) 100%);}
.kkc-hero-in{position:relative;z-index:1;padding:72px 0 64px;}
.kkc-h1{font-size:clamp(2rem,4vw,3.25rem);font-weight:800;letter-spacing:-.5px;line-height:1.2;margin-bottom:14px;}
.kkc-h1 span{color:var(--tng-a);}
.kkc-subtitle{font-size:18px;color:var(--tng-ink);font-weight:600;margin-bottom:10px;}
.kkc-hero-text{max-width:620px;font-size:16px;line-height:1.75;color:var(--tng-sub);margin-bottom:26px;}
.kkc-searchbar{display:flex;gap:10px;max-width:540px;margin-bottom:18px;}
.kkc-searchbar input{flex:1 1 auto;min-width:0;min-height:48px;border:1px solid var(--tng-line);border-radius:999px;background:#fff;padding:0 20px;font-size:15px;transition:border-color .2s ease,box-shadow .2s ease;}
.kkc-searchbar input::placeholder{color:#A6958C;}
.kkc-searchbar input:focus{border-color:var(--tng-a);box-shadow:0 0 0 3px rgba(255,107,74,.14);outline:none;}
.kkc-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 26px;border:0;border-radius:999px;background:var(--tng-a);color:#fff;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s ease,transform .2s ease,box-shadow .2s ease;}
.kkc-btn:hover{background:var(--tng-a2);transform:translateY(-1px);box-shadow:0 8px 18px rgba(232,84,58,.24);}
.kkc-btn--ghost{background:transparent;color:var(--tng-a);border:1.5px solid var(--tng-a);}
.kkc-btn--ghost:hover{background:var(--tng-a-soft);color:var(--tng-a2);box-shadow:none;}
.kkc-acts{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px;}
.kkc-strip{display:flex;gap:16px;overflow-x:auto;padding-bottom:6px;}
.kkc-strip li{flex:0 0 180px;}
.kkc-strip .kkc-thumb{aspect-ratio:16/9;margin:0;}

/* 板块 */
.kkc-sec{padding:64px 0;}
.kkc-bg-w{background:#fff;}
.kkc-bg-b{background:var(--tng-band);}
.kkc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px 32px;flex-wrap:wrap;margin-bottom:28px;}
.kkc-head h2{display:flex;align-items:center;gap:10px;}
.kkc-head h2::before{content:"";width:6px;height:22px;border-radius:4px;background:var(--tng-a);flex:none;}
.kkc-lead{max-width:640px;font-size:15px;color:var(--tng-sub);}

/* 卡片通用 */
.kkc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.kkc-grid--3{grid-template-columns:repeat(3,1fr);}
.kkc-grid--2{grid-template-columns:repeat(2,1fr);}
.kkc-card{background:#fff;border:1px solid var(--tng-line);border-radius:var(--tng-rad);box-shadow:var(--tng-shadow);padding:12px;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease;}
.kkc-card:hover{transform:translateY(-2px);box-shadow:var(--tng-shadow-h);}
.kkc-thumb{position:relative;overflow:hidden;border-radius:var(--tng-r12);background:#F6E7DA;margin-bottom:12px;}
.kkc-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .2s ease;}
.kkc-card:hover .kkc-thumb img,
.kkc-item:hover .kkc-thumb img,
.kkc-mini:hover .kkc-thumb img{transform:scale(1.03);}
.kkc-thumb--16x9{aspect-ratio:16/9;}
.kkc-thumb--3x2{aspect-ratio:3/2;}
.kkc-thumb--3x4{aspect-ratio:3/4;}
.kkc-thumb--21x9{aspect-ratio:21/9;}
.kkc-thumb--4x3{aspect-ratio:4/3;}
.kkc-badge{position:absolute;left:8px;bottom:8px;background:var(--tng-a);color:#fff;font-size:12px;line-height:1;padding:6px 10px;border-radius:999px;font-weight:600;}
.kkc-badge--tr{left:auto;bottom:auto;right:8px;top:8px;background:var(--tng-c);color:#5A3C00;}
.kkc-card h3{font-size:1rem;margin-bottom:6px;}
.kkc-card p{font-size:14px;color:var(--tng-sub);}
.kkc-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:auto;font-size:13px;color:var(--tng-sub);}
.kkc-dot{color:var(--tng-line);}

/* 频道矩阵 */
.kkc-chan{display:grid;grid-template-columns:repeat(6,1fr);gap:20px;}
.kkc-chan li{background:#fff;border:1px solid var(--tng-line);border-radius:var(--tng-rad);box-shadow:var(--tng-shadow);padding:20px 18px;}
.kkc-tag{display:inline-block;background:var(--tng-a-soft);color:var(--tng-a);font-size:15px;font-weight:600;padding:6px 14px;border-radius:999px;margin-bottom:10px;}
.kkc-chan p{font-size:14px;line-height:1.7;color:var(--tng-sub);}

/* 榜单 */
.kkc-rank{display:grid;grid-template-columns:repeat(2,1fr);gap:0 44px;}
.kkc-rank li{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px dashed var(--tng-line);}
.kkc-rank-no{flex:none;width:44px;height:44px;border-radius:12px;background:var(--tng-c);color:#5A3C00;display:grid;place-items:center;font-size:19px;font-weight:800;}
.kkc-rank-body{min-width:0;}
.kkc-rank-body h3{font-size:1rem;margin-bottom:2px;}
.kkc-rank-body p{font-size:14px;color:var(--tng-sub);}
.kkc-chip{flex:none;margin-left:auto;font-size:12px;line-height:1;padding:6px 11px;border-radius:999px;border:1px solid rgba(47,185,141,.45);color:#1F8A67;background:rgba(47,185,141,.08);}

/* 横排小卡 */
.kkc-mini{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--tng-line);border-radius:var(--tng-rad);box-shadow:var(--tng-shadow);padding:12px;transition:transform .2s ease,box-shadow .2s ease;}
.kkc-mini:hover{transform:translateY(-2px);box-shadow:var(--tng-shadow-h);}
.kkc-mini .kkc-thumb{width:120px;flex:none;aspect-ratio:4/3;margin-bottom:0;}
.kkc-mini h3{font-size:1rem;margin-bottom:4px;}
.kkc-mini p{font-size:13px;color:var(--tng-sub);}

/* 频道精选 */
.kkc-feat{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;padding:28px 0;border-bottom:1px solid var(--tng-line);}
.kkc-feat:last-child{border-bottom:0;padding-bottom:0;}
.kkc-feat:first-child{padding-top:0;}
.kkc-feat--rev .kkc-feat-media{order:2;}
.kkc-feat-media .kkc-thumb{aspect-ratio:16/10;margin-bottom:0;}
.kkc-feat-body h3{font-size:1.125rem;margin-bottom:8px;}
.kkc-feat-body p{font-size:15px;color:var(--tng-sub);margin-bottom:12px;}
.kkc-feat-list{display:flex;flex-direction:column;gap:8px;}
.kkc-feat-list li{display:flex;align-items:center;gap:8px;font-size:15px;}
.kkc-feat-list li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--tng-a);flex:none;}

/* 推荐清单 */
.kkc-list{display:grid;gap:16px;}
.kkc-item{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--tng-line);border-radius:var(--tng-rad);box-shadow:var(--tng-shadow);padding:12px;transition:transform .2s ease,box-shadow .2s ease;}
.kkc-item:hover{transform:translateY(-2px);box-shadow:var(--tng-shadow-h);}
.kkc-item .kkc-thumb{width:120px;flex:none;aspect-ratio:4/3;margin-bottom:0;}
.kkc-item h3{font-size:1rem;margin-bottom:2px;}
.kkc-item p{font-size:14px;color:var(--tng-sub);}
.kkc-state{flex:none;margin-left:auto;font-size:12px;line-height:1;padding:7px 13px;border-radius:999px;background:rgba(47,185,141,.12);color:#1F8A67;font-weight:600;}

/* 资讯 */
.kkc-news li{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--tng-line);}
.kkc-news li:first-child{padding-top:0;}
.kkc-news li:last-child{border-bottom:0;padding-bottom:0;}
.kkc-news .kkc-thumb{width:150px;flex:none;aspect-ratio:16/9;margin-bottom:0;}
.kkc-news h3{font-size:1rem;}
.kkc-date{flex:none;margin-left:auto;font-size:13px;color:var(--tng-sub);background:var(--tng-a-soft);color:#B8452B;padding:5px 12px;border-radius:999px;}

/* 问答 */
.kkc-faq details{background:#fff;border:1px solid var(--tng-line);border-radius:14px;padding:16px 20px;margin-bottom:12px;transition:border-color .2s ease;}
.kkc-faq details:last-child{margin-bottom:0;}
.kkc-faq details[open]{border-color:rgba(255,107,74,.45);}
.kkc-faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:1rem;font-weight:600;cursor:pointer;min-height:26px;}
.kkc-faq summary::-webkit-details-marker{display:none;}
.kkc-faq summary::after{content:"+";color:var(--tng-a);font-size:20px;font-weight:700;line-height:1;flex:none;}
.kkc-faq details[open] summary::after{content:"–";}
.kkc-faq p{margin-top:12px;font-size:15px;color:var(--tng-sub);}

/* 提示条 */
.kkc-tips{background:repeating-linear-gradient(45deg,#FFF3D6 0,#FFF3D6 12px,#FFE9B8 12px,#FFE9B8 24px);border-top:1px solid #F3DDA9;border-bottom:1px solid #F3DDA9;padding:22px 0;}
.kkc-tips p{text-align:center;font-size:15px;font-weight:600;color:#6B4A00;}

/* 页脚 */
.kkc-foot{background:#fff;border-top:1px solid var(--tng-line);padding-top:56px;}
.kkc-foot-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.1fr;gap:32px;padding-bottom:40px;}
.kkc-foot h4{font-size:15px;font-weight:700;margin-bottom:12px;}
.kkc-foot p{font-size:14px;color:var(--tng-sub);}
.kkc-foot-list{display:flex;flex-direction:column;}
.kkc-foot-list a,.kkc-foot-list span{display:flex;align-items:center;min-height:44px;font-size:14px;color:var(--tng-sub);}
.kkc-foot-list a:hover{color:var(--tng-a);}
.kkc-copy{border-top:1px solid var(--tng-line);padding:18px 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--tng-sub);}

@media (max-width:1024px){
  .kkc-grid{grid-template-columns:repeat(2,1fr);}
  .kkc-grid--3{grid-template-columns:repeat(2,1fr);}
  .kkc-chan{grid-template-columns:repeat(3,1fr);}
  .kkc-foot-grid{grid-template-columns:repeat(2,1fr);}
  .kkc-rank{gap:0 28px;}
}
@media (max-width:768px){
  .kkc-wrap{padding:0 20px;}
  .kkc-nav{display:none;}
  .kkc-menu{display:block;}
  .kkc-sec{padding:44px 0;}
  .kkc-hero-in{padding:48px 0 44px;}
  .kkc-hero-text{font-size:15px;}
  .kkc-rank{grid-template-columns:1fr;}
  .kkc-chip{display:none;}
  .kkc-feat{grid-template-columns:1fr;gap:18px;}
  .kkc-feat--rev .kkc-feat-media{order:0;}
  .kkc-grid--2{grid-template-columns:1fr;}
  .kkc-specs{grid-template-columns:1fr;}
  .kkc-strip li{flex:0 0 150px;}
  .kkc-head{margin-bottom:22px;}
}
@media (max-width:520px){
  .kkc-wrap{padding:0 16px;}
  .kkc-grid,.kkc-grid--3,.kkc-chan,.kkc-foot-grid{grid-template-columns:1fr;}
  .kkc-searchbar{flex-direction:column;align-items:stretch;}
  .kkc-searchbar input,.kkc-searchbar .kkc-btn{width:100%;}
  .kkc-acts .kkc-btn{width:100%;}
  .kkc-item{flex-direction:column;align-items:flex-start;}
  .kkc-item .kkc-thumb{width:100%;aspect-ratio:16/9;}
  .kkc-state{margin-left:0;}
  .kkc-news li{flex-wrap:wrap;}
  .kkc-news .kkc-thumb{width:104px;}
  .kkc-news h3{flex:1 1 150px;font-size:15px;}
  .kkc-date{margin-left:0;}
  .kkc-mini .kkc-thumb{width:96px;}
  .kkc-h1{font-size:1.85rem;}
  .kkc-brand{font-size:17px;}
}