/* Trang chủ: tiêu đề khối to, rõ, cùng kiểu với trang chuyên mục (hub-v2.css) */
.sec-h{padding:44px 0 18px}
.sec-t{font-size:20px!important;letter-spacing:.02em!important;text-transform:none!important;font-weight:800!important}
.sec-more{font-size:12px!important}
.tag{font-size:11px!important;letter-spacing:.08em!important;padding:4px 10px!important;border-radius:4px}
@media(max-width:768px){.sec-t{font-size:18px!important}}

/* Hero trang chủ v2: ảnh sạch phía trên, chữ nằm dưới ảnh trên nền đặc; hero nằm trong khung 1392px */
.hero{width:min(1392px,calc(100% - 48px));margin:24px auto 0;min-height:0;grid-template-columns:1fr 400px;gap:20px;align-items:stretch}
.hero-main{padding:0!important;min-height:0!important;justify-content:flex-start;border-radius:16px;background:var(--surf);border:1px solid rgba(255,255,255,.1)}
.hero-main .h-img,.hero-main .h-bg{position:relative;inset:auto;flex:none;height:clamp(280px,31vw,450px);filter:none}
.hero-main .h-ov,.hero-main .h-scan,.hero-main .h-glow{display:none}
.hero-main .h-content{padding:24px 30px 28px}
.hero-main .h-title{font-size:clamp(24px,2.5vw,36px);line-height:1.22;text-shadow:none;margin:12px 0 12px}
.hero-main .h-sub{text-shadow:none;max-width:none;font-size:16px;margin-bottom:16px}
.hero-main .h-meta{text-shadow:none}
.hero-side{max-width:none;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:var(--surf);backdrop-filter:none;padding:24px}
@media(max-width:900px){
  .hero{width:100%;margin:0;grid-template-columns:1fr;gap:0}
  .hero-main{border-radius:0;border-left:0;border-right:0}
  .hero-main .h-img,.hero-main .h-bg{height:clamp(200px,56vw,300px)}
  .hero-main .h-content{padding:18px 16px 20px}
  .hero-main .h-title{font-size:clamp(22px,6vw,28px)}
  .hero-main .h-sub{font-size:15px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .hero-side{border-radius:0;border-left:0;border-right:0;padding:18px 16px}
}

/* Thẻ thống nhất: bo tròn đủ bốn góc, có khoảng cách giữa các thẻ (cùng kiểu hero) */
.f-grid{gap:18px;margin-top:18px}
.f-grid .fc,.f-grid .sc{border-radius:14px;overflow:hidden}
.f-grid .sc{border:1px solid rgba(255,255,255,.08)}
.rank-grid{gap:18px;margin-top:18px}
.rk-card{border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.anime-card{border-radius:12px;overflow:hidden}
.manga-grid{gap:18px;margin-top:18px}
.manga-col{border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.latest-wrap{gap:18px;margin-top:18px}
.latest-wrap>div,.latest-side{border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.cat-grid>*{border-radius:12px;overflow:hidden}

/* Thẻ nhỏ Tiêu điểm: ảnh cùng tỉ lệ 16:9 để hàng trên và hàng dưới cân nhau */
@media(min-width:901px){.f-grid{grid-template-rows:auto auto!important}.f-grid .sc .sc-img{flex:none;aspect-ratio:16/9;min-height:0}.f-grid .sc{min-height:0}}

/* Hero liền khối (như thẻ Chuyên sâu): ảnh phủ kín thẻ, chữ nằm đáy trên nền chuyển tối dần */
@media(min-width:901px){
  .hero-main{position:relative;overflow:hidden;justify-content:flex-end;min-height:560px!important}
  .hero-main .h-img,.hero-main .h-bg{position:absolute;inset:0;height:auto;flex:none;filter:none}
  .hero-main .h-ov{display:block!important;position:absolute;inset:0;background:linear-gradient(to top,rgba(11,4,24,.97) 0%,rgba(11,4,24,.82) 28%,rgba(11,4,24,.25) 55%,rgba(11,4,24,0) 100%)!important}
  .hero-main .h-content{position:relative;z-index:2;padding:32px 36px 34px}
  .hero-main .h-title{text-shadow:0 2px 16px rgba(0,0,0,.6)}
  .hero-main .h-sub{text-shadow:0 1px 10px rgba(0,0,0,.6)}
}
/* Sapo thẻ lớn kéo dài hết chiều ngang */
.f-grid .fc .fc-sub{max-width:none}
